Update ydoc connected to y-websocket using applyUpdateV2

1

Currently, we have connected y-websocket to implement real-time collaboration of our editor.
The problem is that if I send a lot of differences in one transact(), the error ‘Max payload size exceeded’ occurs.
​​
Basically, I saw data size that the difference was compressed and transmitted using the V1, and I applied it as follows to try to transmit the compressed data using the V2.
We used the method of separating the ydoc (remoteYDoc) connected to the websocket and the ydoc to be modified, making the modifications of ydoc updateV2 and applying them to remoteYDoc.

the modification of ydoc was made updateV2 and applied to remoteYDoc.

        this.yDoc = new Y.Doc();
        this.remoteYDoc = new Y.Doc();
        this.provider = new WebsocketProvider(this.__wsUrl__, this.__docId__, this.remoteYDoc);
        this.remoteYDoc.on('updateV2', (update) => {
            Y.applyUpdateV2(this.yDoc, update); // update yDoc
        });

        console.log(Y.encodeStateAsUpdate(this.yDoc, Y.encodeStateVector(this.remoteYDoc)).byteLength, Y.encodeStateAsUpdate(this.remoteYDoc, Y.encodeStateVector(this.yDoc)).byteLength, 'yDoc remoteYDoc is same');
        const befStateVectorfortest = Y.encodeStateVector(this.yDoc);
        this.yDoc.transact(() => {
            diffResults.forEach((result) => {this.__applyYModel__(result); });
        }, this.getClientId());

        const testV1 = Y.encodeStateAsUpdate(this.yDoc, befStateVectorfortest)
        const testV2 = Y.encodeStateAsUpdateV2(this.yDoc, befStateVectorfortest) 
        console.log('v1', testV1.byteLength, 'v2 expect to send', testV2.byteLength);

        const remoteStateVector = Y.encodeStateVector(this.remoteYDoc) //yromotedoc before
        const diff1 = Y.encodeStateAsUpdateV2(this.yDoc, remoteStateVector)
        
        Y.applyUpdateV2(this.remoteYDoc, diff1, this.getClientId()); // apply diff to remoteYDoc with V2

sendv2
sendv2806×553 30.5 KB

However, the actual size of the data being transferred is equal to the size of the data compressed in v1, not the data compressed in v2.
How did this go wrong?
And how can I transfer data compressed to v2 to websocket?

2

y-websocket uses v1 encoding for compatibility. Background: There are a lot of other backends to y-websocket that would break if I switched to v2. Also, until not so long ago, the native implementations of Yjs (see Y CRDT) didn’t support v2. v1 is still the best-supported format, and there are few downsides.

If you really want to use v2, you need to adapt y-websocket.

My suggestion is that you fix the ‘Max payload size’ issue instead. This is either a proxy issue or you need to adapt the ws server directly in y-websocket/utils/server.js.

3

Thank you for the good suggestion. We are looking for an appropriate Max payload. At the same time, we are also looking for a way to minimize the data we send.

Can we simply adapt y-websocket to use v2? Where can I fix it?

4

It’s not that simple. You need to adapt y-protocols.

1 Like