critters icon indicating copy to clipboard operation
critters copied to clipboard

loaded styles cause the page flash (and re-rendering)

Open ms-fadaei opened this issue 4 years ago • 0 comments

Version

module: 0.1.1 nuxt: 2.15.7

Nuxt configuration

mode:

  • [x] universal
  • [ ] spa

What is expected?

preloading external CSS shouldn't re-rendering the page

What is actually happening?

preloading external CSS forced the browser to rerender!

Steps to reproduce

just use the module (and nothing else)

Additional information

I think this is because of ordering (styles get overridden) First of all, we have the inlined CSS in the head section. After that, multiple external CSS files inserted with media preloading strategy. When each file gets loaded, the browser re-render the page because other files not loaded yet, and the inlined CSS rules get overridden by the loaded external file. this cycle gets happening until the last external CSS loaded.

Checklist

  • [x] I have tested with the latest Nuxt version and the issue still occurs
  • [x] I have tested with the latest module version and the issue still occurs
  • [x] I have searched the issue tracker and this issue hasn't been reported yet

ms-fadaei avatar Jun 24 '21 21:06 ms-fadaei