![Page 1: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/1.jpg)
Performance AutomationMaking pages faster automatically
![Page 2: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/2.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 2
Agenda
• Introduction
• What is performance automation
• Basic terminology and concepts
• Case Study
• History of performance automation
• Market overview and challenges
• Q&A
![Page 3: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/3.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 3
![Page 4: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/4.jpg)
Web Performance
![Page 5: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/5.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 5
Making sites faster
without changing code
![Page 6: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/6.jpg)
![Page 7: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/7.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 7
Basic terminology and concepts
![Page 8: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/8.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 8
![Page 9: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/9.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 9
![Page 10: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/10.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 10
![Page 11: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/11.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 11
Waterfall chart
11
![Page 12: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/12.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 12
Waterfall chart
12
HTML
![Page 13: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/13.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 13
Waterfall chart
13
Resources
HTML
![Page 14: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/14.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 14
Waterfall chart
14
Start Render
Document Complete
FullyLoaded
![Page 15: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/15.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 15
Waterfall component breakdown
15
DNS lookup
DNS Lookup
• Takes one packet in each direction
• Time is limited to the latency of the connection (DSL/Cable/etc) for the single round trip
![Page 16: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/16.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 16
Waterfall component breakdown
16
TCP Connection
TCP Connection
• 3 packets
- ClientServer (SYN) - ServerClient (SYN/ACK) - ClientServer (ACK)
• Time is limited to the latency of the connection (DSL/Cable/etc) for the single round trip
![Page 17: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/17.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 1717
Time To First Byte
Time to First Byte
• Time from the request packet (usually 1) to the first packet of the response
• Includes the latency of the connect ion (DSL/Cable/etc) for a single round trip
• Also includes whatever server think time was involved in generating the response
Waterfall component breakdown
![Page 18: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/18.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 1818
Content Download
Download
• Time it takes for the entire content of the response to get to the browser
• Mostly limited by the bandwidth limit of the connection (DSL/Cable/etc)
Waterfall component breakdown
![Page 19: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/19.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 1919
First view vs Repeat View
![Page 20: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/20.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 2020
Concurrency
Blocking
Concurrent
Concurrency
•Blocking script don't let the browser use available resources (network, connections, etc) to fetch more content from the server
•The overall page load time and render time are both affected negatively
![Page 21: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/21.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 21
Case Study: Automation in action
![Page 22: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/22.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 22
Methodology
![Page 23: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/23.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 23
Let’s Automate
![Page 24: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/24.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 24
![Page 25: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/25.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 25
A Few Points of Clarification
• We’ll use it to describe where performance pain points are, but that doesn’t mean the page actually has these problems
• What we’re going to do:
Not so good(slow)
Awesome(fast)
Improve performance incrementally
* The real Velocity site is somewhere in the middle!
![Page 26: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/26.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 26
Performance Summary
http://bit.ly/au01VY /
![Page 27: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/27.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 27
WaterfallFirst View Repeat View
![Page 28: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/28.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 28
Per Object
![Page 29: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/29.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 29
Content Analysis by Type
![Page 30: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/30.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 30
Content Analysis by Domain
![Page 31: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/31.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 31
Show Me Where It HurtsProblem Analysis
![Page 32: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/32.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 32
Performance Problems
• Too many connections (too much orange)
![Page 33: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/33.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 33
Too Many Connections
97 Connections(almost one per request)
![Page 34: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/34.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 34
Too Many Connections
![Page 35: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/35.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 35
Performance Problems
• Too many connections (too much orange)• Too many bytes (too much blue)
![Page 36: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/36.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 36
Too Many Bytes
By Type By Domain
![Page 37: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/37.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 37
Performance Problems
• Too many connections (too much orange)• Too many bytes (too much blue)• Concurrency
![Page 38: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/38.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 38
Concurrency
• Browsers can only open and use so many connections at once
• www.browserscope.org
![Page 39: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/39.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 39
Performance Problems
• Too many connections (too much orange)• Too many bytes (too much blue)• Concurrency• Bad Caching for repeat views
![Page 40: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/40.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 40
Bad Repeat View
Full Fetches
Validation
![Page 41: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/41.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 41
Bad Repeat ViewConnections Bytes
![Page 42: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/42.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 42
Performance Problems
• Too many connections (too much orange)• Too many bytes (too much blue)• Concurrency• Bad Caching for repeat views• No CDN (the greens are too big)
![Page 43: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/43.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 43
The Green Problem #1: No CDNTTFB
![Page 44: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/44.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 44
Performance Problems
• Too many connections (too much orange)• Too many bytes (too much blue)• Concurrency• Bad Caching for repeat views• No CDN (the greens are too big)• Too Many Roundtrips (too many greens)
![Page 45: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/45.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 45
The Green Problem #2: Roundtrips
First View Repeat View
80 Requests
27 Requests
78 Requests
14 Requests
![Page 46: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/46.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 46
The Green Problem #2: Roundtrips
• Every fetch still pays the HTTP overhead penalty TTFB is still a problem
• Exacerbated by concurrency issues• Getting worse as number of objects per page grows• Generally, the hardest problem to solve
![Page 47: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/47.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 47
Performance Problems
• Too many connections• Too many bytes (too much blue)• Concurrency• Bad Caching for repeat views• No CDN (the greens are too big)• Too Many Roundtrips (too many greens)• Others
![Page 48: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/48.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 48
Examples of Other Problems
• Blocking Javascript
• 3rd party calls (http://stevesouders.com/p3pc/)
![Page 49: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/49.jpg)
What it looks like
http://bit.ly/velocity-original
![Page 50: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/50.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 50
Summary
![Page 51: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/51.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 51
Let’s Fix It!!
![Page 52: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/52.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 52
Set-Up
![Page 53: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/53.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 53
Testing Environment
SERVICE (CLOUD)WebPageTest Client(East Coast)
O’Reilly Datacenter (West Coast)
![Page 54: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/54.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 54
Acceleration Methodology
![Page 55: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/55.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 55
Stepwise Acceleration
• Start from the beginning and fix the easy stuff
• Step by step acceleration of the page– Apply techniques/methods/etc and see the result– Try to make it as fast as possible
![Page 56: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/56.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 56
Step 1: Low Hanging Fruit
![Page 57: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/57.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 57
Keep-Alive
• Solves the too-many connection problem (Less Orange!)
• Will help alleviate the TCP connection setup overhead
97 Connections
![Page 58: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/58.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 58
Compression
• Addresses the too-many-bytes problem (Less Blue!)• We’ll compress textual content (html/css/etc)• Not the only solution to less blue, but the easiest
![Page 59: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/59.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 59
WebPageTest
http://bit.ly/cKkjGz
![Page 60: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/60.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 60
Before and After
~17.8sec ~10.5sec
![Page 61: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/61.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 61
What We Helped: Keep-Alive
97 Connections 19 Connections
![Page 62: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/62.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 62
What We Helped: Compression
![Page 63: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/63.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 63
How Did We Do?
Original
KA+Comp
First View
Repeat View
52%
71%
34%
94%
31%
51%
23%
75%
40%
62%
Improvement
![Page 64: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/64.jpg)
What it looks like
http://bit.ly/velocity-keep-alives
![Page 65: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/65.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 65
Pros and Cons
• Pros– Really easy to do– Single configuration switches in servers, proxies,
or load balancers– Good benefit seen right away
• Cons– Compression has processing overhead– On their own they’re just not enough
![Page 66: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/66.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 66
Step 2: Repeat View Problem
![Page 67: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/67.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 67
Poor Client Side Caching
Original
KA+Comp
![Page 68: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/68.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 68
Problem Still Exists
~6.2sec
![Page 69: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/69.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 69
How Do We Get Better Caching
• RFC 2616, Section 13• Caching headers should be used on static (non-
changing) objects, so they can be cached browser-side – And by intermediate caching proxies
• Validators are not enough
![Page 70: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/70.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 70
WebPageTest
http://bit.ly/aCP3iX
![Page 71: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/71.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 71
Before and After
~6.2sec
~2.0sec
![Page 72: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/72.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 72
How Did We Do?
KA+Comp
With Good Caching
Repeat View 70% 42%67%
Improvement
![Page 73: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/73.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 73
Pros and Cons
• Pros– Good caching can have a major performance
impact on repeat visits to a page– Sometimes it’s easy to do– Browsers generally pay attention (although
interpretation may vary slightly)• Cons
– The spec appears scary– Invalidation and stale content
![Page 74: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/74.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 74
Step 3: CDN
![Page 75: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/75.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 75
What Does a CDN do?
• Global network of proxy caches
• Get cacheable content close to users
• Reduce TTFB (smaller greens)
![Page 76: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/76.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 76
TTFB Problem
![Page 77: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/77.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 77
WebPageTest
http://bit.ly/a9ZJcF
![Page 78: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/78.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 78
Before and After
~10.5sec ~8.3sec
![Page 79: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/79.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 79
TTFB Savings
Per object TTFB savings of ~50%
![Page 80: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/80.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 80
How Did We Do?
KA+Comp
+CDN
First View 21% 17%22%
Improvement
0.7 sec 2.3 sec 2.7 secSeconds Gained
![Page 82: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/82.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 82
Pros and Cons
• Pro– Good mitigation of the TTFB problem– Established industry: lots of vendors to choose
from• Cons
– Sometimes costly– May require code change (CDN’ed objects should
be written to the CDN domain)
![Page 83: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/83.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 83
Step 4: Steroids - the Hard Stuff
![Page 84: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/84.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 84
We Can Get Better!
Still too many roundtrips
Still too many bytes
Not Fast Enough!!
![Page 85: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/85.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 85
What to do Next?
• Reduce Roundtrips– Combine images– Combine JavaScript– Combine CSS
• Reduce Payload even more– Minify CSS and JavaScript– Add Image Compression
• Increase Concurrency– Add a couple of domains to the mix
![Page 86: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/86.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 86
WebPageTest
http://bit.ly/bbT3v4
![Page 87: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/87.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 87
Before and After
~8.3sec
~3.8sec
![Page 88: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/88.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 88
How Did We Do?
+CDN
+Strangeloop
First View 19% 30%54%
Improvement
0.5 sec 4.6 sec 4.1 sec
45% 31%
Seconds Gained
81 107
11 37
![Page 89: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/89.jpg)
What it looks like
http://bit.ly/velocity-awesomest
![Page 90: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/90.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 90
Pros and Cons
• Pros– Most significant benefit for the hardest part of the
acceleration lifecycle– Address multiple performance points (somtimes
multiple ones with the same technique)• Cons
– It’s not easy– Regression
![Page 91: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/91.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 91
Other performance opportunities
![Page 92: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/92.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 92
3rd Party content & Javascript
![Page 93: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/93.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 93
Additional TCP based optimizations*
*Image credit: FastSoft [http://www.fastsoft.com/how-it-works/]
![Page 94: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/94.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 94
DNS based optimizations
![Page 95: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/95.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 95
Different Browsers
Chrome 4
Chrome 5
FireFox 2
FireFox 3 IE 6 IE 7 IE 8Safari 4
Series10
0.51
1.52
2.53
3.54
Performance differences across browsers
Safari
Mobile
![Page 96: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/96.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 96
Flow
3.8 Seconds11 Roundtrips
Conversion
? ? ?
![Page 97: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/97.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 97
Performance automation market
![Page 98: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/98.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 98
1993 20021999 20062000 200719961995 1998 20042003 20092008 2010
![Page 99: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/99.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 99
“I will deliver what the server gives me as efficiently as possible to the browser.”
“I will transform what the server gives me to optimize it for the user’s browser”
History of performance automation
Delivery
Transformation
![Page 100: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/100.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 100
Original Delivery Transformation
9.5 seconds63 roundtrips
5.7 seconds63 roundtrips
2.1 seconds9 roundtrips
Delivery vs Transformation
![Page 101: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/101.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 101
Delivery market
Delivery
Load Balancers (scale and availability)
CDN (scale, availability and performance)
Other
TCP (Fastsoft)
WAN Optimization (Riverbed)
DNS (Neustar)
![Page 102: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/102.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 102
Delivery market
Delivery
Load Balancers• Compression Smaller blues on HTML and resources• TCP Optimization & Multiplexing Smaller greens on HTML and some resources• Caching Smaller greens on HTML and resources• SSL Offload Higher scale and potentially smaller greens on HTML and smaller
blues
CDN- Static and Dynamic• Static object delivery smaller greens on resources• ESI smaller greens on HTML• DNS smaller teal • Compression Smaller blues on HTML • TCP Optimizations smaller greens and blues on HTML and some resources• Routing Optimization smaller blues on HTML and some resources
![Page 103: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/103.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 103
Players delivery marketDelivery
Load Balancers
Basic
Kemp
Barracuda
Coyote Point
Advanced
F5
Citrix
Radware
Zeus
Cisco
CDN
Small object delivery
Akamai
Limelight
Level 3
AT&T
Edgecast
Dynamic
Akamai
CDNetworks
Contendo
![Page 104: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/104.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 104
Transformation market
Transformation
Server side
Network
Cloud
![Page 105: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/105.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 105
Transformation market
![Page 106: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/106.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 106
Transformation market
Transformation
Server
Platform agnostic
Strangeloop (Virtual)
Platform specific
Aptimize
Webo
Network
Basic
F5 Web Acc
Cisco ACE4710 (fineground)
Advanced
Strangeloop
Acceloweb
Cloud
Basic
Akamai
Advanced
Strangeloop
![Page 107: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/107.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 107
Performance automation challenges
![Page 108: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/108.jpg)
- Javascript- Ajax- Flash- Mobile- Third Party Content- Browsers- Bad code- no standardization- Measurment- How and What
Challenges
![Page 109: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/109.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 109
Opportunity
![Page 110: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/110.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 110
“Speed is the next competitive advantage.” - Steve Souders, Google
![Page 111: Web Performance Automation - NY Web Performance Meetup](https://reader035.vdocuments.site/reader035/viewer/2022062513/554d2881b4c905ca208b50a3/html5/thumbnails/111.jpg)
© 2010 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 111
Q&A