Use LoroDoc and BroadcastChannel mock collaboration, see Loro Excalidraw Example.

First, monitor changes to the local canvas and synchronize the list of shapes and their property objects to the local LoroDoc:

api.onchange = (snapshot) => {
    const { appState, nodes } = snapshot;
    if (recordLocalOps(docNodes, nodes)) {
        doc.commit();
    }
};

Then listen for changes to LoroDoc, distinguishing between local and remote changes via e.by. If the change originates locally, send a synchronization message; if it comes from the remote, update the canvas content.

doc.subscribe((e) => {
    if (e.by === 'local') {
        const bytes = doc.export({ mode: 'update', from: lastVersion });
        lastVersion = doc.version();
        channel.postMessage(bytes);
    }

    if (e.by !== 'local') {
        api.updateNodes(docNodes.toJSON());
    }
});