Cash

Cache

What is cache?

Temporarily storing data for retrieval

An analogy

What is 2560 / 16?

160

Why use cache?

Faster response time

Saves computing power

Better user experience

CDN

Content Delivery Networks

Cache data in other servers, reducing fetch time.

worldwide cdn network

Let others do the work for you.

cloudflare
Cloudflare
aws-cloudfront
AWS-cloudfront
akamai
Akamai

CDN

Disadvantages:
  • Only static content
  • Cost ranges from free to expensive
  • Reliability/Security up to CDN

Cache-Control

Specifying how long browser should cache in headers

cache control diagram

Browser automatically returns same file if max-age is still active

HTTP response


						HTTP/1.1 200 OK
						Server: GitHub.com
						Content-Type: text/css
						Cache-Control: max-age=600
					

Cache-Control

Disadvantages:
  • No way to refresh content before max-age

E-tag

A checksum for your data

e tag diagram

Browser checks with server if it has the latest version of the file

HTTP response


						HTTP/1.1 200 OK
						Server: GitHub.com
						Content-Type: text/css
						Cache-Control: max-age=600
						etag:W/"269550530cc127b6aa5a35925a7de6ce"
					

E-tag

Disadvantages:
  • Still a HTTP request needed
  • More complex to set up on server side

Set up Cache-Control and E-tag

apache
Apache
nginx
nginx

Service Worker: Cache API

No server? No problem

Programmatic API that enables more flexible caching strategies

Allows you to control when, what, how to cache

https://serviceworke.rs/

Service Workers

Disadvantages:
  • Complex to set up and maintain
  • Really new, only supported in Chrome/Firefox
  • Will probably never be implemented in iOS
cache photo

Start caching

Less cashing

PUMA

Audience
Front-end developers
Objective
Introduce and educate about caching
Topic
Caching
Punch
Who doesn't want cache?
WIIFY
Spend less and make your users happier
Key Points
  • Start caching your webpages
  • Cache-Control & ETag
  • CDN
  • Service Workers - Cache API
Call to action
Cache your webpages
Know
Many ways to go about caching
Believe
There is no loss in not doing caching
Do
Use caching