Hands on performance testing and analysis with web pagetest
-
Upload
patrick-meenan -
Category
Technology
-
view
3.880 -
download
2
description
Transcript of Hands on performance testing and analysis with web pagetest
![Page 1: Hands on performance testing and analysis with web pagetest](https://reader035.fdocuments.in/reader035/viewer/2022062404/54b7b9ab4a7959c9688b4790/html5/thumbnails/1.jpg)
Hands-on Performance Testing and Analysis with WebPagetest
Patrick [email protected]
Twitter: @patmeenan
![Page 2: Hands on performance testing and analysis with web pagetest](https://reader035.fdocuments.in/reader035/viewer/2022062404/54b7b9ab4a7959c9688b4790/html5/thumbnails/2.jpg)
BRIEF OVERVIEW
![Page 3: Hands on performance testing and analysis with web pagetest](https://reader035.fdocuments.in/reader035/viewer/2022062404/54b7b9ab4a7959c9688b4790/html5/thumbnails/3.jpg)
How to get to it
www.webpagetest.org
![Page 4: Hands on performance testing and analysis with web pagetest](https://reader035.fdocuments.in/reader035/viewer/2022062404/54b7b9ab4a7959c9688b4790/html5/thumbnails/4.jpg)
What does it do?
• Tests performance of web pages*• From multiple physical locations in the world• With realistic and configurable end-user connectivity• Low barrier to entry• Provides lots of ways to consume the results• Targeted at developers of all skill levels
o Or site owners who need to go beat on their developers
* Richer applications can also be tested
![Page 5: Hands on performance testing and analysis with web pagetest](https://reader035.fdocuments.in/reader035/viewer/2022062404/54b7b9ab4a7959c9688b4790/html5/thumbnails/5.jpg)
From Where?
![Page 6: Hands on performance testing and analysis with web pagetest](https://reader035.fdocuments.in/reader035/viewer/2022062404/54b7b9ab4a7959c9688b4790/html5/thumbnails/6.jpg)
LET’S GET TESTING
![Page 7: Hands on performance testing and analysis with web pagetest](https://reader035.fdocuments.in/reader035/viewer/2022062404/54b7b9ab4a7959c9688b4790/html5/thumbnails/7.jpg)
Basic Testing• Enter URL• Pick Location and Browser• Get results
Key Optimizations
Page Speed Score
Download Raw Data
Basic Stats (times, bytes,
requests)
Screen Shots
Waterfall
![Page 8: Hands on performance testing and analysis with web pagetest](https://reader035.fdocuments.in/reader035/viewer/2022062404/54b7b9ab4a7959c9688b4790/html5/thumbnails/8.jpg)
The “subjects”
• cnn.com – 16.1 seconds• gasteroprod.com – 3.4 seconds• lonelyplanet.com – 11.3 seconds• news.com – 7.9 seconds
![Page 9: Hands on performance testing and analysis with web pagetest](https://reader035.fdocuments.in/reader035/viewer/2022062404/54b7b9ab4a7959c9688b4790/html5/thumbnails/9.jpg)
Video Capture
• Enables video capture for individual tests
• Allows you to capture video (for later comparison or viewing) with arbitrary test configurations
![Page 10: Hands on performance testing and analysis with web pagetest](https://reader035.fdocuments.in/reader035/viewer/2022062404/54b7b9ab4a7959c9688b4790/html5/thumbnails/10.jpg)
Content Blocking
• Block arbitrary content from loading (substring match on URI)
• Makes it easy to do what-if testing on production pageso How does the page load without ads?o How does the page load without the facebook widget?o How does the page load without any of the javascript?
![Page 11: Hands on performance testing and analysis with web pagetest](https://reader035.fdocuments.in/reader035/viewer/2022062404/54b7b9ab4a7959c9688b4790/html5/thumbnails/11.jpg)
cnn.com
• Blocking JavascriptBlock String: “.js”
• Load Time improved from 16.1s to 5.0s• Start Render went from 6.4s to 1.4s• Visual Comparison:
http://www.webpagetest.org/video/compare.php?tests=110110_EM_88ZA-l:cnn.com,110110_FQ_88ZR-l:No+JS
• Video: http://www.webpagetest.org/video/view.php?id=110110_7e5077007b839b84fe42264039baaffdc5ba3ba9
![Page 12: Hands on performance testing and analysis with web pagetest](https://reader035.fdocuments.in/reader035/viewer/2022062404/54b7b9ab4a7959c9688b4790/html5/thumbnails/12.jpg)
gasteroprod.com
• Blocking font download and javascriptBlock String: “.eot .js”
• Load Time improved from 3.4s to 2.7s• Start Render went from 2.1s to 1.3s• Visual Comparison:
http://www.webpagetest.org/video/compare.php?tests=110113_AD_8PD5-l:gasteroprod.com,110113_3W_8PH2-l:No+Javascript/Font
• Video:http://www.webpagetest.org/video/view.php?id=110113_bde569bd9502592f9cba0a0313a8fe379faa2226
![Page 13: Hands on performance testing and analysis with web pagetest](https://reader035.fdocuments.in/reader035/viewer/2022062404/54b7b9ab4a7959c9688b4790/html5/thumbnails/13.jpg)
lonelyplanet.com
• Visual Comparison:http://www.webpagetest.org/video/compare.php?tests=110113_AR_8PDM-l:lonelyplanet.com,110113_GM_8PGR-l:No+redirect/auth,110113_AS_8PT5-l:No+redirect/auth/js,110113_7Z_8PYB-l:No+redirect/auth/js/ads
• Video:http://www.webpagetest.org/video/view.php?id=110113_4dee5a36f3c9470e86f1361f95a4a591db712631
Start Render Load Time
Lonelyplanet.com 3.6s 11.4s
Block redirect/auth check
1.9s 8.1s
Block redirect/auth/js 1.2s 6.0s
Block redirect/auth/js/ads
1.1s 4.9s
![Page 14: Hands on performance testing and analysis with web pagetest](https://reader035.fdocuments.in/reader035/viewer/2022062404/54b7b9ab4a7959c9688b4790/html5/thumbnails/14.jpg)
news.com
• Blocking JavascriptBlock String: “.js”
• Load Time improved from 8.0s to 4.7s• Start Render went from 2.2s to 1.3s• Visual Comparison:
http://www.webpagetest.org/video/compare.php?tests=110112_D9_8H4K-l:news.com,110112_K4_8H58-l:No+Javascript
• Video:http://www.webpagetest.org/video/view.php?id=110112_15bbe70cbeb6d269db37d8089e1f1d0d41ba2893
![Page 15: Hands on performance testing and analysis with web pagetest](https://reader035.fdocuments.in/reader035/viewer/2022062404/54b7b9ab4a7959c9688b4790/html5/thumbnails/15.jpg)
Scripting
Automating Rich Applications
• Authenticating into form-protected applications• Interacting with Web Apps (Mail, Calendar, etc)• Testing a navigation flow from one page to another• Execute arbitrary Javascript
REALLY Advanced Options
• Re-writing DNS lookups (directing traffic to a test/staging box)• Overriding DNS server• Custom User-Agent strings• Pre-populating cookies• Wait for Javascript indicator
![Page 16: Hands on performance testing and analysis with web pagetest](https://reader035.fdocuments.in/reader035/viewer/2022062404/54b7b9ab4a7959c9688b4790/html5/thumbnails/16.jpg)
Amazon Product Search
• Go to amazon.com• Search for a product• Open the product page
combineStepsnavigate www.amazon.com/navigate www.amazon.com/s/ref=nb_sb_noss?url=search-alias%3Daps&field-keywords=even+faster+websites&x=21&y=28navigate www.amazon.com/Even-Faster-Web-Sites-Performance/dp/0596522304/ref=sr_1_1?ie=UTF8&s=books&qid=1295412495&sr=8-1
• http://www.webpagetest.org/result/110119_3Z_ECM/• Filmstrip:
http://www.webpagetest.org/video/compare.php?tests=110119_3Z_ECM
• Video:http://www.webpagetest.org/video/view.php?id=110119_3Z_ECM.3.0
![Page 17: Hands on performance testing and analysis with web pagetest](https://reader035.fdocuments.in/reader035/viewer/2022062404/54b7b9ab4a7959c9688b4790/html5/thumbnails/17.jpg)
Javascript Profiling
• Integration with Dynatrace Ajax Edition
• Special “Dynatrace” locations in Dulles for IE7 and IE8
• AOL Autos: http://www.webpagetest.org/result/110112_MV_8J1R/
![Page 18: Hands on performance testing and analysis with web pagetest](https://reader035.fdocuments.in/reader035/viewer/2022062404/54b7b9ab4a7959c9688b4790/html5/thumbnails/18.jpg)
Advanced Settings - Bulk Testing
• Only available on private instances
• Allows for uploading of multiple URLs and running the tests against all of themo Configured settings will be used for all of the URLs (runs, blocking, etc)
• Results UI currently limited (links to individual test results)o enhancements coming soon (download results of all tests)
![Page 19: Hands on performance testing and analysis with web pagetest](https://reader035.fdocuments.in/reader035/viewer/2022062404/54b7b9ab4a7959c9688b4790/html5/thumbnails/19.jpg)
HTTP APIREST Interface for automating WebPagetest• http://www.webperformancecentral.com/wiki/WebPagetest/Automating_Pagetest• XML and JSON support (JSONP partially implemented)• Anything you do in the UI can be automated through the API• Tests submitted through the API will run at a lower priority than
manually entered test• API Keys required for the public instance
Use Cases• One-off bulk testing• Recurring testing (WPTMon/Private Instances)
![Page 20: Hands on performance testing and analysis with web pagetest](https://reader035.fdocuments.in/reader035/viewer/2022062404/54b7b9ab4a7959c9688b4790/html5/thumbnails/20.jpg)
Coming Soon(ish)
• Chrome• Firefox• Android• Above-the-fold measurement• Diagnostics (tcpdump/traceroute)• Internationalized UI