Devlog #23 - Which JS Editor Library, Quill, TipTap or Lexical (updated)

No video

Devlog #23 - Which JS Editor Library, Quill, TipTap or Lexical (updated)

Рет қаралды 5,465

7 ай бұрын

After choosing to go with TipTap, we have added a lot of improvements and features to our implementation at www.superthread.com
In this video I recap how we compared the different JavaScript editor libraries:
* Quill JS - quilljs.com/
* TipTap - tiptap.dev/
* Lexical - lexical.dev/
I then go on to demo the main features we added.
As of now, we have a pretty powerful editor which is used throughout Superthread for Pages, Cards, Comments and more.
Here is the link of the comparison table of features and bugs for different libraries and our current implementation:
superthreadnl....

Пікірлер: 32

@Axorax Ай бұрын

Superthread looks great and also has so many features

@JamesRBentley 7 ай бұрын

Very helpful explanation, we are looking to use Tip Tap as well

@superthread_devlog 7 ай бұрын

Glad it was helpful!

@mhaidarhanif 7 ай бұрын

Yes, TipTap has the best developer experience compared to the others.

@superthread_devlog 7 ай бұрын

Our reasoning can be summed up here: superthreadnl.substack.com/p/how-we-implemented-tiptap-editor - but I would say that the others are good options too.

@mhaidarhanif 7 ай бұрын

@@superthread_devlog Thanks! Very in depth check list for comparison

@cocoiyeah 4 ай бұрын

You should add: Blocknote Js. It's open source. Great docs.

@superthread_devlog 4 ай бұрын

I'll check it out

@WebHighlights Ай бұрын

Isn't Blocknote built on top of TipTap?

@moy2010 7 ай бұрын

Superthread is looking really cool! I also implemented the "Internal Link Extension" feature for my project using Lexical, though I called it "Smart Link". I feel very happy with Lexical and React, and I think it's level of maturity is finally allowing it to be used in more special use cases, which is exciting. How far did you go with your implementation with Quill? Before I used Lexical I was using Slate.js, and the refactoring took me around 1 month (considering that I was working on my side project only on my spare time). Suffice to say that I felt overwhelmed by the sheer amount of work that the refactoring demanded, so a piece of advice to anyone willing to create a rich text editor for their project: Evaluate very carefully which features / requirements you'll need out of your rich text editor library. It will save you a lot of time later on.

@superthread_devlog 7 ай бұрын

We were running quill inside of superthread for a while but the community was a bit quiet at that time.

@sensei7022 6 ай бұрын

Hi Moy, i was working on a similar project, how are you storing nested file and folders in db ?

@arihantsinghrana2173 5 ай бұрын

Thank you really needed this

@superthread_devlog Ай бұрын

Glad you found it useful.

@user-jk2gs6oq8l 7 ай бұрын

Hey, thank you for this super-detailed comparison and for the channel in general - great stuff :) I'm actually choosing the editor for the project I'm working on rn, so may I ask you - would you go with Lexical if you had a React codebase? I was thinking about it a lot but decided to stick with TipTap because of community / prosemirror being so mature / out of the box collaboration feature. Thank you and good luck to you and to Superthread.

@superthread_devlog 7 ай бұрын

That would be for you to decide. One thing worth noting is that the creator of lexical was extremely responsive on twitter.

@noworkandallplay5662 7 ай бұрын

Nice video, cool setup too!

@superthread_devlog 7 ай бұрын

Thanks!

@krike2315 4 ай бұрын

It would be interesting to know how you implemented dragging blocks as in notion? Is each block wrapped in some kind of drag-and-drop component? Or something built into TipTap is draggable: true?

@superthread_devlog 4 ай бұрын

We made logic for displaying drag-handle next to the currently hovered block so it's draggable natively.

@tim7517 5 ай бұрын

Thanks, my guy! We're looking to use TipTap too. Does it have real-time or asynchronous comments/versioning?

@superthread_devlog 4 ай бұрын

They do a real-time collaboration as a service I think, we use YJS.

@rezatm235 6 ай бұрын

Hello there and thanks for your helpful content ! We had an existing editor which is build on top of Slate js . We make out mind to swich to another editor due to unfriendly slate js behavior . We are using react but i doubt about should we use TipTap or lexical Which one would you choose if you gonna develop in react ?

@superthread_devlog 6 ай бұрын

They are all pretty good. We might have considered lexical had we not used VUE but as mentioned, they are all good options.