Hi zorrik, it's interesting.

• If I block scripts from running on your site, everything looks fine. That's the scenario for my first load because I use NoScript.

• Once I relax that restrictions and let scripts run, the problem appears.

This is caused by using rel="preload" in your style sheet link tags. (There is a <noscript> block which loads the stylesheets directly so that's why the styles are applied when scripts are disabled.)

Unfortunately rel="preload" is not available in Firefox at the moment. This is indicated in the compatibility tables at the bottom of the articles:

• https://developer.mozilla.org/docs/Web/HTML/Preloading_content#Browser_compatibility

• https://developer.mozilla.org/docs/Web/HTML/Element/link#Browser_compatibility

It would be simplest and have the broadest compatibility to use rel="stylesheet" for those link tags. You could test whether it makes any performance difference in other browsers that support rel="preload".

If you personally want to test out how well preload works in Firefox, you can toggle a preference, but this isn't something you could rely on users to do:

(1) In a new tab, type or paste about:config in the address bar and press Enter/Return. Click the button promising to be careful or accepting the risk.

(2) In the search box above the list, type or paste prelo and pause while the list is filtered

(3) Double-click the network.preload preference to switch the value from false to true

THANK YOU! Solution for me was the following: In WordPress I used Webcraftic Clearfy Plugin. Just disabling did not work as it kept the preload settings. I have re-enabled it, went to Performance->Minify (HTML/JS/CSS) -> CSS Options -> Inline and Defer CSS? -> OFF

Clear cash and all is perfect.