1042366: UG content for common collaborator

Document-Processing-toc.html

@@ -8473,6 +8473,23 @@
         <li>
             <a href="/document-processing/common/font-manager">Font Manager</a>
         </li>
+    </ul>
+	</li>
+	<li>
+    Collaborator
+    <ul>
+        <li>
+            <a href="/document-processing/Collaborator/overview">Collaborator</a>
+        </li>
+		<li>
+            <a href="/document-processing/Collaborator/collaboration-client">Collaboration Client</a>
+        </li>
+		<li>
+            <a href="/document-processing/Collaborator/collaboration-server">Collaboration Server</a>
+        </li>
+		<li>
+            <a href="/document-processing/Collaborator/faq">FAQ</a>
+        </li>
     </ul>
 	</li>
 	<li>

Document-Processing/Collaborator/collaboration-client.md

@@ -0,0 +1,91 @@
+# Collaboration Client
+
+The Collaboration Client (@syncfusion/ej2\-collaborator) is a browser\-side library that enables real\-time collaborative editing in Syncfusion Essential JS 2 (EJ2) components such as **Document Editor**, **PDF Viewer**, and **Spreadsheet**.
+
+It connects the client application to a Collaboration Server, synchronizes user actions across participants, and applies remote updates in real time.
+
+## Package Information
+
+- **Package:** @syncfusion/ej2\-collaborator
+
+- **Runtime:** Browser\-based applications (Angular, React, Vue, JavaScript, and TypeScript)
+
+- **Supported Transports:** 
+
+   - SignalR
+
+   - WebSocket
+
+## Key Responsibilities
+
+The Collaboration Client:
+
+- Connects to the Collaboration Server.
+
+- Joins and leaves collaboration sessions.
+
+- Sends local editing actions to the server.
+
+- Receives remote actions from other participants.
+
+- Keeps content synchronized across all connected users.
+
+
+## Supported Backends
+
+The same client can be used with different Collaboration Server implementations.
+|**Connection Type**|**Supported Server**|
+|:---|:---|
+|SignalR|ASP.NET Core|
+|WebSocket|ASP.NET Core|
+|WebSocket|ASP.NET MVC|
+|WebSocket|Node.js|
+
+
+
+## Installation
+|npm install @syncfusion/ej2\-collaborator |
+|:---|
+
+
+
+## Configuration
+
+The Collaboration Client requires the following configuration:
+|**Option**|**Description**|
+|:---|:---|
+|serviceUrl|URL of the Collaboration Server endpoint|
+|connectionType|Transport type (signalr or websocket)|
+|currentUser|Display name of the current user|
+
+```ts
+const client = new CollaborationClient(adapter, { 
+   serviceUrl: 'https://localhost:5001', 
+   connectionType: 'signalr',
+    currentUser: 'John'
+     });  
+     await client.joinRoomAsync(roomname); 
+```
+
+
+
+## Adapter Integration
+
+The Collaboration Client is designed to be control\-agnostic. Each supported EJ2 component integrates through an adapter that implements ICollaborationProvider.
+
+The adapter acts as a bridge between the Collaboration Client and the EJ2 component by:
+
+- Sending local editing operations to the Collaboration Client.
+
+- Receiving remote collaboration actions.
+
+- Applying those actions to the host component.
+
+**Adapter Example**
+```ts
+public applyRemoteAction( action: string, data: ICollaborationActionData ): void { // Apply the remote action to the host component } 
+```
+
+
+
+Because of this architecture, the same Collaboration Client can be reused across **Document Editor**, **PDF Viewer**, and **Spreadsheet**, with only the adapter implementation changing for each component.

Document-Processing/Collaborator/collaboration-server.md

@@ -0,0 +1,141 @@
+# Collaboration Server
+
+The Collaboration Server is the back\-end component of the Collaborator framework. It manages collaboration sessions, synchronizes editing actions, persists changes, and broadcasts updates to connected participants in real time.
+
+The same Common Collaborator framework is shared across all supported server platforms, allowing the collaboration infrastructure to be reused across EJ2 components such as **Document Editor**, **PDF Viewer**, and **Spreadsheet**.
+
+## Packages
+|**Package**|**Description**|
+|:---|:---|
+|Syncfusion.Collaborator.Server|Collaboration server for ASP.NET Core and ASP.NET MVC|
+|ej2\-collaborator\-server|Collaboration server for Node.js|
+
+
+
+**Note**: The Node.js Collaboration Server currently supports PDF Viewer collaborative editing only. Document Editor and Spreadsheet require the ASP.NET\-based web service implementation for document processing, operation transformation, and save operations.
+
+## Key Features
+
+- Real\-time synchronization of editing actions.
+
+- Support for SignalR and WebSocket transports.
+
+- Redis\-based storage and messaging for scalable deployments.
+
+- Shared collaboration services across supported EJ2 components.
+
+## Redis Requirement
+
+The Collaboration Server uses Redis for operation storage, session synchronization, and scalable multi\-server deployments.
+
+## Adapter Integration
+
+The Collaboration Server is control\-agnostic. Each supported EJ2 component integrates through a server adapter that translates component\-specific actions into the common collaboration format. The same collaboration infrastructure can therefore be reused across Document Editor, PDF Viewer, and Spreadsheet with only the adapter implementation changing.
+
+# ASP.NET Core Server
+
+The ASP.NET Core Collaboration Server is provided through the Syncfusion.Collaborator.Server package. It supports both SignalR and WebSocket transports and is recommended for modern .NET applications.
+
+**Installation**
+|dotnet add package Syncfusion.Collaborator.Server|
+|:---|
+
+
+
+**Supported Transports**
+
+- **SignalR(** default **)** 
+
+- **WebSocket** 
+
+**Configuration**:
+
+Register the Collaboration Server and configure the Redis connection string during application start.
+
+**SignalR (Default)**
+```c#
+builder.Services.AddCollaborationServer(options => { options.ConnectionString = "localhost:6379"; }); 
+```
+**WebSocket**
+```c#
+builder.Services.AddCollaborationServer(options => { options.ConnectionString \= "localhost:6379"; options.ConnectionType = CollaborationConnectionType.WebSocket; }); 
+```
+**Configuration Options**
+|**Property**|**Description**|
+|:---|:---|
+|ConnectionString|Redis connection string|
+|ConnectionType|SignalR or WebSocket transport|
+|SaveThreshold|Number of operations before triggering a save|
+
+
+
+**Adapter Integration**
+
+Register a control\-specific adapter to translate between the EJ2 component and the Common Collaborator framework.
+|builder.Services.AddSingleton\<ICollaborationAdapter, DocumentEditorAdapter\>(); |
+|:---|
+
+
+
+# ASP.NET MVC Server
+
+The ASP.NET MVC Collaboration Server provides the collaboration capabilities as the ASP.NET Core server for applications built on .NET Framework and ASP.NET MVC 5.
+
+**Requirements**
+
+- .NET Framework 4.6.2 or later
+
+- ASP.NET MVC 5
+
+- Redis
+
+**Installation**
+
+Install\-Package Syncfusion.Collaborator.Server 
+
+
+**Transport Support**
+
+The ASP.NET MVC Collaboration Server supports **WebSocket** communication for real\-time synchronization between connected users.
+
+**Configuration**
+
+Configure the Collaboration Server with a Redis connection string and register the required adapter implementation.
+```c#
+ServiceCollectionExtensions.RegisterAdapter( new DocumentEditorCollaborationAdapter());  ServiceCollectionExtensions.AddCollaborationServer(options => { options.ConnectionString = "<redis-connection-string>"; options.ConnectionType = CollaborationConnectionType.WebSocket; }); 
+```
+**Adapter Integration**
+
+Register a control\-specific adapter to connect the EJ2 component with the Common Collaborator framework.
+
+# Node.js Server
+
+The Node.js Collaboration Server provides real\-time collaboration capabilities for JavaScript and TypeScript applications.
+
+**Note:** The Node.js Collaboration Server currently supports PDF Viewer collaborative editing only. Document Editor and Spreadsheet require the ASP.NET\-based web service implementation for document processing, operation transformation, and save operations.
+
+**Requirements**
+
+- Node.js 18 or later
+
+- Redis
+
+**Installation**
+npm install ej2\-collaborator\-server
+
+**Transport Support**
+
+The Node.js Collaboration Server supports **WebSocket** communication for real\-time synchronization and collaboration between connected users.
+
+**Configuration**
+```ts
+const server = new CollaborationServer({
+     redis: { host: "<redis-host>",
+      port: 6379 },
+       adapter 
+       });
+```
+**Adapter Integration**
+
+Register a control\-specific adapter to connect the EJ2 component with the Common Collaborator framework.
+

Document-Processing/Collaborator/faq.md

@@ -0,0 +1,53 @@
+# FAQ
+
+## 1. How should Redis be configured for collaborative editing?
+
+In collaborative editing, Redis is used to store temporary data that helps queue editing operations and resolve conflicts using the *Operational Transformation* algorithm.
+
+All editing operations are stored in the Redis cache. To prevent memory buildup, a *SaveThreshold* limit can be configured at the application level. For example, if the SaveThreshold is set to 100, up to twice that number of editing operations are retained in Redis per document. When this limit is exceeded, the first 100 operations (as defined by the save threshold) are removed from the cache and automatically saved to the source document.
+
+The configuration and storage size of the Redis cache can be adjusted based on the following considerations:
+
+- *Storage Requirements*: A minimum of 400 KB of cache memory is required to edit a single document, with the capacity to store up to 100 editing operations. Storage requirements may increase based on the following factors:
+
+   - *Images*: Increases with the number of images added to the document.
+
+   - *Pasted content*: Depends on the size of the SFDT content.
+
+- *Connection Limits*: Redis has a limit on concurrent connections. The Redis configuration should be selected based on the user base to ensure optimal performance.
+
+**Note**: For better performance, a minimum *SaveThreshold* value of 100 is recommended.
+
+## 2. Why does the Collaborator use Redis instead of a database?
+
+To support collaborative editing, it’s crucial to have a backing system that temporarily stores the editing operations of all active users. There are two primary options:
+
+- *Distributed Cache*: Handles more HTTP requests per second than a database approach. For example, a server with 2 vCPUs and 8GB of RAM can process up to 125 requests per second using a distributed cache. We are using distributed cache as a backing system over a database.
+
+- *Database*: With the same server configuration, it can handle up to 50 requests per second.
+
+
+## 3. How do I estimate the server capacity required for collaborative editing?
+
+To calculate the average requests per second of your application, assume the DOCX Editor in your live application is actively used by 1000 users, and each user’s edit can trigger 2 to 5 requests per second. The total requests per second of your application will be around 2000 to 5000. In this case, you can finalize a configuration to support around 5000 average requests per second.
+
+**NOTE:** The above metrics are based solely on the collaborative editing module. Actual throughput may decrease depending on other server\-side interactions, such as document importing, pasting formatted content, editing restrictions, and spell checking. Therefore, it is advisable to monitor your app’s traffic and choose a configuration that best suits your needs.
+
+
+## 4. What transport protocols are supported by the Collaborator framework?
+
+The Collaborator framework supports:
+
+- **SignalR** (ASP.NET Core)
+
+- **WebSocket** (ASP.NET Core, ASP.NET MVC, and Node.js)
+
+Both provide real\-time communication between clients and the Collaboration Server.
+
+## 5. Which EJ2 components are currently supported by the Node.js Collaboration Server?
+
+The Node.js Collaboration Server currently supports **PDF Viewer** collaborative editing.
+
+**Document Editor** and **Spreadsheet** require the ASP.NET Core or ASP.NET MVC Collaboration Server for document processing, operation transformation, and save operations.
+
+