Whole Site Delivery with Amazon CloudFront

Alex Dunlap

Whole Site Delivery with Amazon CloudFront

Sr. Manager, Amazon Web Services

Agenda

• What is Whole Site Delivery?

• Why use CloudFront for Whole Site Delivery?

• Demo

• Customer Stories:

– Stephen Evans, Toronto Star Newspapers

– Irakli Nadareishvili, National Public Radio

What is Whole Site Delivery?

Dynamic

Static

Personalized Website Example

Typical Website Architecture

Elastic Load

Balancing

Dynamic Content

Amazon EC2

Static Content

Amazon S3

cdn.example.com/*.jpg

www.example.com/*.php

Custom Origin

OR

OR

Custom Origin

Whole Site Delivery with CloudFront

Elastic Load

Balancing

Dynamic Content

Amazon EC2

Static Content

Amazon S3 Custom Origin

OR

OR

Custom Origin Amazon CloudFront

www.example.com

*.jpg

*.php

Whole Site Delivery: Common Myths

Myths…

• None of my HTML pages are cacheable.

• My HTML pages are customized so

those cannot be cached.

• My pages are personalized and unique

for each user, so a CDN won’t be useful.

Debunked…

• Often, many pages are cacheable – e.g.

search results pages.

• Use Cookies and Query Strings as

cache keys – e.g. local weather pages.

• Network and path optimizations allow

CloudFront to speed up dynamic content

– e.g. personalized pages.

Whole Site Delivery Use Cases

• News

• Weather

• Sports

• Social Media

• Advertising

• Travel

• Stocks

Why use CloudFront for Whole Site Delivery?

Benefits of Whole Site Delivery with Amazon CloudFront

Making your web applications…….

Faster

Scale Better

More Available

Easier to Manage

Cost Less

…by leveraging AWS’ presence at the edge of the Internet.

CloudFront can make your web applications…….

Faster

Scale Better

More Available

Easier to Manage

Cost Less

Faster: The Performance Problem

Long Distance + Poor Network = Slow Load Times

Faster: How CloudFront Helps

CloudFront helps change this equation to…

Short Distance + Optimized Network = Fast Load Times

Faster: Global CloudFront Network

Europe Amsterdam (2)

Dublin

Frankfurt (2)

London (2)

Madrid

Milan

Paris (2)

Stockholm

Asia Hong Kong (2)

Osaka

Singapore (2)

Tokyo (2)

South America Sao Paulo

North America Ashburn, VA (2)

Dallas, TX (2)

Hayward, CA

Jacksonville, FL

Los Angeles, CA (2)

Miami, FL

Newark, NJ

New York, NY (3)

Palo Alto, CA

Seattle, WA

San Jose, CA

South Bend, IN

St. Louis, MO

Australia Sydney

Faster: Optimized Network Paths

Dynamic Content

Static Content

Amazon CloudFront

www.example.com

*.jpg

*.php

Low Latency

TCP/IP Window Sizing

Persistent Connections

Monitored Network Paths


Faster

Scale Better

More Available

Easier to Manage

Cost Less

Scale Better: How CloudFront Helps

Caching static content at the Edge.

Offloading connection set-up and SSL negotiation to the Edge.

Persistent connections and collapse forwarding help scale your

origin.


Faster

Scale Better

More Available

Easier to Manage

Cost Less

More Available: How CloudFront Helps

CloudFront is architected for high availability.

Serve cached content even when origin is unavailable.

Availability SLA.


Faster

Scale Better

More Available

Easier to Manage

Cost Less

Easier to Manage: How CloudFront Helps

No need to write any custom code.

Multiple origins and cache behaviors make it easy to architect for

whole site delivery.

Self service signup and configuration via AWS Management

Console and APIs.


Faster

Scale Better

More Available

Easier to Manage

Cost Less

Cost Less: How CloudFront Helps

Same price for dynamic and static content!

Preferential pricing on origin fetches from S3 and EC2. NEW!

CloudFront is less expensive than AWS Data Transfer (over 10 TB per month).

Reserved Capacity Pricing for reduced rates with commitment.

Configuring CloudFront for Whole Site Delivery

Demo

Cloudfront @ The Toronto Star Stephen Evans

Head of Digital Technology

April 18, 2013

About The Toronto Star

• Canada’s largest daily newspaper

• Focused on metro Toronto

• 3.3 million monthly unique visitors

• Small in-house digital group, technology team supported by vendors & corporate IT

• Digital group run as “startup” within corporate structure

• Tech stack includes Java, PHP, Ruby

• Relaunched flagship site thestar.com on Adobe CQ5 on Jan. 30, 2013

Why AWS?

• Rebuild of thestar.com, tech team, hosting infrastructure

• Evaluated various cloud-hosting options – capability, price

• Ran short pilot phase

• AWS clear overall winner in terms of flexibility, feature set, price

• Began migration of smaller sites Spring 2012

• Ongoing migration culminating thestar.com January 2013

Why CloudFront?

• Evaluated CloudFront vs. various more established players

• Cloudfront addressed all priority feature requirements

• Validated performance claims via prelaunch load testing

• Simplicity of configuration a clear advantage

• Ambitious roadmap to release additional features

• Clear price and pricing model advantages

Architecture

Production - US East Region

Elastic Load Balancer

Dispatcher/ApacheAmazon Linux 64 Bit

C1 Medium


C1 Medium

Publish CQ/CRXAmazon Linux 64 Bit

C1-Xlarge

Master

Author CQ/CRXAmazon Linux 64 Bit

C1-Xlarge


C1 Medium

Availability Zone A Availability Zone DAvailability Zone B

Cloudfront

VPC

Standby

Author CQ/CRXAmazon Linux 64 Bit

C1-Xlarge


C1-Xlarge


C1-Xlarge


C1-Xlarge


C1-Xlarge


C1-Xlarge

Whole Site Delivery

• Cache everything possible

• No server side cookies written, only select pages pass query strings

• Control caching granularly using 19 different rules

• Use distributed load testing to validate performance against multiple Cloudfront edge locations

• We use a single origin, but ELB and multi-tiered multi-AZ configuration on backend

• Planning a multi-region DR architecture that will also leverage CloudFront

Client Side Cookies

Behaviours

Success Metrics

• 50% response time improvement

• 99.99% uptime since relaunch (100% after launch day)

• Business impact: lower hosting cost, improved consumer experience, SEO

Lessons Learned

• Understand the constraints of using a CDN and CloudFront specifically up front

• Whole site caching presents unique challenges that are different from static asset caching – cookies, post requests

• The CDN does not remove the need to ensure your origin is scalable and has its own caching tiers

• Think about reporting requirements - how will you track usage?

• Engage with the business on caching rules – what behaviours will be applied to what parts of your site?

Thanks!

Ping me

[email protected]

@stephenaevans

mailto:[email protected]

NPR: Whole Site Delivery Scaling npr.org for the Election Night '12 and beyond.

Irakli Nadareishvili Director of Engineering, Digital Media, @NPR

Twitter: @inadarei @NPRTechTeam

Irakli Nadareishvili @inadarei

Election Night: Olympics of the News Websites

http://bit.ly/npraws


Traffic Spike:



Preparation is Key Measure, Improve, Repeat.



Step 1: Measure


https://github.com/npr/ec2-fleet


Bottlenecks: 1. Pipeline

2. Geography



Solution: Serve HTML through a CDN.

...but how?



Scalability: Every Second Counts



Pitfalls: 1. No user-specific content...

Sortof.

2. Could not CDN API

3. Content expiration takes

long time.



We Use Multiple CDNs


Irakli Nadareishvili @inadarei http://bit.ly/npraws

http://www.pbs.org/idealab/2013/03/ranking-the-slowest-

loading-news-sites-and-how-they-can-speed-up074.html

NATIONAL PUBLIC RADIO

Questions? Irakli Nadareishvili twitter: @inadarei http://bit.ly/npraws

Resources

Get Started at: http://aws.amazon.com/cloudfront/

Office Hours with CloudFront Engineers

May 9th, 1 pm Eastern (10 am Pacific)

Sign-Up: https://www2.gotomeeting.com/register/594793282

http://aws.amazon.com/cloudfront/

http://aws.amazon.com/cloudfront/

https://www2.gotomeeting.com/register/594793282

https://www2.gotomeeting.com/register/594793282

Thank You!

[email protected]

Whole Site Delivery with Amazon CloudFront

Technology

Transcript of Whole Site Delivery with Amazon CloudFront