Optimize Leverage Browser Caching for Google Analytics

If you tested your WordPress Loading Speed via Google Speed Test-inside or GTMetrix tools, you have probably noticed a performance problem if you use google analytics.

What does this error mean? Nothing serious, simply it means we are loading a third-party script (Google Analytics) and that this resource has a declared expiration time of 2 hours. And to pass this error, it should be at least two weeks.

If you plan to cache static resources in the client’s browser, you need to know that we cannot configure the expiration time of resources uploaded by third parties.

Therefore, if a visitor enters your website and repeats the visit in a time greater than two hours, the google analytics JS file will be downloaded again, which size is 43.4 KB. And any download, any data transfer takes time and makes your website go slower.

Leverage Browser Caching Google Analytics

So, today we will learn how to optimize the expiration time of third-party resources in WordPress without any extra plugins?

As I told you earlier, we can not optimize the expiration time for a resource loaded from third-party sources. Therefore, if we want to optimize it, we will have to download it on our server and serve it from there to have control over it.

If we download and save google analytics Js files on our server, we may lose any possible future updates, improvements, bug fixes, and vulnerabilities made by a third party. And, If Google adds such a short cache expiration time for the analytics script, it probably undergoes many changes.

So, we will not download the google analytics Js file to our server every two by three to keep it updated. It’s not the best solution to resolve the Leverage Browser Caching Google Analytics error.

Therefore, the ideal thing would be to set up a “system” that automates the download of this resource on our server. We serve it by setting a higher expiration time and passing the WordPress Speed Optimization test result error.

And to do that, the idea is to set a cron that executes a request where we will obtain the resource of the google analytics server and store it in a local folder on our server.

register_activation_hook( __FILE__, 'ga_register_cron' );

function ga_register_cron() {
    // Si no existe el evento, lo registramos
    if ( ! wp_next_scheduled( 'ga_daily_cron' ) ) {
        wp_schedule_event( current_time( 'timestamp' ), 'daily', 'ga_daily_cron' );
    }
}

function update_ga_js() {
    $remoteFile    = 'https://www.google-analytics.com/analytics.js';
    $localFilePath = ABSPATH . 'ga/';
    $localFile     = $localFilePath . 'local-analytics.js';

    if ( ! file_exists( $localFile ) ) {
        wp_mkdir_p( $localFilePath );
    }

    if ( ! is_writable( $localFile ) ) {
        $stat  = @ stat( dirname( $localFile ) );
        $perms = $stat['mode'] & 0007777;
        $perms = $perms & 0000666;
        chmod( $localFile, $perms );
        clearstatcache();
    }

    $response = wp_safe_remote_get(
        $remoteFile,
        array(
            'timeout'  => 10,
            'stream'   => true,
            'filename' => $localFile,
        )
    );
}
add_action( 'ga_daily_cron', 'update_ga_js' );

The first thing is to register the cron. In our case, we will update the Google Analytics script daily. And this Cron registration needs to be set for only once a day.

In the above example, we will do it under the event triggered when activating a plugin for educational purposes. If you do so, remember to disable cron when disabling the plugin.

We register the ga_daily_cron event that will execute once a day. Next, we hook a method ( update_ga_js ) to this event.

In this method, we have on the one hand the URL of the remote resource that we want to download, and we establish the specific path where to save it on our site.

The first thing is to check if the file exists; we create the folder if it does not exist. Next, we review the permissions, and if you don’t have the necessary write permissions, we set them for you to store the file there.

Finally, we obtain the file with wp_safe_remote_get (basically, it is a CURL request using the WordPress HTTP API), and we store it in the path that we have defined. As simple as that.

How do we load the analytics script from “local”?

We only have one last step left to do, and that is to modify the code that google analytics provides us to load the script from our local server instead of from the Google server:

There are so many plugins available that will do the above things for you, but as always, It’s a good practice not to use many plugins for a small task.

How to solve Leverage Browser Caching Google Analytics with Plugin?

Not everyone likes to touch code in WordPress. Many users who don’t feel good about changing code are like to use plugins.

Google gives priority to website speed, and we also need to resolve this Leverage Browser Caching issues for Google Analytics to improve our WordPress website loading speed result. Let’s learn how we can solve Leverage Browser Caching Google Analytics step by step.

1. First of all, You need to install the Complete Analytics Optimization Suite (CAOS) plugin by Daan van den Bergh.
2. After installing the plugin, active it. After activating the plugin, you will get the option here: Settings > Optimize Analytics
3. Go to Optimize Analytics menu and add your Google Analytics Tracking ID.
4. make sure you chose the position of the tracking code to the footer.
5. Finally, Click on the Save Changes and you are done with all steps.

This plugin will create a local analytics.js (Google Analytics Script) file on your server. And uses the same file with Google Analytics code. Also, it will automatically update the analytics.js files from Google servers after a certain period of time via the wp_cron() function.

I hope after doing the above things, you will be able to resolve your Leverage Browser Caching issues for Google Analytics error.

Remember, Good and Optimize hosting for WordPress is always recommended. It will help your WordPress website to load very fast. For all the WordPress Websites develop by the Appbuff team, we always recommend using Cloudways hosting. Cloudways is so far one of the best hosting providers to us within budget. If you have a good budget, then you may go Kinsta hosting as well.

It’s also a good practice to use a Good CDN with Good hosting services.

Best of luck on optimizing your WordPress website loading speed.