display content first and then load menus #2226
Conversation
Rendering the menubar and menububble takes a significant amount of time. First display the content and then render the menus. Signed-off-by: Max <max@nextcloud.com>
|
This should also speed up opening files but the content seems to render at the same time as the menubar there. Will need to investigate if it actually speeds up loading there as well or what is blocking it. update: looks like the menubar is snappy if it has been rendered once. So when opening a file in a folder that has a Readme the menubar will show up right away. Same when opening a file again or another file without reloading the text app in between. |
|
We also can use window.requestAnimationFrame() to "delay" some stuff to create a more smooth experience. |
src/components/EditorWrapper.vue
Outdated
| <div id="editor"> | ||
| <MenuBar v-if="tiptap && !syncError && !readOnly" | ||
| <div v-if="tiptap" id="editor"> | ||
| <MenuBar v-if="initialLoading && !syncError && !readOnly" |
There was a problem hiding this comment.
Should it be better to use a computed here?
Also rename `initialLoading` in `EditorWrapper` to `contentLoaded`. This flag is set during the `initialLoading` state change. It does indicates that the loading happened Use the past tense to indicate that. The editor wrapper is now loading in different steps. The menus will load after the content. So `content` seems more fitting then `initial`. Signed-off-by: Max <max@nextcloud.com>
max-nextcloud
force-pushed
the
performance/postpone/rendering-menubar
branch
from
337c2da
to
3ca1038
Compare
For now i am mostly trying to render the content as early as possible. In the rich workspaces in files the menubar will not show anyway. So we can easily speed up the loading of the text by postponing the menubar loading. I did read upon |
Nothing for now @max-nextcloud, maybe in new interactions about performance improvements. |
delete-merged-branch
bot
deleted the
performance/postpone/rendering-menubar
branch
|
/backport to stable23 |
Rendering the menubar and menububble takes a significant amount of time.
First display the content and then render the menus.
Renders the content >500ms faster on my local dev setup.
Now the content is drawn (LCP) before the large computation load of rendering the menubar:
