CODEWITHSUNDEEP
node.jsgoogle-maps-api-3expressbrowser-cachepagespeed
Manoj
Manoj

Reputation: 483

Leverage browser caching external files

I used google pagespeed Insights to test the performance of my nodejs website. For some of external files it is saying to leverage browser caching but I don't know how to do this ?

Leverage browser caching

Setting an expiry date or a maximum age in the HTTP headers for static resources instructs the browser to load previously downloaded resources from local disk rather than over the network. Leverage browser caching for the following cacheable resources:

http://maps.googleapis.com/…kwPPoBErK_--SlHZI28k6jjYLyU&sensor=false (30 minutes)

http://www.google-analytics.com/analytics.js (2 hours)

Anyone please help me on this.

Upvotes: 12

Views: 15369

Answers (2)

eQ19
eQ19

Reputation: 10701

If you don't have access to httpd.conf file as rudolfv's answer there are several options here:

  1. the easiest one is you could copy its content each day to make sure your up to date
  2. we can employ the powers of cron, there is nice sample script using php posted here

  3. use a php script to generate the google analytics script on every request on the fly:

        $context = stream_context_create(['http' => ['Content-Type' => 'text/javascript', 'enable_cache' => true, 'enable_optimistic_cache' => true, 'read_cache_expiry_seconds' => 86400,]]);      
    echo file_get_contents("http://www.google-analytics.com/analytics.js", false, $context);

  4. use the power of .htaccess if your hosting provider allowing mod_headers & mod_proxy

        RewriteEngine On        
    Header set Cache-Control "max-age=86400"        
    RewriteRule ^js/analytics.js http://www.google-analytics.com/analytics.js [P]

Upvotes: 3

rudolfv
rudolfv

Reputation: 817

One solution is to reverse proxy the Google resources. Then you can add Cache-Control and other caching headers. If you're using Apache you can accomplish it as follows in your httpd.conf file:

ProxyRemote http://www.google-analytics.com http://yourinternalproxy:yourport

<Location /analytics.js>
  ProxyPass http://www.google-analytics.com/analytics.js
  ProxyPassReverse http://www.google-analytics.com/analytics.js
  Header set Cache-Control "max-age=86400"
</Location>

The drawbacks of this are that:

  • You'll funnel a lot of additional traffic through your servers.
  • Obviously updates made by Google will take longer to appear for the user's of your site.

Upvotes: 5

Related Questions