uiwjs / react-md-editor

A simple markdown editor with preview, implemented with React.js and TypeScript.
https://uiwjs.github.io/react-md-editor
MIT License
2.15k stars 155 forks source link

Issue on long text #603

Open BenchBadr opened 10 months ago

BenchBadr commented 10 months ago

Hello, firstly I want to thank all the contributors of this project because of it's high quality. I would like to draw your attention about an issue :

https://arltools.xyz/create

When the content is too long, (empirical) mostly when it exceeds 30,000 chars, it gets really slower to type, each character take 0.5 to 1 sec to be added which can be really disturbing.

I thought of making the useState text value update being done separately from the typing action but this is simply impossible using react-md-editor. The whole variable is rewritten for each added character, therefore, how can we make this work separately ? Like, chars would be added instantly when typed but may be slower to be displayed on preview.

Thank you for your answers.

jaywcjlove commented 10 months ago

@BenchBadr This is caused by code highlighting, which is re-rendered every time without lazy loading.

BenchBadr commented 10 months ago

I'm sorry, I can't find it by myself, how can I enable the lazy loading ? (And tysm for the info)

jaywcjlove commented 10 months ago

@BenchBadr Oh, there is currently no support, you need to implement it yourself

https://github.com/uiwjs/react-md-editor/blob/dabf155b82253488573843e6963337e65fa0a1e5/core/src/Types.ts#L97-L106

BenchBadr commented 10 months ago

I see, I'll need to have my own copy of everything. Not that bad actually because I'll be able to do more stuff. Thank you!

ilkkakuivanen commented 8 months ago

@BenchBadr did that help in your case? I have a similar problem and custom preview does not help in my case.

BenchBadr commented 8 months ago

Honestly I didn't dig this that much since then. I never edited a npm package before, if someone has a tutorial or something please send it to me. I will be happy to inform you here once this will be done.