Class name ProseMirror-focused cause lag in huge documents

When user focus in and blur out, wrapper div will add and remove ProseMirror-focused, because documents are very huge, trigger browser reflow and lag 500ms depend on CPU. Is there any option to not set focus class on wrapper?

1 Like

This is the code which adds the -focused className:

It appears you could try overriding the focus handler (in handleDOMEvents prop) … return true when defining the function (see API ref) in the EditorProps object. This would require copying all the code from line 732’s function, without line 736 - since selectionToDom is public, it should be able to work equivalently? @marijn could confirm - there might be some easier way I am forgetting (perhaps a top level attributes override, but it doesnt seem that way)

OTOH, if changing a top level attribute in your DOM causes 500ms delay, this will likely crop up elsewhere as a critical performance concern. I have similar issues when DOM elements are exceedingly large, as this is an open problem with the prosemirror architecture, exacerbated by certain browser implementations; that is, without any native implementation to occlusion culling or pagination (although both these ideas have been floated and there are proof of concepts)

You are right, many thanks to you.

But selectionToDOM is not public, so i’ll test equivalently, i just return true and see what happens.