Rocket Loader Loading HTML before CSS?

This is a general Q for anyone who is using Rocket Loader on WordPress sites and sees issues where certain elements load before they should.

We have an issue where a dropdown menu is loading unstyled for a split second before the page renders, and this disappears, even though we have the css right at the top saying, no, please dont do this Rocket Loader, please don’t interfere.

Rocket just seems to load the pages really weirdly and is unpleasant on the eye, and with it switched off (leaving the rest of cloudflare options enabled, minify, brotli etc) the page renders beautifully.

Is Rocket Loader worth the hassle when using WordPress?

It depends on your WordPress installation. Ever heard of the Anna Karenina principle, as it applies to WordPress sites? It goes more or less like this:

All happy WordPress sites are alike. Each unhappy WordPress site is unhappy in its own way.

Each WP site is installed under a specific server configuration, contains a specific theme and a unique set of plugins, and may have its own code customization. So it’s not guaranteed Rocket Loader will be worth it in all cases. Each site admin needs to implement it and test.

For example, you don’t need to use Rocket Loader along with other JS file aggregators, such as the Autoptimize and Clearfy plugins.Which one will perform better, plugin or RL (or even both), is a matter for testing.

Because we are dealing here with the ordering of JavaScripts files, you need to make sure that there are not conflicting JS codes on your installation, as many plugins (and sometimes the theme itself) handle similar functions at different moments while the page is being prepared.

You can open Developer Tools (F12 on Chrome/Win) on Network tab, and set Network Conditions to emulate a slow 3G speed, and it should let you see which file is being loaded in what order, both with and without Rocket Loader on.

1 Like