Speedup Lizmap Html page loading by adding preload link

[rldhont]

Documentation about preload link https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel/preload

• Add preload for CSS and JS files added to the HTML pages
• Add preload for fetch request in Map pages

[nboisteault]

I'm not sure but it might block the HTML rendering.
It would be interesting to test against lighthouse to see if it improves its score.

[josemvm]

hi @rldhont
sorry, i don't know if the problem is related to this issue, but in lwc 3.8 there is a strong and visible delay in loading project images after cleanning the lizmap cache

[rldhont]

I'm not sure but it might block the HTML rendering. It would be interesting to test against lighthouse to see if it improves its score.

From https://stackoverflow.com/questions/36641137/how-exactly-does-link-rel-preload-work

For example, the application can use the preload keyword to initiate early, high-priority, and non-render-blocking fetch of a CSS resource that can then be applied by the application at appropriate time:

[rldhont]

@nboisteault according to mdn, preload should not blocked the page

The preload value of the element's rel attribute lets you declare fetch requests in the HTML's , specifying resources that your page will need very soon, which you want to start loading early in the page lifecycle, before browsers' main rendering machinery kicks in. This ensures they are available earlier and are less likely to block the page's render, improving performance. Even though the name contains the term load, it doesn't load and execute the script but only schedules it to be downloaded and cached with a higher priority.

[nworr]

These functions will implicitly add a preload tag for each resource loaded with addJSLink/addCssLink, no ?