Using React Transitions for low priority text editor updates(handlewithcare.dev) |
Using React Transitions for low priority text editor updates(handlewithcare.dev) |
While migrating to React ProseMirror, initially I tried out just passing the primary editor's EditorState directly to the preview editor's <ProseMirror /> component, but the top level node view components turned out to be just slow enough to render that rendering them twice on every keypress introduced a noticeable lag. So I added a useDeferredValue to render the preview editor in a Transition! Here's a post about how that works and the tradeoffs involved. I added some interactive demos to illustrate how the Transition changes the render flow.