[]
        
(Showing Draft Content)

동시 작업 프레임워크

동시 작업 프레임워크는 양방향 통신과 핵심 동기화 기능을 통해 실시간 다중 사용자 동시 작업을 가능하게 하는 JavaScript 프레임워크입니다. 다음 모듈을 포함합니다:

  • js-collaboration: 실시간 데이터 동기화 및 메시지 브로드캐스팅을 제공하는 핵심 통신 프레임워크입니다.

  • js-collaboration-ot: 다중 사용자 동시 작업과 충돌 해결을 지원하는 OT(Operational Transformation) 추가 모듈입니다.

  • js-collaboration-presence: 실시간 사용자 상태 공유를 지원하는 사용자 프레즌스 추가 모듈입니다.

사용 사례

  • 다중 사용자 동시 작업 문서 작업(리치 텍스트, 스프레드시트, 코드)

  • 실시간 채팅 동기화

  • 동시 작업 화이트보드 및 디자인 도구

  • 실시간 다중 사용자 상호작용이 필요한 애플리케이션

아키텍처

아래 다이어그램과 같이, 동시 작업 프레임워크는 표준 클라이언트-서버 아키텍처를 사용합니다.​​ 이 설계는 실시간 동시 작업 시스템 패턴을 따르며, 메시지 전달 메커니즘을 통해 구성 요소의 동작을 조정합니다.​

architecture1.f096bb.png

이 프레임워크는 spread-sheets-collaborative, quillis-collaboration과 같은 특정 기능을 위한 동시 작업 프레임워크로 확장할 수 있습니다.

architecture2.b53467.png

js-collaboration

js-collaboration은 WebSocket을 통해 실시간 데이터 동기화를 제공하여 클라이언트와 서버 간 양방향 통신을 가능하게 합니다.

핵심 기능

  • 양방향 통신: 클라이언트와 서버 간 양방향 메시지 전송을 지원합니다.

  • 룸 관리: 격리된 룸을 통해 다중 사용자 동시 작업을 가능하게 합니다.

  • 메시지 브로드캐스팅: 동일한 룸 내에서 메시지를 브로드캐스팅하여 실시간 알림을 제공합니다.

  • 자동 재연결: 연결이 끊어진 경우 하트비트 감지 및 자동 재연결 기능을 제공합니다.

  • 미들웨어 및 후크: 연결 및 메시지 처리 워크플로에 사용자 지정 로직을 삽입할 수 있도록 지원합니다.

NPM 패키지

js-collaboration은 표준 npm 패키지로 캡슐화되어 클라이언트-서버 환경에서 분리 배포를 지원합니다.​​

  • 서버: @mescius/js-collaboration

  • 클라이언트: @mescius/js-collaboration-client

js-collaboration-ot

js-collaboration-otOT(Operational Transformation) 기술을 기반으로 하며, 여러 사용자가 동일한 모델을 동시에 작업할 수 있도록 합니다.

핵심 기능

  • 사용자 지정 OT 유형: 다양한 비즈니스 요구 사항을 충족하기 위해 사용자 지정 작업 유형을 정의할 수 있습니다.

  • 데이터 영속성: 데이터베이스 스토리지와의 통합을 위한 어댑터 인터페이스를 제공합니다.

  • 프래그먼트 메커니즘: 대용량 문서의 동기화 성능을 향상합니다.

  • 충돌 해결: OT 알고리즘을 통해 데이터 일관성을 보장합니다.

  • 미들웨어 및 후크: 동시 작업 워크플로에 유효성 검사, 로깅 등의 로직을 삽입할 수 있도록 지원합니다.

NPM 패키지

js-collaboration-ot는 표준 npm 패키지로 캡슐화되어 클라이언트-서버 환경에서 분리 배포를 지원합니다.​​

  • 서버: @mescius/js-collaboration-ot

  • 클라이언트: @mescius/js-collaboration-ot-client

두 가지 표준화된 데이터베이스 어댑터 구현을 제공합니다.​​

  • PostgreSQL: @mescius/js-collaboration-ot-postgres

  • Sqlite3: @mescius/js-collaboration-ot-sqlite

js-collaboration-presence

js-collaboration-presence는 커서 위치, 선택 영역 등과 같은 사용자 상태를 실시간 동시 작업 환경에서 공유할 수 있도록 합니다.

핵심 기능

  • 실시간 사용자 상태 공유: 커서 위치 및 선택 영역과 같은 정보의 동기화를 지원합니다.

  • 이벤트 수신: 사용자 참여, 나가기 및 기타 상태 업데이트와 같은 이벤트를 수신할 수 있습니다.

사용 사례

  • 다중 사용자 문서 작업에서 커서 위치를 실시간으로 표시합니다.

  • 스프레드시트 동시 작업에서 다른 사용자가 선택한 셀을 표시합니다.

  • 코드 편집기에서 동시 작업자의 작업 영역을 강조 표시합니다.

NPM 패키지

js-collaboration-presence는 표준 npm 패키지로 캡슐화되어 클라이언트-서버 환경에서 분리 배포를 지원합니다.​​