Real-Time Collaboration on a Note - Project

forgot that it is properly a leftover of GSoC 2020 but there was not a plug-in system implemented at that time, so things a bit different now

have a talk with Laurent and Foxmask about it. It is going to be written in Phyton, so I cannot say how things can be reused.
As the magic of your plug-in happening in the background there might be good chance that it could be also being used in the web companion.

@laurent, do you regard this schedule reasonable?

That seems reasonable. @Aksh-Konda, do you think you can get a first PoC within 5-6 weeks? Something that doesn't have all the functionalities but that shows roughly how it works. Then you can improve and complete this initial version over the following weeks.

This part I would be worried about actually. 2 weeks to iron things out is not really sufficient. Instead you should consider a more iterative approach - release a simplified version, test it, debug it. Then release this improved version, and test it, debug it, based on user feedback, etc. Essentially instead of blocking 2 weeks for testing and debugging at the end, you allocate a few days here and there over the complete duration of GSoC.

Do you think you could review your schedule based on this?

The goal of Foxmask's web app is very different from what @Aksh-Konda will be doing. One is a complete online note taking application, while what Aksh's app is simply an editor. I think Aksh-Konda current approach is correct and that we cannot re-use existing code for this.

I will need some guidance over the codebase structure of the app from my mentors. Apart from that, I think I can develop the PoC within 5-6 weeks

yes, I will.

I was about to ask for some clarification on the topic, Thank you.

Hey, @Aksh-Konda this looks like a really daunting task if you want to do everything from scratch, first you should decide what method you would be using for having persistence of data for both the users while they are collaborating.
The two methods are:-

  1. Conflict-free replicated data type (CRDT's)
  2. Operation Transformation
    Then you should go ahead with choosing the library accordingly.


"CRDT is the holy grail of collaboration, it's an active area of research, and the prospect of peer-to-peer editing with end-to-end encryption is an exciting one. The technology isn't ready for our needs yet, but I believe in the future some incredible products will be made possible. In the meantime TinyMCE will rely on OT for collaboration, coming later this year."

Here is an amazing article by the author of convergence analyzing different open-source libraries for the persistence of data for collaborating users.

You should also check out this video if you haven't already, it clears a lot of basics about Real-time collaboration, you should also brush up on the theory behind WEBRTC( is a good source if you want to brush up on the theory behind it).

I can help you out a bit if you go ahead with convergence, it has a prebaked API for cursor management, which could be a pain in the neck if you try to make it from scratch. The downside with convergence would be that you would need to spin an instance of its server as a docker container.

I have made a tool that is quite similar to what the project requires for collaborating for data structure problems, you can check it out.

Hmu, if you have any questions on the same.


Hi @rishabh.malhotra, Firstly thanks for your interest in the project.

I actually did quite a bit of research on Real-Time Collaboration, WebRTC/WebSockets, Conflict Resolution Methods, libraries built for real-time collaboration which also provides different features like conflict resolution, persistence, editor binding support, and so on.

I also put up a new post on the topic "which library to be used"

Thanks for the offer... but, it was decided to use yjs/y-webrtc for real-time collaboration and peer-to-peer communication.

I've looked into the project and it's amazing. you've done extraordinary work!

1 Like

All the best man, looking forward to see what you come up with :raised_hands:

1 Like

would be great to some benefit from each other :grinning:


@Aksh-Konda I am also thinking of migrating from convergence to yjs, are there any gotchas you found while implementing yjs in your application, or just follow the docs.

Firstly, I'm also new to Yjs. But I realized that it only provides a set of tools that manage the changes made to an object and also some editor binding libraries to those objects. It doesn't act according to a framework and we should find some way to build around it. So I made a separate module(which I'm still working on improving) to manage all those Yjs stuff and the react components communicate with Yjs through that module.

what is the base editor you are using ace, Monaco, code-mirror, or something else?

So I made a separate module(which I'm still working on improving) to manage all those Yjs stuff and the react components communicate with Yjs through that module.

Is that on Github?

currently I'm using CodeMirror.

yes, here

Maybe try using Ace editor if that's possible, if I'm not wrong Joplin uses ace editor, and then you can natively incorporate all the keybinds like ctrl + b for bold etc, using code that has already present in the codebase, you should ask @PackElend about it.

I checked out your code its looks good :raised_hands:
The only suggestion I would give, is to maybe looks into adding some sort of css processor, like CSS in js or CSS modules or styled-components

1 Like

The ace editor looks amazing. Although Yjs lacks a binding library for the ace editor. which might be a huge deal-breaker for choosing Ace over CodeMirror, as implementing editor binding and rendering cursors of other clients in the editor can be a huge task. But I might try developing it after the completion of GSoC.


Yes, I'm actually using styled components here and there in the project as required.
Again, Thanks for your interest in this project! It really means a lot.

FYI Joplin uses CodeMirror as the markdown editor. So it makes sense to use it for the collaboration as well (you can mostly copy over configuration and give the user a very unified experience).


Ace editor has cursor bug on foreign languages such as Thai, Japanese that hasn't been fixed over last 4 years. e.g. try copy this "ขั้นสูงขั้นขึ้น ขั้นสูงขั้นขึ้น ขั้นสูงขั้นขึ้น" into web-editor on website . You will see spot moves away from current typing spot. Please check other reported issues as well .

1 Like