Improve initial rendering performance

[bgrand-ch]

@artf Hello,

The rendering of HTML elements on the canvas could be improved using CSS with the content-visibility: auto; property.

The rendering of project data could be improved, without blocking the main thread, using a web worker. Is this possible?

This is mainly useful when a page becomes very large and it is not feasible to use GrapesJS multi-pages.

Have a nice day.

[lexoyo]

I had a solution for that, I was breaking down the project data into multiple objects and loading them one after another (pages, styles...)

But it was breaking the sybols so I reverted it
#6663

In silex it is not a huge problem but not a great ux too. Users often have an unresponsive browser tab

[lexoyo]

I'll definitely try content-visibility
Thx for sharing

[artf]

Yeah, content-visibility is nice, but you still need to know where to apply it and how the page is structured (maybe by <section>s, but there is no real standard) + you need to calculate the height of those elements so the scroll works properly (contain-intrinsic-size).

So it might be reasonable to extend the view for specific components you know are composing your page, but probably it won't work if you apply this blindly to all components.