CODEWITHSUNDEEP
javascripthtmlcssmaterial-designnative-web-component
walox
walox

Reputation: 705

Experiencing FOUC with Basic Example of Material Web Components

I'm currently implementing a super basic example using Material Web Components as described in their official documentation on GitHub, but I'm encountering an issue with a Flash of Unstyled Content (FOUC) when the page loads. The components appear unstyled briefly before the correct styles are applied. I'm looking for insights into why this is happening and how to resolve it.

The issue occurs only one the first load (I guess it should be cache work) so in order to observe it again a clean refresh is needed

Upvotes: 0

Views: 92

Answers (1)

Danny '365CSI' Engelman
Danny '365CSI' Engelman

Reputation: 21173

Only after you decorated the room with your furniture, you bring in the rolls of wallpaper.

That is the FOUC

Your biggest problem is Material Design; how much of it is required to draw you first page?

Before you start other solutions that will always delay furniture delivery I would first take an hour and see what from Material Design you can copy to a <style> in the <head> of your main document.

Upvotes: -1

Related Questions