Live data from Hacker News

Editor.js – Block Styled Editor

editorjs.io

41–50 of 75 posts

Re: Editor.js – Block Styled Editor

#41
Here's my take on this from playing with it a bit:

- Works on mobile (like Quill, Prosemirror)

- Does not support collaborative editing (unlike Quill, Prosemirror)

- Has somewhat unique block-based editing UI - think Notion (the data models of most editors support this, but the default UI of editorjs is much more explicit about this)

- Not built on React (like Quill, Prosemirror, but unlike Slate and Draft)

The mobile support looks quite mature, and I think this could be a good competitor to Quill and Prosemirror for single-user editing.

Per my previous comments (1), I think for new projects, going with Prosemirror or Quill are still great choices. I've tried Draft and Slate and both of them have lacked good mobile support and collaborative editing.

[1] https://news.ycombinator.com/item?id=18998042#19000425

Re: Editor.js – Block Styled Editor

#42

Two long established predecessors to this: Sir Trevor JS[0] and Colonel Kurtz [1]. I've used Kurtz extensively and it's been brilliant. The only downside of all these block-based editors is that you can't easily create layouts where images float to the left or right of text. Well, you can create them but you don't get a WYSIWYG idea of what it looks like right in the editor. I can live with that! I've explored all so…

Thanks for the sirtrevorjs link.

Looking at the structure I was thinking how similar it is.

Re: Editor.js – Block Styled Editor

#43

I've been struggling with ProseMirror for the last 2-3 months. This looks amazing and I'm looking forward to replacing Prosemirror with it.

Out of curiosity, what were the most irritating problems you faced there, that in the end you decided to start looking for a replacement?

Re: Editor.js – Block Styled Editor

#44

Every time I see a new contenteditable-based editor I'm reminded of this https://medium.com/content-uneditable/contenteditable-the-go...

Hi! The author of this article here :) I hoped you liked it (cause your message can read both ways :D)

You reminded me that I was planning to refresh it a bit since it's over 3 years old now. I'd like to cover the rise of modern rich-text editors like CKEditor 5, ProseMirror, Draft.js and perhaps dive a bit into what we've learned when developing CKEditor 5 (because after 4 years of work it's actually out by now [1]). If you have any questions or you're curious about some particular aspects, please let me know :)

[1] https://ckeditor.com/ckeditor-5/

Re: Editor.js – Block Styled Editor

#45

What about bold, italic, etc?

Either press the word combinations, ctrl+b etc, or select the text you want bold and there will be a popup.

You`re limited on the selection though, thats kinda a bummer. In my opinion making a selection and allowing a few operations, like bold, delete, is worth it.

Re: Editor.js – Block Styled Editor

#46

We were draftjs, but it got very slow on larger texts. We're replacing with slate but it lacks some very needed textnode manipulation. Glancing at the editor and api, wow. Can't wait to have something simple (content editable) but with strong api backbone. Congrats!!!

Highly recommend Prosemirror. At least in my limited testing, it's much faster than Slate but you need a React wrapper for it

Re: Editor.js – Block Styled Editor

#48
post #44

Every time I see a new contenteditable-based editor I'm reminded of this https://medium.com/content-uneditable/contenteditable-the-go...

Hi! The author of this article here :) I hoped you liked it (cause your message can read both ways :D) You reminded me that I was planning to refresh it a bit since it's over 3 years old now. I'd like to cover the rise of modern rich-text editors like CKEditor 5, ProseMirror, Draft.js and perhaps dive a bit into what we've learned when developing CKEditor 5 (because after 4 years of work it's actually out by now [1])…

I would love to read an article like that! I'm very curious how the architecture of the new CKEditor 5 compares to younger alternatives like ProseMirror and Draft.js.

Re: Editor.js – Block Styled Editor

#49
post #28
post #11

Why JSON-that-resembles-HTML rather than whitelisted-subset-of-HTML? Seems to throw away a huge amount of tooling and force an extra step on anything that wants to render the content? Although I guess I could render the JSON to HTML server-side and get the best of both worlds. Everything usually boils down to a question of caching something somewhere.

Every browser uses different markup to represent contents of contenteditable. One browser uses div for text and splits it into two when enter is pressed, other browser inserts , next one has paragraph, etc. ect. JSON is not here for resemblance, but for normalization. You force single presentation of things from start, and when user presses enter (or other text composition event happens) you prevent default action, u…

Still, that does not mean it cannot output HTML. CKEditor 5 implements a custom data model, works in the way you described (cancel native actions or extracts stuff from it, apply those changes to its data model and re-renders the DOM if needed), but it still outputs HTML. Thanks to that you don't need a processor to use that content on your page. Plus, there are cases where converting a custom data model to HTML is actually a tricky job (e.g. inline formatting) and even Editor.js chose HTML for those.

Re: Editor.js – Block Styled Editor

#50
post #44

Every time I see a new contenteditable-based editor I'm reminded of this https://medium.com/content-uneditable/contenteditable-the-go...

Hi! The author of this article here :) I hoped you liked it (cause your message can read both ways :D) You reminded me that I was planning to refresh it a bit since it's over 3 years old now. I'd like to cover the rise of modern rich-text editors like CKEditor 5, ProseMirror, Draft.js and perhaps dive a bit into what we've learned when developing CKEditor 5 (because after 4 years of work it's actually out by now [1])…

Seconding that other comment.

Really curious if that grasshopper(Draft.js) is stil green.

Post reply on HN