Chrome Refresh Problems

Question

I'm having an occasional problem with Chrome not properly loading CSS files when I hard-reload (ie. clear the cache then reload). In other words, Chrome properly loads the page, but no style is applied to it. However, if I hard reload again, the CSS file is retrieved and the style is properly applied.

This is especially pronounced on sites built in MediaWiki (like Wikipedia, or my own personal Wiki).

Unfortunately, it's really irregular, so it's hard to debug. I haven't seen anything in the console to help me figure out what's going on. However, it is frequent enough that I hardly use Chrome anymore, and instead just use Firefox.

Is there some way to make sure that Chrome uses its cached version of the CSS file so that this doesn't happen? I'm assuming that is what IE and Firefox are doing and why they don't have this problem.

Answer 1

You say it happens on both Wikipedia and your own MediaWiki installation, so we can rule out "reinstalling MediaWiki" as a solution. :) (Altough, system administration volunteers for Wikipedia and all the Wikimedia projects are welcome!)

Some users occasionally experience timeouts especially for the resources loaded from bits.wikimedia.org (mainly CSS and JS). I've heard of users satisfied by a simple Chrome/Chromium extension which simplifies the resources loaded, removing a particularly heavy one.

That said, I'm a bit confused by how this could happen on your wiki as well. It's entirely possible that the first request hits a cold cache and times out, while the second hits a warm cache and responds on time. [Firefox does fancier things with local cache, which sometimes improve things (as might be happening here) and sometimes not.] If this is the case, you may want to use webpagetest.org or similar to find out whether your load.php calls are particularly slow.