Repo Editor tab switching performance problems
notes.js
has 1529 in my local and in preview mode of the new Repo Editor switching to notes.js
tab takes around 1.46 seconds
This is the performance output.
This is the call stack.
It looks like all those time spends in Vue internals. ~350msec spend on highlighting, but rest is Vue itself.
I think it's because of the v-html
and I did something like this real quick. (sorry I don't have the diff, I already reverted it)
This actually helped to reduce the time around 830msecs in total with highlighting. However I am not sure this is the best solution because I simply append a non VDOM element into Vue's DOM tree. I suppose, Vue can remove the custom element I appended when it decides to re-render the component.
This is the Vue version. Please observe the time after clicking the notes.js
tab.
This is the custom version with the code I pasted above. Again this may be a bad idea at all, we need to investigate. But it's significantly faster than the original Vue way.
/cc @jschatz1