Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

31
© 2013 Yottaa, Inc. All Rights Reserved. www.yottaa.com Yottaa, Inc. 160 Federal Street Boston, MA 02110 4/25/22 Beyond CDNs: How To Harness the Next Phase of Innovation in Web Performance Greg Lazar (former VP and GM at Akamai) Bob Buffone (Yottaa CTO)

description

 

Transcript of Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

Page 1: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

© 2013 Yottaa, Inc. All Rights Reserved.www.yottaa.com

Yottaa, Inc. 160 Federal StreetBoston, MA 02110

April 8, 2023

Beyond CDNs: How To Harness the Next Phase of Innovation in Web Performance

Greg Lazar (former VP and GM at Akamai)

Bob Buffone (Yottaa CTO)

Page 2: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

2

Yottaa: Accelerate Mobile and Web Businesses

Founded: 2009

Customers:

eCommerce

Mission-critical websites across…

Financial Services Media

Software-asa-Service

Consumer Goods

Business Services Electronics

Enterprise Software

Data Center Locations30+

Product: Yottaa Performance Cloud

Performance Cloud

Page 3: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

3

Agenda

• 5 Forces Transforming the Web• Modern Web’s Performance Bottlenecks• Emerging Technologies & Best Practices• Case Studies from Media & E-Commerce

Greg Lazar: former General Manager & VP at Akamai

Bob Buffone: Chief Technical Officer at Yottaa

Page 4: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

The 5 Forces Transforming the Web

(It’s not your father’s internet!)

4

Page 5: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

5

1: Explosion of MobileGlobal Internet Devices Shipment

(2005 to 2016, Unit: 500M)Must Optimize for 200+ Combinations

of Browser, Device, OS

(Source: Business Insider Mobile Report 2012)

2005

Personal Computers

Smartphones

Tablets

2006 2007 2008 2009 2010 2011 2012E 2013E 2014E 2015E 2016E

Page 6: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

Web Performance is Key to mCommerce

64%OF SMARTPHONE

USERS EXPECT PAGES TO LOAD IN

UNDER 4s$1Bn

APPAREL &ACCESSORIES

PURCHASES

in Q113

71%Of all retail transactions

SMARTPHONEUSERS SHOP

VIA MOBILE

48%

Expect mobile to be fasterthan desktop

85%Will go to a competitorto transact

42%Will neverreturn toyour site

29%

Page 7: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

7

2) The Web is More Complex

Growth of Webpage Footprint & Numberof Requests (1995 to 2012)

(Sources: Demenech 2007, Gomez 2008, Charzinski 2010, Souders 2012)

Ajax / HTML5 Becomes

Mainstream

• 2.3 MB• 209 assets• 54 javascripts• 29 HTML files• 67 domains

Example: Godiva.com

Page 8: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

8

Content Complexity Hurts Performance

Page 9: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

9

3) The Web is More Social

1-5 6-10 11-20 21-40 41+ -

2,000

4,000

6,000

8,000

10,000

12,000

# of Domains vs. Time to Interact

# of Domains

Tim

e to

Inte

ract

(mse

c)

Source: Yottaa 2013 study of IR500 sites

Page 10: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

4) A Complex Application Delivery ChainData Center Middle Mile Last Mile Front End User Interactivity

Page 11: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

5) Performance is About User Engagement

11

CDN Value Proposition 2013 Business Goals

Time to Start Render

Time to Interact

Just-in-Time Content

Time on Site

Bounce Rate

Conversion Rate

Connection Time

Time to First Byte

Bytes/Second

Time to Last Byte

Content Offload

1000…STOP

…0001

Site Speed

0010001/sec

User Engagement

J-I-T

Delivering bits is necessary,but NOT sufficient.

Page 12: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

12

The 5 Forces Transforming the Web

1

The Mobile Web Complex Sites & Mobile Apps

2 3 The Social Web

Data Center

Middle Mile

Last Mile

Front End

User Interactivity

2013 Business Goals

Time to Start Render

Time to Interact

Just-in-Time Content

Time on Site

Bounce Rate

Conversion Rate

User Engagement

J-I-T

4 5Complex Application Delivery Chain

Redefinition of“Web Performance”

Page 13: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

Today’s Performance Problems (and Solutions)

13

Page 14: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

14

2013: Front End is the Bottleneck

Time to First Byte

Time to Last Byte

Time to Title

Time to Start Render

Time to Display

Time to Interact

- 1,000 2,000 3,000 4,000 5,000 6,000 7,000 8,000

332

355

1390.73759531042

2492.68058534296

6019.10289336835

7519.04716500154

Page Loading Timeline(Internet Retailer 500 sites)

Front EndBack End

Time (msec)

Page 15: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

Drilling Down Further…

15

Page 16: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

16

That Was Then (Old Way)… …This Is NOW (New Way)

Linear Loading and Rendering of Entire Page

Context-specific, Just-in-Time Rendering of Content

vs.

• Deliver all the content, code, styling and imagery for the webpage whether the user needs or wants it

• Deliver a single user experience for both mobile and desktop visitors

• Not plan for mobile user• Sacrifice user experience

metrics to deliver everythingat once

• Retrieve the content as the use requires it

• Understand what the user requires in real-time and fetchit for them

• Understand that devices are different and what the user needs for each device maybe different

• Keep important user experience metrics fast

Page 17: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

17

That Was Then (Old Way)…

Server-side Latency in Delivering Dynamic Content• Deliver all the content, code, styling and imagery for the webpage whether

the user needs or wants it• Deliver a single user experience for both mobile and desktop visitors• Not plan for mobile user• Sacrifice user experience metrics to deliver everything

at once

Page 18: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

Delivery of Dynamic Content: Today

ClientWeb

Server

Server pageProcessing

World Wide Web

1. Client requests a dynamic page

2. Server returnsthe Dynamic page

Page Rendering and

Processing

Page 19: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

InstantON™: A Breakthrough InnovationYottaa InstantON™ accelerates dynamic applications

in ways never possible before:

ClientWeb

Server Network

2b. Yottaa requests the page from the web server

2a. Yottaa immediately returns a partial page from its cache

1. Client requests a dynamic page

3a. Server returnsa new page3b. Returns page delta and

client processing instructions

Page Rendering and

ProcessingServer pageProcessing

PageProcessing

Partial PageDelivery

Page Delta

Page 20: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

20

Unnecessarily Large Size and Quantity of

Serially-delivered Assets

That Was Then…

Front End Optimization (FEO)

Techniques

…This Is NOW

Page 21: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

Front End Optimization

Problems: Solutions:

Large Assets

Lots of Requests

Serialization

Reduce # of Requests:• Combine Scripts and Images• Combine images with Sprites• Employ data URIs

Reduce Asset Weight:• Use Gzip• Minify Scripts• Use Lossy and Lossless Image Compression

Parallel Processing:• Load 3rd Party Assets Asynchronously• Use Domain Sharding• Use Intelligent Script Loaders

Page 22: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

22

That Was Then (Old Way)… …This Is NOW (New Way)

Commitment toSingle CDN Vendor CDN Federation

vs.

• Sign on CDN contract and be locked in via contract for 2 years and via integration effortfor longer

• Suffer bad performancein certain regions

• Costly software changes to code to integrate fully with CDN

• Solve only a small part of the performance problem

• Deliver the best performancefor your visitor in all regions

• Integration is done automatically to multiple CDNs

• Single API can control and manage all CDNs

• No software changes required

Page 23: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

23

That Was Then (Old Way)… …This Is NOW (New Way)

“One-Size-Fits-All” Optimizations

Device-specific Optimizations

vs.

• Least common denominator approach to web performance

• Leave mobile un-optimized• Think about your application

as mobile vs. desktop• No possible way to deliver great

performance without the capital of Facebook or Google

• Target all device profiles witha best fit strategy

• Understand there are at least3 application scenarios:

Mobile site on mobile Standard site on mobile Desktop site on desktop

• Deliver on the potential 1000sof combinations of device, browser and network limitations of your users

Page 24: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

24

That Was Then (Old Way)… …This Is NOW (New Way)

Performance Delivered by DevOps & Your Infrastructure

Performance Deliveredvia the Cloud

vs.

• After the release ask operations and development to fix the performance issues

• Operations tells Business: “We need a hardware upgrade”(p.s. It will only fix part of the problem)

• Development tells Business: “We will put this into the next release”(p.s. It will only fix part of the problem)

• Both operations and development tells Business: “We need a new platform”(p.s. It will only fix part of the problem)

• Business can see the correlation of performance and business metrics

• Business can solve with the help of operations and development the complete problem

• Business can easily predict both the cost and the ROI of solving performance problems

Page 25: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

25

Inability to Deal with 3rd Party Tags

That Was Then…

Performance-focused Tag Management

…This Is NOW

Page 26: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

Applying the Best Practices:Examples from the Field

26

Page 27: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

27

Your Servers

Yottaa Solution

Search Engines

Browsers

Web Visitors:

Mobile

Performance Cloud

Cloud Firewall

Federated CDN

Front End Optimization

Application Sequencing

User Engagement Visibility

12

3

Page 28: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

28

Case Study: Brit Awards

• “The British Grammys”: The biggest event in the British music industry’s calendar

• Millions of daily page views during peak

Page 29: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

29

User Experience Improved ~50%

Time to Start Render Time to Interact -

0.50

1.00

1.50

2.00

2.50

3.00

3.50

4.00

4.50

5.00

Without YottaaWith Yottaa

Tim

e (s

ec)

Page 30: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

30

Dramatic Reduction in Infrastructure Load97% reduction in requests and bytes offloaded to Yottaa network

Sailed through traffic spikes

Page 31: Beyond CDNs: How to Harness the Next Phase of Innovation in Web Performance

Thank You