Input lag for large text body (>2000 lines)

[herrera-ignacio]

Hey! I'm developing a text editor on top of this for a private project (I added some server-side processing for specific text macros, so one can add those text macros from the top toolbar or just writing them, save the text, and then a server will process that...).

The problem is that some of our text files are exceeding the 2000 lines and the editor became really slow at some point for similar large text sources (~500-1000ms input lag for each keystroke).

I've tried:

• Remove all preview options
• Hide preview (preview="edit")
• Hide toolbar
• Remove controlled input (i.e., testing the editor with no value nor orChange)
• Revised my wrapper component for unnecessary rerenders (it doesn't re-render at all when value changes).

Is there some known limitation for such large texts? Any ideas of what may be causing this?

[jaywcjlove]

I don't know any better way to deal with it.
@herrera-ignacio

[herrera-ignacio]

It seems to be a problem with input events bubbling in the editor, not from my application. I tested the editor in an isolated way, using the provided sandbox examples and it's the same: as the file gets bigger it gets slower.

In case someone wants to dive deeper into this. Most likely I'll migrate to another solution for time reasons but this is a great tool! And it's a pity that it can't be used properly for a relatively medium size source text.

[unidesigner]

@herrera-ignacio What other solution have you come up with to deal with this issue? Do you have a hint how to investigate this issue?

[IntelligaiaVivek]

Any solution for lag

[herrera-ignacio]

@herrera-ignacio What other solutions have you come up with to deal with this issue? Do you have a hint on how to investigate this issue?

Not really, I've ended up implementing my own text area editor while leveraging react-md-editor preview functionality in a different tab.

It seems that if the preview tab is mounted, then lag appears again, so it'd say it's a problem with how this library is working with Remark's syntax tree, which is causing the event bubbling lag I saw last time I did a profiling on this one.

Unfortunately, I'm not a collaborator on this project nor do I have the time to help fix it, I just wanted to throw some light into the matter because it seemed collaboratos hadn't spotted this one until the issue was created.