Comment exploiter la mise en cache du navigateur pour Google Analytics
Pour améliorer la note de ce site dans PageSpeed Insights, il ne me restait plus qu’à optimiser Google Analytic.
Il est malheureusement impossible d’optimiser les en-têtes d’un fichier hébergé à l’extérieur de son serveur. Qu’à cela tienne, j’ai donc décidé d’héberger moi-même Google Analytics.
1. Copier le script sur votre serveur
Pour commencer, créer un fichier JavaScript sur votre serveur, comme par exemple, « analytics.js ». Puis copier la totalité du fichier disponible à cette adresse google-analytics.com/analytics.js et coller le dans votre nouveau fichier.
2. Changer votre code Google Analytics
Voici le code par défaut de Google Analytics:
<script> (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','//www.google-analytics.com/analytics.js','ga'); ga('create', 'UA-xxxxxxxx-1', 'auto'); ga('send', 'pageview'); </script>
Vous devez changer le chemin actuel ‘//www.google-analytics.com/analytics.js’ pour celui sur votre serveur.
Voici le résultat pour mon site:
<script> (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','<?php echo get_bloginfo("template_directory"); ?>/js/analytics.js','ga'); ga('create', 'UA-xxxxxxxx-1', 'auto'); ga('send', 'pageview'); </script>
3. Vérifier le fonctionnement
Rendez-vous dans la section « Temps réel » de Google Analytics pour vérifier si votre code de suivi fonctionne toujours.
4. Automatiser la mise à jour du fichier (Optionnel)
C’est bien beau tout ça, mais si Google fait des modifications à son script, nous n’aurons pas les mise à jour.
Vous pourriez copier/coller le script régulièrement, mais ce n’est pas vraiment une option valable…enfin pour moi.
Voici un script PHP gracieuseté de Tips4php pour automatiser cela.
// script to update local version of google analytics script // Remote file to download $remoteFile = 'http://www.google-analytics.com/ga.js'; $localfile = '/var/www/example.com/static/local-ga.js'; // Connection time out $connTimeout = 10; $url = parse_url($remoteFile); $host = $url['host']; $path = isset($url['path']) ? $url['path'] : '/'; if (isset($url['query'])) { $path .= '?' . $url['query']; } $port = isset($url['port']) ? $url['port'] : '80'; $fp = @fsockopen($host, '80', $errno, $errstr, $connTimeout ); if(!$fp){ // On connection failure return the cached file (if it exist) if(file_exists($localFile)){ readfile($localFile); } } else { // Send the header information $header = "GET $path HTTP/1.0\r\n"; $header .= "Host: $host\r\n"; $header .= "User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1.6) Gecko/20070725 Firefox/2.0.0.6\r\n"; $header .= "Accept: */*\r\n"; $header .= "Accept-Language: en-us,en;q=0.5\r\n"; $header .= "Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7\r\n"; $header .= "Keep-Alive: 300\r\n"; $header .= "Connection: keep-alive\r\n"; $header .= "Referer: http://$host\r\n\r\n"; fputs($fp, $header); $response = ''; // Get the response from the remote server while($line = fread($fp, 4096)){ $response .= $line; } // Close the connection fclose( $fp ); // Remove the headers $pos = strpos($response, "\r\n\r\n"); $response = substr($response, $pos + 4); // Return the processed response echo $response; // Save the response to the local file if(!file_exists($localFile)){ // Try to create the file, if doesn't exist fopen($localFile, 'w'); } if(is_writable($localFile)) { if($fp = fopen($localFile, 'w')){ fwrite($fp, $response); fclose($fp); } } }
La seule modification à apporter est de changer le chemin d’accès de la variable « $localfile ». Attention: de prendre le chemin absolue de votre serveur.
$localfile = '/var/www/wppourlesnuls.com/wp-content/themes/montheme/_/js/analytics.js';
5. Créer un Cron Job (Optionnel)
Pour terminer, il est possible de configurer un Cron Job dans votre Cpanel, avec WordPress ou bien d’utiliser simplement un service externe comme Setcronjob qui s’occupera d’appeler votre script une fois par jours/semaine, c’est comme vous voulez.