joplin icon indicating copy to clipboard operation
joplin copied to clipboard

Desktop: Performance: Reduces re-rendering caused in markupToHtml

Open ken1kob opened this issue 2 years ago • 1 comments

This PR is one of PRs resolving issue #6386 and has two specs.

Spec 1

This PR suppresses redundant re-rendering of NoteEditor when a note is rendered by Markdown Editor/Viewer.

In CodeMirror.tsx, a note's markup text is converted into an Html text and stored into renderedBody variable, and simultaneously its hash is calculated and stored into renderedBodyContentKey variable. Since the two variables are useState variables, one conversion triggers re-rendering twice, one of which is redundant.

By changing renderedBodyContentKey into a useRef variable, re-rendering is triggered only once.

Spec 2

Additionally, the time of the conversion when a new note is loaded is changed. It was executed a bit later in a timeout handler. But now, it becomes being executed right away.

ken1kob avatar Apr 23 '22 03:04 ken1kob

This commit was replaced to be mergeable with v2.9.17.

ken1kob avatar Dec 17 '22 16:12 ken1kob

In CodeMirror.tsx, a note's markup text is converted into an Html text and stored into renderedBody variable, and simultaneously its hash is calculated and stored into renderedBodyContentKey variable.

Since the key is derived from the body, can't we just use useMemo to handle the caching without having to use a ref?

laurent22 avatar Jan 27 '23 19:01 laurent22

Since the key is derived from the body, can't we just use useMemo to handle the caching without having to use a ref?

Since the update and reference of renderedBodyContentKey useRef variable are already in a useEffect function and are tightly coupled with a side effect, it cannot be replaced with useMemo.

ken1kob avatar Jan 27 '23 23:01 ken1kob

See https://github.com/laurent22/joplin/pull/6446#issuecomment-1817817260

laurent22 avatar Nov 19 '23 10:11 laurent22