Your SlideShare is downloading. ×
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Operational Transformation in node.js
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Operational Transformation in node.js

6,910

Published on

play.node(http://nodeconf.kr/2012/)에서 이야기. 협업 기반 소프트웨어에 node.js가 잘 어울린다. \(^_^)/ 노사모~

play.node(http://nodeconf.kr/2012/)에서 이야기. 협업 기반 소프트웨어에 node.js가 잘 어울린다. \(^_^)/ 노사모~

0 Comments
21 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
6,910
On Slideshare
0
From Embeds
0
Number of Embeds
7
Actions
Shares
0
Downloads
66
Comments
0
Likes
21
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Operational Transformation in Node.js (웹 기반 협업 소프트웨어는 Node.js) 홍영택 (사이냅소프트, 노사모)12년 11월 20일 화요일
  • 2. Operational Transformation in Node.js (웹 기반 협업 소프트웨어는 Node.js) 홍영택 (사이냅소프트, 노사모)12년 11월 20일 화요일
  • 3. Operational Transformation in Node.js (웹 기반 협업 소프트웨어는 Node.js) 홍영택 (사이냅소프트, 노사모)12년 11월 20일 화요일
  • 4. About Me Javascript12년 11월 20일 화요일
  • 5. 12년 11월 20일 화요일
  • 6. 12년 11월 20일 화요일
  • 7. 12년 11월 20일 화요일
  • 8. NAVER Office12년 11월 20일 화요일
  • 9. 지난 3년간의 삽질로~12년 11월 20일 화요일
  • 10. NAVER Office 2012.9.25 오픈12년 11월 20일 화요일
  • 11. 그게 무슨 웹오피스야!!!12년 11월 20일 화요일
  • 12. 12년 11월 20일 화요일
  • 13. 12년 11월 20일 화요일
  • 14. 나도 ‘Fan’이야12년 11월 20일 화요일
  • 15. 이게 웹 오피스야~!!!12년 11월 20일 화요일
  • 16. 그래
  • 17.  동시편집
  • 18.  만들자-!12년 11월 20일 화요일
  • 19. 편집기 만들기12년 11월 20일 화요일
  • 20. 입력 출력12년 11월 20일 화요일
  • 21. 이벤트 핸들러12년 11월 20일 화요일
  • 22. 이벤트 핸들러12년 11월 20일 화요일
  • 23. 이벤트 핸들러 도큐먼트 모델12년 11월 20일 화요일
  • 24. 이벤트 핸들러 도큐먼트 모델 렌더러12년 11월 20일 화요일
  • 25. 이벤트 핸들러 도큐먼트 모델 렌더러 코드가 많아12년 11월 20일 화요일
  • 26. ‘가’ 이벤트 핸들러 도큐먼트 모델 렌더러12년 11월 20일 화요일
  • 27. ‘가’ doc.addText(‘가’) 이벤트 핸들러 도큐먼트 모델 렌더러12년 11월 20일 화요일
  • 28. ‘가’ doc.addText(‘가’) 이벤트 핸들러 도큐먼트 모델 렌더러 renderer.paint(para)12년 11월 20일 화요일
  • 29. ‘가’ doc.addText(‘가’) 이벤트 핸들러 도큐먼트 모델 P가/P {HTML} 렌더러 renderer.paint(para)12년 11월 20일 화요일
  • 30. 입력 처리기 도큐먼트 모델 렌더러12년 11월 20일 화요일
  • 31. 학기말 과제 작성중... ‘node cookbook’ 번역중... 난 그냥 들어와 봤어...12년 11월 20일 화요일
  • 32. ‘node cookbook’ 번역중... 나도 껴줘~!!!12년 11월 20일 화요일
  • 33. 12년 11월 20일 화요일
  • 34. ‘가’12년 11월 20일 화요일
  • 35. ‘가’ doc.addText(‘가’)12년 11월 20일 화요일
  • 36. ‘가’ doc.addText(‘가’) update(doc)12년 11월 20일 화요일
  • 37. ‘가’ doc.addText(‘가’) update(doc) change(doc)12년 11월 20일 화요일
  • 38. ‘가’ doc.addText(‘가’) update(doc) renderer.paint(para) change(doc) renderer.paint(doc)12년 11월 20일 화요일
  • 39. ‘가’ doc.addText(‘가’) update(doc) P가/P renderer.paint(para) {HTML} change(doc) P가/P renderer.paint(doc) {HTML}12년 11월 20일 화요일
  • 40. ‘가’ doc.addText(‘가’) update(doc) P가/P renderer.paint(para) {HTML} 동일한 결과~!!! change(doc) P가/P renderer.paint(doc) {HTML}12년 11월 20일 화요일
  • 41. ‘가’ doc.addText(‘가’) update(doc) P가/P renderer.paint(para) 하지만 문서를 전송해서 {HTML} 느리다~!!! change(doc) P가/P renderer.paint(doc) {HTML}12년 11월 20일 화요일
  • 42. ‘가’ ‘나’12년 11월 20일 화요일
  • 43. ‘가’ doc.addText(‘가’) doc.addText(‘나’) ‘나’12년 11월 20일 화요일
  • 44. ‘가’ doc.addText(‘가’) update(doc) doc.addText(‘나’) ‘나’ update(doc)12년 11월 20일 화요일
  • 45. ‘가’ doc.addText(‘가’) update(doc) doc.addText(‘나’) ‘나’ update(doc) Conflict! 동시편집은 무리12년 11월 20일 화요일
  • 46. • 문서 전체 전송으로 Network 사용량이 많음 • 따라서 느림12년 11월 20일 화요일
  • 47. • 문서 전체 전송으로 Network 사용량이 많음 • 따라서 느림 스타크래프트 마린부대는 이동중 모든 좌표를 전송할까?12년 11월 20일 화요일
  • 48. • 문서 전체 전송으로 Network 사용량이 많음 • 따라서 느림 • Conflict 발생12년 11월 20일 화요일
  • 49. OT (Operational
  • 50.  Transformation)12년 11월 20일 화요일
  • 51. OT
  • 52.  (wikipedia) • Operational transformation(OT) is a technology for supporting a range of collaboration functionalities in advanced collaborative software systems.12년 11월 20일 화요일
  • 53. OT
  • 54.  (wikipedia) • Operational transformation(OT) is a technology for supporting a range of collaboration functionalities in advanced collaborative software systems.12년 11월 20일 화요일
  • 55. replicated
  • 56.  architecture
  • 57.  for
  • 58.  shared
  • 59.  documents12년 11월 20일 화요일
  • 60. replicated
  • 61.  architecture
  • 62.  for
  • 63.  shared
  • 64.  documents Operation 실행12년 11월 20일 화요일
  • 65. replicated
  • 66.  architecture
  • 67.  for
  • 68.  shared
  • 69.  documents Operation 전송12년 11월 20일 화요일
  • 70. replicated
  • 71.  architecture
  • 72.  for
  • 73.  shared
  • 74.  documents Operation 변환12년 11월 20일 화요일
  • 75. replicated
  • 76.  architecture
  • 77.  for
  • 78.  shared
  • 79.  documents Operation 실행12년 11월 20일 화요일
  • 80. OT Basics Client 1 Client 2 “APL” “APL”Time12년 11월 20일 화요일
  • 81. OT Basics Client 1 Client 2 “APL” “APL” O1 = INS(1, ‘P’) “APPL”Time12년 11월 20일 화요일
  • 82. O1 = INS(1, ‘P’)12년 11월 20일 화요일
  • 83. INSERT : 삽입 O1 = INS(1, ‘P’)12년 11월 20일 화요일
  • 84. 글자의 삽입 위치 O1 = INS(1, ‘P’) 삽입 문자12년 11월 20일 화요일
  • 85. O1 = INS(1, ‘P’) “APL” ?12년 11월 20일 화요일
  • 86. O1 = INS(1, ‘P’) “APL” “APPL”12년 11월 20일 화요일
  • 87. OT Basics Client 1 Client 2 “APL” “APL” O1 = INS(1, ‘P’) “APPL”Time12년 11월 20일 화요일
  • 88. OT Basics Client 1 Client 2 “APL” “APL” O1 = INS(1, ‘P’) O2 = INS(3, ‘E’) “APPL” “APLE”Time12년 11월 20일 화요일
  • 89. OT Basics Client 1 Client 2 “APL” “APL” O1 = INS(1, ‘P’) O2 = INS(3, ‘E’) “APPL” “APLE”Time O1 = INS(1, ‘P’) “APPLE”12년 11월 20일 화요일
  • 90. OT Basics Client 1 Client 2 “APL” “APL” O1 = INS(1, ‘P’) O2 = INS(3, ‘E’) “APPL” “APLE”Time O2 = INS(3, ‘E’) O1 = INS(1, ‘P’) “APPEL” “APPLE”12년 11월 20일 화요일
  • 91. OT Basics Client 1 Client 2 “APL” “APL” O1 = INS(1, ‘P’) O2 = INS(3, ‘E’) “APPL” “APLE”Time O2 = INS(3, ‘E’) O1 = INS(1, ‘P’) “APPEL” APPEL ≠ APPLE “APPLE”12년 11월 20일 화요일
  • 92. OT Basics Client 1 Client 2 “APL” “APL”Time12년 11월 20일 화요일
  • 93. OT Basics Client 1 Client 2 “APL” “APL” O1 = INS(1, ‘P’) “APPL”Time12년 11월 20일 화요일
  • 94. OT Basics Client 1 Client 2 “APL” “APL” O1 = INS(1, ‘P’) O2 = INS(3, ‘E’) “APPL” “APLE”Time12년 11월 20일 화요일
  • 95. OT Basics Client 1 Client 2 “APL” “APL” O1 = INS(1, ‘P’) O2 = INS(3, ‘E’) “APPL” “APLE”Time O1’ = INS(1, ‘P’) “APPLE”12년 11월 20일 화요일
  • 96. OT Basics Client 1 Client 2 “APL” “APL” O1 = INS(1, ‘P’) O2 = INS(3, ‘E’) “APPL” “APLE”Time O2’ = INS(4, ‘E’) O1’ = INS(1, ‘P’) “APPLE” “APPLE”12년 11월 20일 화요일
  • 97. OT Basics Client 1 Client 2 “APL” “APL” O1 = INS(1, ‘P’) O2 = INS(3, ‘E’) “APPL” “APLE”Time O2’ : index++ O2’ = INS(4, ‘E’) O1’ = INS(1, ‘P’) “APPLE” “APPLE”12년 11월 20일 화요일
  • 98. OT Basics Client 1 Client 2 “APL” “APL” O1 = INS(1, ‘P’) O2 = INS(3, ‘E’) “APPL” “APLE”Time O2’ = INS(4, ‘E’) O1’ = INS(1, ‘P’) “APPLE” APPLE = APPLE “APPLE”12년 11월 20일 화요일
  • 99. OT Basics Client 1 Client 2 “APL” “APL” O1 = INS(1, ‘P’) O2 = INS(3, ‘E’) “APPL” “APLE”Time O2’ = INS(4, ‘E’) O1’ = INS(1, ‘P’) “APPLE” APPLE = APPLE “APPLE”12년 11월 20일 화요일
  • 100. OT Basics O1⋅O2 = O2⋅O1 where (O1, O2) = transform(O1, O2)12년 11월 20일 화요일
  • 101. • 문서 전체 전송으로 Network 사용량이 많음 • 느림 • Conflict 발생12년 11월 20일 화요일
  • 102. 12년 11월 20일 화요일
  • 103. 12년 11월 20일 화요일
  • 104. 12년 11월 20일 화요일
  • 105. 12년 11월 20일 화요일
  • 106. 12년 11월 20일 화요일
  • 107. OT OT Client Server12년 11월 20일 화요일
  • 108. Operation만 전송 OT OT Client Server12년 11월 20일 화요일
  • 109. 문제
  • 110.  없나요?12년 11월 20일 화요일
  • 111. OT OT Client Server12년 11월 20일 화요일
  • 112. OT OT Client Server12년 11월 20일 화요일
  • 113. 비슷하게 생겼는데 쉽게 포팅 가능? class Document { public Document(){ ... var document = { } insertText : function(){ public void insertText(){ ... ... }, } deleteText : function(){ public void deleteText(){ ... ... }, } updateStyle : function(){ public void updateStyle(){ ... ... }, } ... ... }; };12년 11월 20일 화요일
  • 114. Javascript는 Java와 완전히 달라 - 더글라스 크락포드(JSON inventor)12년 11월 20일 화요일
  • 115. 클로 져 자바스크립트 “C 언어의 옷을 입은 LISP” - 더글라스 크락포드 급 객체 수 =일 함12년 11월 20일 화요일
  • 116. 이벤트 핸들러 도큐먼트 모델 렌더러 코드가 많아12년 11월 20일 화요일
  • 117. 문제의 본질은 중복12년 11월 20일 화요일
  • 118. • 문서 전체 전송으로 Network 사용량이 많음 • 느림 • Conflict 발생 • Document Model 중복코드12년 11월 20일 화요일
  • 119. 한편...12년 11월 20일 화요일
  • 120. 이벤트 기반의 논 블러킹 I/O 작은 서버 - 라이언 달(Node.js 창시자)12년 11월 20일 화요일
  • 121. C? 루아? 하스켈?12년 11월 20일 화요일
  • 122. Javascript !!!12년 11월 20일 화요일
  • 123. 12년 11월 20일 화요일
  • 124. Javascript가 서버에서 돌아간다 ㅠㅠ12년 11월 20일 화요일
  • 125. class Document { public Document(){ var document = { ... insertText : function(){ } ... public void insertText(){ }, ... deleteText : function(){ } ... public void deleteText(){ }, ... updateStyle : function(){ } ... public void updateStyle(){ }, ... ... } }; ... };12년 11월 20일 화요일
  • 126. OT OT Client Server 같은 코드12년 11월 20일 화요일
  • 127. • 문서 전체 전송으로 Network 사용량이 많음 • 느림 • Conflict 발생 • Document Model 중복코드12년 11월 20일 화요일
  • 128. One
  • 129.  more
  • 130.  thing... R.I.P.
  • 131.  Jobs12년 11월 20일 화요일
  • 132. JSON to POJO OR-MAPPING POJO to JSON JSON POJO Table Browser Server RDB12년 11월 20일 화요일
  • 133. 우린 왜? 이유없이 데이터 형변환을 하고 있을까? 문서에 무결성이 왠말이냐 ㅠㅠ12년 11월 20일 화요일
  • 134. • 문서 전체 전송으로 Network 사용량이 많음 • 느림 • Conflict 발생 • Javascript, Java 중복코드 • 불필요한 데이터 형변환12년 11월 20일 화요일
  • 135. JSON to POJO OR-MAPPING POJO to JSON JSON JSON Document Browser Server NoSQL12년 11월 20일 화요일
  • 136. Interfacing with Databases nano cradle mongoskin 가벼운 강력함 깨끗한 API API API12년 11월 20일 화요일
  • 137. • 문서 전체 전송으로 Network 사용량이 많음 • 느림 • Conflict 발생 • Javascript, Java 중복코드 • 불필요한 데이터 형변환12년 11월 20일 화요일
  • 138. 결론 기술 서비스 기술 서비스12년 11월 20일 화요일
  • 139. 웹 기 Single Page App은 node.js로 수렴 반 협 업12년 11월 20일 화요일
  • 140. FAQ12년 11월 20일 화요일
  • 141. FAQ Q) 서버측과 클라이언트측 코드를 통합할때 호환성 문제는 없나요?12년 11월 20일 화요일
  • 142. FAQ Q) 서버측과 클라이언트측 코드를 통합할때 호환성 문제는 없나요? A) 노드는 ECMA 5의 기본적인 메소드를 가지고 있습니다. IE8 같은 구형 브라우저는 ECMA 5의 일부 메소드만 지원합니다. 교집합을 찾으셔야 원할하게 코딩할 수 있습니다. http://kangax.github.com/es5-compat-table/12년 11월 20일 화요일
  • 143. FAQ Q) 동시편집을 위한 Node.js에 OT 모듈이 있나요?12년 11월 20일 화요일
  • 144. Shar eJS 동시편집 http://synapoffice.com/12년 11월 20일 화요일
  • 145. c t n e on c Shar eJS 동시편집 nt io- clie et. sock12년 11월 20일 화요일
  • 146. QA susukang98@gmail.com12년 11월 20일 화요일
  • 147. 감사합니다.12년 11월 20일 화요일

×