Leverage Client Side (Browser) Caching Consistently

For viewing all tips see here


Applicable To
All Browsers

How Improves Page Load Time
o        By optimizing number of network roundtrips
o        By optimizing network latency (HTTP Payload Size)

Prologue
Most web pages include resources that don’t change frequently (e.g. CSS, Java Scripts and Images etc.) but they take additional network time for downloading, which increases the page load time.  HTTP Caching allows these resources to be cached by browsers / proxies.  Once cached by browser, the browser can refer locally cached resource rather than downloading it again on subsequent visit from distant web server over the network.


Why
o        To eliminate network round trip time
o        To reduce total payload size of the responses
o        Reduce the bandwidth and hence hosting cost of website
o        Some of the newest browser use a heuristic to decide how long to cache all resources that don’t have explicit caching headers.  Other older browser may require caching headers to be set before they fetch a resource from cache.  So it needs to be leveraged consistently


How
o        Configuring the web server to explicitly set caching headers and apply them to all static resources (images, CSS, Java Scripts, Media Files, PDF Files, Flash Files etc.)
o        By specifying caching headers, one of Expires or Cache-Control max–age AND one of Last-Modified or ETag for all static resources.  It is redundant to specify Expires and Cache-Control max-age and similarly Last-Modified and ETag both.  Header Expires is more widely supported than Cache-Control max-age
o        Make sure to strip Vary header or any other fields than Accept-Encoding and User-Agent as IE doesn’t cache any resources that are served with the Vary header and any other fields but Accept-Encoding and User-Agent.
o        Avoid URL that cause cache collision in Firefox
o        Use Cache-Control: public directive to enable HTTPS caching for Firefox as some version of Firefox makes this directive mandatory for caching to take place for HTTPS connections.


Exceptions
None


Recommendations
Setting Expires to a minimum of one month or up to one year in the future.  Don’t set more than one year in future as it violates the RFC guidelines

Comments

Popular posts from this blog

Performance Test Run Report Template

Understanding Blockchain

Bugs Management in Agile Project