laurent22/joplin

Duplicate css properties for the assets of any codemirror plugins

Closed this issue · 1 comments

SeptemberHX commented

Tested with the joplin-rich-markdown. I also installed another 10 plugins, including Admonition, Inline TODO, Note Link System, Enhancement, and etc.

For any highlight content in the markdown editor ==test==, we can see the duplicate css properties in the dev tools:
image

And it get even worse when I try to render math with katex in codemirror. There are 80+ duplicates for each rendered character.

It leads to the serious performance problems with rendered math equations because of the duplicates. It needs 200ms+ to response when pressing any key.

image

After moving all the css from the module.exports.asserts to userchrome.css, the performance is improved.

image

I also found that the number of the duplicated css is related to the number of the plugins. With only one plugin, there is no duplicates.

Environment

Joplin version: 2.9.1
Platform: arm
OS specifics: macOS 12.5

Steps to reproduce

  1. Install more than one plugins besides joplin-rich-markdown
  2. Observe ==something== in dev tools

Describe what you expected to happen

No duplicate css properties

Logfile

No.

SeptemberHX commented

I think the problem may be caused because of packages/app-desktop/gui/NoteEditor/NoteBody/CodeMirror/utils/useExternalPlugins.ts or related functions. It repeatedly load every plugin.

For example, there are 4 plugins: p1, p2, p3, and p4. It will:

  1. Load p1
  2. Load p1, p2
  3. Load p1, p2, p3
  4. Load p1, p2, p3, p4