You can avoid FOUC by using a shared css file that is first loaded by the page then linked inside the WC template.
The browser will have already cached the shared styles so it will Not reload the stylesheet, but instead use the cached version. Linking the stylesheet in the template adds the shared styles to the WC's scope.
Web developer and lover of all things.
Helping developers and agencies build better websites.
Author of a short 60-ish page book about self-doubt and self-improvement.
There's something to be done with assets preloading to help with the FOUC, indeed.
However, it seems you can still run into FOUC issues when your components make use of the shadow DOM, as the structure of the element will likely change between the initial page load and the moment that the WC is rendered.
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
You can avoid FOUC by using a shared css file that is first loaded by the page then linked inside the WC template.
The browser will have already cached the shared styles so it will Not reload the stylesheet, but instead use the cached version. Linking the stylesheet in the template adds the shared styles to the WC's scope.
There's something to be done with assets preloading to help with the FOUC, indeed.
However, it seems you can still run into FOUC issues when your components make use of the shadow DOM, as the structure of the element will likely change between the initial page load and the moment that the WC is rendered.