That’s known as “Flash of Unstyled Content” or FOUC.
It happens when you load CSS asynchronously.
Take a look at this doc to see why it might be happening on your site, and how to fix the issue.
I off the Generate Critical CSS in the Background . Should i on it after some time? after turning of the problem is still there. Is it take some time to generate CCSS?
Plugin Support
qtwrk
(@qtwrk)
Hi,
Please check this wiki , it may give you some idea
Best regards,
i am asking can i on Generate Critical CSS in the Background after the problem had solved? And should we keep it off for permanently?
Plugin Support
qtwrk
(@qtwrk)
Hi,
Let me explain how CCSS works , so you can have a better idea.
When you have load async CSS, that means HTML code is loaded BEFORE css, therefore, rendered without style , CCSS is to address this issue by insert the “critical” part of style (usually the view port part ) into HTML , so it can renders with style for the view port , while loading CSS Asynchronously
So when you set it to foreground , the page will wait until CCSS rule is generated and inserted into HTML code , therefore you won’t see the unstyled page.
if you set it background , it will still be unstyled if you purged CCSS rule. as the generation is not at same time as page generation.
All in all , I’d personally suggest to set it to foreground , it may delay few seconds if CCSS is not generated , but it will be smooth afterwards.
Best regards,
