Improve Page Load Time with Amazon CloudFront
Faster site → happier users
Faster site → more site usage
Faster site → lower hardware cost
Faster site → better google ranking
Polyvore is a image-heavy site
7000 images served per second (peak)240M images served per day40TB images served per month
Polyvore is a global site
Global user baseAt the speed of light, round trip from Europe to California takes more than 100 msOur images load slowly for international users.
CDN: Geologically distributed caches
We can't speed up light.
But we can shorten the distance.
User connects to the nearest server (the edge server)
Lower latencyFaster downloadMore reliable connection
More servers serving data
Increases bandwidth by eliminating central server bottleneck.
Amazon CloudFront
Amazon's CDN offeringSelf-served, no sales peoplePay as you goAPINo contract
Setup CloudFront
Set up an origin server
An origin server stores the definite version of your objects.Could be an Amazon S3 bucket or your own web server
Create a distribution
A distribution specifies the location of your origin server.A distribution has a unique CloudFront domain name, e.g. d2zdxp93p38w2g.cloudfront.net
Create a distributionIn the AWS managing console:
Serve objects under the distribution domain
http://d2zdxp93p38w2g.cloudfront.net/images/logo.jpg
→ www.polyvore.com/images/logo.jpg
Use CNAMEsOptional, but recommendedSet it up in the distribution and your DNS
Why use CNAMEs
No more cumbersome CloudFront domain
More flexibility to change CDN provider
Cache controlObjects expire in 24 hours by default.Set your own cache control headers to override the default. e.g.
Expires: Mon, 12 Apr 2021 00:26:56 GMT Cache-Control: max-age=31536000
Minimum expiration time you can set is one hour.
Object invalidationRemoves an object from cache before it expires.Useful when updating an object.Call the InvalidationBatch function in the API
Reporting tools
Amazon doesn't provide much.
Download access logs and roll your own analysis.
Does it really help?
Compare performance
Single image file download time:156 ms vs 478 ms
Measured by Pingdom, through their global server network.
Compare performance
Page load time improvements:
Compare performance
Slower in some countries, mostly countries with low traffic.
Overall 11% improvement in page load time.
How we measure itUse Javascript to measure page load time and beacon it back
At the top of each page(function() { // record page start time var start = new Date().getTime(); window.onload = function() { // record page load time var _end = new Date().getTime(); // fetch the beacon and pass in (_end - _start) ... });};})();
Process our access log to gather the beaconed data.External resource files may throw the number off
Should I use CloudFront?
Cache hit rate dictates CDN performance
A missing object needs to be retrieved from the origin server before it can be served, and it is more expensive than serving it from the origin server directly.
What determines hit rate?
Access pattern to your objects1 object accessed 10M times → good10M objects accessed 1 time each → bad
How much space is allocated on edge serversObject eviction: when edge servers are short on space, objects may get removed before they expire.Amazon doesn't share specific stats about eviction.
So what's our hit rate?Amazon doesn't provide this stats. We determined it's around 85% by analyzing CloudFront's access logs and our own.
Bonus material Akamai vs CloudFront
Akamai: bigger, faster, and cheaper?
More edge servers.Competitive price
Akamai performance test
Twice as fast in single file testLive traffic test non-conclusiveWorking with Akamai to diagnoseWe'll post updates
Questions & follow-ups
Top Related