Is It Safe To Use Cloudflare Rocket Loader With Google Adsense?

Many website owners use Cloudflare to speed up their sites. Cloudflare’s Rocket Loader is a CDN setting that can help render pages faster by loading scripts asynchronously. However, some website owners have reported that their Google Adsense ads stopped appearing on their site after they installed the Rocket Loader plugin. Is it safe to use Cloudflare’s Rocket Loader with Google Adsense?

The short answer is yes, it is safe to use Cloudflare’s Rocket Loader with Google Adsense. There should be no need to worry about your ads not appearing on your site if you are using this plugin. However, if you are experiencing problems with your ads not appearing, there is an easy fix.

Rocket Loader does comes with some caveats[1]Support.Cloudflare: https://support.cloudflare.com/hc/en-us/articles/200168056-What-does-Rocket-Loader-do-, so you’ll want to use it with caution.

What Does Rocket Loader Do?

Rocket Loader is a CDN tool that is designed to defer the load of JavaScript files until after the page is largely rendered. This will help with your SEO and user experience (UX) by boosting common front-end performance metrics, like Time to First Paint (TTFP) and Time to First Contentful Paint (TTFCP).

When reviewing a site with Rocket Loader working, you’ll see a first party (on-domain) script that is placed on the site by the CDN, not your normal web server. It’ll look like this:

cloudflare-static/rocket-loader.min.js

This will change the loading behavior of your JS files. Many sites use the Partytown libary as an alternative to this, though that is more complex to setup and to troubleshoot.

What To Do If Adsense (Or Other JS) Is Breaking

You want to tell Cloudflare not to defer the loading or otherwise change the behavior of that javascript file. Modify your Adsense script tag, adding the following code: data-cfasync=”false”.

This will make your Adsense javascript follow this format:

<script data-cfasync=”false” src=”/javascript.js”></script> 

This will tell Rocket Loader to ignore that script in its optimization tasks.

Make sure to troubleshoot other issues too. First, it is possible that the ad code on your site is not placed correctly. Make sure that the ad code is placed in the correct position on your web page so that the ads can be displayed correctly.

Second, it is also possible that the Ads Personalization setting in your Google Adsense account is preventing your ads from being shown. Ads Personalization allows Google to show you more relevant ads based on your interests and online activity. If you want to show ads on your site regardless of personalization, you will need to turn this setting off in your account.

If none of this fixes the problem and your Adsense earnings are in decline (which means the problem is affecting other users besides yourself then go ahead and turn off Rocket Loader.

How To Turn Off Cloudflare Rocket Loader

To disable Rocket Loader you must:

  1. Login to Cloudflare
  2. Select the website in question.
  3. On the sidebar, go to Speed and pick the submenu item Optimization.
  4. Scroll down until you find Rocket Loader.
  5. Flip the switch from On to Off

Still Broken?

At this point the last step would be to disable Cloudflare APO (Automatic Platform Optimization) if you happen to be running it. This can also create weird issues with some JS code.

Conclusion

Overall, there is no need to worry about using Cloudflare’s Rocket Loader with Google Adsense. If you are experiencing problems with your ads not appearing, make sure that the ad code is placed correctly and check that you’ve placed the Cloudflare ignore tag properly.

References

References
1 Support.Cloudflare: https://support.cloudflare.com/hc/en-us/articles/200168056-What-does-Rocket-Loader-do-