How do I stop the flash of unstyled content (FOUC) on a web page?
The best solution I found till now is like this:
Add all styles of your header to a tag in
at the top of style tag add .not-visible-first{visibility: hidden} + other header style
Add css via JS at the end of body
document.getElementsByTagName("head")[0].insertAdjacentHTML("beforeend","");
And remember to add .not-visible-first{visibility: visible} to the end of main.min.css
This option will create better user experience