SpreadJS Sheets Collaboration
SpreadJS는 동시 편집 프레임워크와 확장 패키지 spread-sheets-collaboration, 그리고 SpreadJS 플러그인 spread-sheets-collaboration-addon을 통합하여 로컬 동기화와 원격 동시 작업 모두에서 매끄러운 사용 경험을 제공합니다. 이를 통해 실시간 다중 사용자 동시 작업 편집이 가능합니다.
아키텍처 설계
전체 프로세스
핵심 구성 요소
동시 편집 프레임워크: 실시간 동시 작업을 위한 기반 프레임워크로, 클라이언트와 서버 간의 통신 및 작업 동기화를 처리합니다.
SpreadJS Sheets Collaboration: Collaboration Service용 확장 패키지로, 워크북을 위한 전용 OT(Operational Transformation) 타입을 제공합니다. 동시 편집 중 데이터 일관성을 보장하기 위해 Reducer 및 Transform 로직을 포함합니다.
SpreadJS Sheets Collaboration Add-on: 워크북용 플러그인으로, 데이터 모델 변경을 감지하고 작업(op)을 생성하여 ChangeSets로 통합한 뒤 서버와 연동합니다. 또한 서버에서 전달된 ChangeSets를 로컬 데이터 모델에 적용합니다.
동작 메커니즘
로컬 동기화:
spread-sheets-collaboration-addon플러그인만 사용하며, 데이터 모델 변경을 감시하여 서버 개입 없이 동일 페이지 내 여러 워크북 인스턴스 간 동기화를 수행합니다.원격 동시 작업:
spread-sheets-collaboration-addon이 워크북 데이터 모델 변경을 감지하고 해당 작업을 생성해 ChangeSets로 통합합니다. 이는 Collaboration Service 프레임워크를 통해 서버로 전송됩니다. 서버는 Collaboration Service의 통신 및 처리 기능과spread-sheets-collaboration에 등록된 OT 타입(Transform, Reducer 로직 포함)을 결합해 작업을 처리한 후, 모든 연결된 클라이언트에 브로드캐스트하여 사용자 간 실시간 동시 작업을 구현합니다.
사용 사례
단일 사용자 다중 뷰:
spread-sheets-collaboration-addon을 사용하면 동일 페이지 내 여러 워크북 인스턴스가 하나의 문서를 동시에 사용할 수 있어, 다양한 보기 또는 편집 관점이 필요한 시나리오에 적합합니다.팀 동시 작업:
spread-sheets-collaboration과 함께 사용하면 실시간 다중 사용자 편집을 지원하여 팀 단위 공유 및 동시 작업 처리에 적합합니다.권한 제어: 사용자별로 편집 또는 읽기 전용 권한을 부여할 수 있어 동시 작업의 유연성과 보안을 강화합니다.
기능 개요
실시간 동시 작업
다중 사용자 편집: 여러 사용자가 동일한 워크북 문서를 동시에 편집하며, 모든 작업이 실시간으로 동기화됩니다.
OT(Operational Transformation): 셀 업데이트, 행 삽입 등 동시 작업의 일관성과 정확성을 보장하기 위해 사용자 정의 OT 타입을 사용합니다.
온라인 Presence
사용자 식별: 다른 동시 작업 사용자의 선택 영역과 이름의 이니셜을 표시하여 각 사용자의 작업 위치를 쉽게 식별할 수 있습니다.
사용자 정의 색상: 사용자별 색상을 설정할 수 있어 각 동시 작업 사용자의 선택 영역 가시성을 향상시킵니다.
권한 관리
편집 모드: 문서 내용을 직접 수정할 수 있습니다.
보기 모드: 편집 없이 문서 보기만 가능합니다.
로컬 동기화
다중 인스턴스 동기화: 동일 페이지 내 여러 워크북 인스턴스가 실시간으로 업데이트를 동기화하여, 단일 사용자 다중 뷰 시나리오에 적합합니다.
동시 작업 편집 상태
실시간 편집 상태 반영: 행 추가, 열 숨김 등 충돌 가능 작업이 현재 사용자 편집 상태에 영향을 미칠 경우, 편집 상태를 업데이트하고 UI 표시를 일관되게 유지합니다.
현재 제한 사항
동시 작업에서 지원되지 않는 기능:
모든 바인딩 관련 기능(테이블 수준 바인딩, 시트 수준 바인딩, 셀 수준 바인딩)
모든 데이터 매니저 관련 기능(데이터 차트, 간트 시트, 테이블 시트, 리포트 시트)
FloatingObject 및 LegacyCharts
사용자 정의 기능(cellType, custom function)은 제품 직렬화 정책을 따릅니다.
사용자 정의 cellType을 등록하고 모든 클라이언트에 배포하면 동시 작업이 가능합니다.
일부 클라이언트 환경에만 사용자 정의 함수를 등록한 경우, 해당 함수가 없는 클라이언트에서는
#NAME!이 표시됩니다.
SpreadJS 동시 작업 정책
SpreadJS의 동시 작업 사용 사례에서는 기본 동시 작업 메커니즘의 차이로 인해 일부 API 사용 시 새로운 정책을 따라야 합니다. 자세한 내용은 다음을 참조하십시오:
보다 상세한 기술 구현이나 예제 코드는 각 기능 단위의 문서를 참조하십시오.