|
|
|
|
|
by bhl
1524 days ago
|
|
Could you elaborate on what you mean by "source-of-truth that wasn't the DOM" and "performance and accessibility"? Having read through Lexical's documentation and worked with ProseMirror before, the approach by Lexical feels similar to ProseMirror's except written from a React + Hooks perspective. |
|
You can imagine the EditorState in Lexical as not only the source-of-truth for your editor's data, but also the virtual DOM for your view. Lexical diff's both and applies delta based on dirty node logic to improve performance. Furthermore, any mutations to the DOM outside of Lexical and reverted back to Lexical's EditorState – to preserver source of truth.
Lexical also promotes different types of "text" properties on the TextNode class. Such as if the node is segmented, tokenized etc. This is a far better accessibility experience, as it ensures you can build rich text nodes – like custom emojis, or hashtags, or mentions without bailing out to contentEditable="false" which is what almost every other editor promotes. Which is also a major hinderance in terms of the ability to properly utilizie NVDA, Jaws and VoiceOver to move selection through the characters (in most cases, they skip non contenteditable elements entirely, which is terrible).