WebPagetest - Good, Bad & Ugly
•
4 likes•6,880 views
Presentation by @aaronpeters at Dutch Web Performance Meetup on August 22 2012. The presentation covers new stuff in WPT UI, the WPT API, scripting and hidden gems. Awesome tool, but also room for improvement.
Recommended
More Related Content
What's hot
What's hot (20)
Viewers also liked
Viewers also liked (20)
Similar to WebPagetest - Good, Bad & Ugly
Similar to WebPagetest - Good, Bad & Ugly (20)
Recently uploaded
Recently uploaded (20)
WebPagetest - Good, Bad & Ugly
- 1. Paget e s t: W eWebPagetest APIly Using the b he Ug he Ba d&T The Good, T
- 2. 1 First … some basic tips
- 3. Understand the test environment Windows version? DNS resolver? Hardware specs (RAM, processor)?
- 4. Run a large number of tests
- 5. Collect RUM data too !
- 6. Summary statistics hide insight Mean: ~1400 ms Median: ~1100 ms
- 7. Look at individual tests Normal Ouch!
- 8. 2 New stuff in the WPT ui
- 9. Homepage > Advanced tab
- 10. Capture Network Log (Chrome) Returns big TXT file with JSON … then what? Pat: “You probably don't want to use the network log - it was added for the Chrome team themselves to debug the browser :-)”
- 11. Minimum test duration It works, kindof ... Example (minTestDur=45)
- 12. 3 WPT API introduction
- 13. Getting started Get an API key from Pat (required) Know your requests will have low prio /getLocations.php Basic process: 1. Submit request via POST or GET 2. Poll for the test status (or use pingback) 3. Fetch test results 4. Fetch objects (charts, screen shots, ...)
- 14. Submitting requests Send a POST or GET to http://www.webpagetest.org/runtest.php url is only required parameter Defaults: Dulles DSL, 1 run, first & repeat view, public, no video Overview of parameters
- 15. Results Example XML It has it all, incl. 1. PageSpeed version & results 2. Page <title> 3. Links to pages/files for everything in UI 4. Video frame URLs & Speed Index score !
- 16. Documentation Official API documentation Python lib for ad-hoc batch processing Batch processing command line tool
- 17. 4 Scripting
- 18. Lots of possibilities! https://sites.google.com/a/webpagetest.org/docs/using-webpagetest/scripting Navigation/DOM interaction (submitForm) End Conditions (setDOMelement) Request Manipulation (setDNS) Misc (combineSteps) Great for simulating user-page interaction, multi-page testing and different 'conditions'
- 19. Example scripts logData 0 navigate http://www.gamesgames.com/ logData 1 navigate http://www.gamesgames.com/search.html? search=bloons+4 SetDNSName cdn.domain.com www.domain.com overrideHost cdn.domain.com www.domain.com navigate www.domain.com
- 20. Commands you'll likely use Command Description navigate Navigate to next page, wait for it to complete logData Set to 0 to not record anything; 1 = record! setValue Sets the value attribute of the given DOM element to the provided value. submitForm Triggers a submit event for the identified form. setDOMElement Sets the attribute of a DOM element that is required for the next event to complete successfully. block Blocks individual requests from loading combineSteps Causes multiple script steps to be combined into a single "step" in the results setViewportSize Changes size of visible browser window firefoxPref Allows you to specify arbitrary preferences that will be configured before launching the browser. Eg. firefoxPref network.http.pipelining false setDNS Allows for overriding the IP address for a host name.
- 21. Why did the test fail? Can be very hard to troubleshoot, esp. on large scripts
- 22. 5 WPT – hidden gems
- 23. ¬ify=theboss@whitehouse.org e-mail address to notify with the test results
- 24. &iq=90 Specify a jpeg compression level (30-10095) for the screen shots and video capture iq=default iq=90 Video!
- 25. &pngss=1 Set to 1 to save a full-resolution version of the fully loaded screen shot as a png Normal JPG Big PNG24
- 26. &f=json Format. Set to "xml" to request an XML response instead of a redirect ("json" is also provisionally supported)
- 27. &plr=50 Packet loss rate - percent of packets to drop (used when specifying a custom connectivity profile) plr=0 plr=50 No diff ! Location specific issue?
- 28. console.log() output Can be found on the screen shots page ... Example
- 29. Time to Title Not in UI, but ís in results from API: <titleTime> Can also be found in “Raw Page data” CSV Example
- 30. 6 Closing remarks
- 31. WPT can act … surprising
- 32. The documentation may not help out
- 33. It may drive you mad
- 34. Don't give up easily
- 35. Put some effort in!
- 36. Be the Success Kid!