Announcing React ProseMirror

[dwzkit]

I am currently using tiptap’s React NodeView. Due to existing performance issues with tiptap’s NodeView and slow progress in resolving them, I have no choice but to explore other solutions that can use React+NodeView. Theoretically, is it possible to combine react-prosemirror and tiptap’s addNodeView? Most of my development has already been implemented on tiptap, so it’s not very feasible to migrate to a new dependency at this point.

[mellab21]

This looks fantastic, strikes the right balance between taking care of the react-cm integration side of things without adding layers upon layers of abstraction.

[SMores]

Unfortunately, I wouldn’t expect there to be an easy way to integrate React ProseMirror with TipTap, especially given the changes on the horizon for React ProseMirror (announced here).

[dwzkit]

@SMores

I’ve noticed react-prosemirror uses forceUpdate and also a unstable_batchedUpdates function that I’m not familiar with.

It does! unstable_batchedUpdates is actually the default behavior now in React 18, but for earlier React versions, it was necessary to “opt in” to batching state updates that originate from outside of React-managed code. This article explains it in a bit more depth. React Redux actually re-exports this method as batch, and their docs have some explanation as well.

The forceUpdate is necessary in our case for the LayoutGroup implementation, which relies on the useLayoutEffect hook to update a Set stored in a Ref. Since Ref updates don’t result in re-renders, we have to separately force a re-render by bumping some state!

I’ve been trying to use TipTap for almost three months now, and honestly, the development effort during these months has been challenging. As you mentioned, TipTap introduces too many new concepts, and ultimately, it still relies on a thorough understanding and implementation of ProseMirror. The additional layer of abstraction in TipTap has become a burden affecting document performance. I’m considering trying out the react-prosemirror developed by your team instead of depending on TipTap, which seems to have a slower pace of updates and iterations.