Firefox momentarily rendering pages as text before html render
Firefox 54.0 (64-bit) is rendering pages on my website (https://hitandruncandlesticks.com/) as text for a split second...and only then rendering it as html using CSS. This is not a problem using Chrome, only Firefox.
Here is a link to a 38sec video demonstrating the issue on any page of my website. https://www.screencast.com/t/fyDx00ISmwPj
Why is this the case and how do I solve it?
Thanks in advance.
All Replies (4)
This is pretty extreme. I've never seen this before.
When I look into the source code, there is something very unusual about your style sheet link tags. For example:
<link rel='preload' id='jmbootstrap-style-css' href='https://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css' as="style" onload="this.rel='stylesheet'" type='text/css' media='all' />
Firefox does not support rel='preload' so those are not being handled in the correct sequence, and it's interesting that they work at all. (http://caniuse.com/#search=preload)
Assuming these are being created by your caching plugin rather than your theme, can you ask WP Rocket support for how to serve Firefox normal style sheet links instead of those preload links?
Thanks, I'll check with WPRocket.
I've also asked Microsoft when they might catch up (support the preload function) and will post any response here for future user reference.
I'll see if I can ask the Firefox Dev team if they have plans for future support of that preload function as well.
esc952 said
I'll see if I can ask the Firefox Dev team if they have plans for future support of that preload function as well.
There is a bug pending for it, but it might not be standardized by W3C yet, and that can hold things up.
Thanks. It does appear bureaucracy of W3C is dragging far behind and for whatever reason Firefox and Edge have decided to lag rather than lead.
WPRocket has yet to respond.
However, Microsoft tells me the Preload function has been shipped by: - Chrome - Opera Is under development by: - Safari - Firefox and is under consideration by: Edge. IE11 (discontinued will not support it).
This can be seen here: https://developer.microsoft.com/en-us/microsoft-edge/platform/status/preload/