0
Paget e s t:       W eWebPagetest APIlyUsing the b              he Ug           he Ba d&TThe Good, T
1   First … some basic tips
Understand the test environmentWindows version? DNS resolver?Hardware specs (RAM, processor)?
Run a large number of tests
Collect RUM data too !
Summary statistics hide insight            Mean: ~1400 ms            Median: ~1100 ms
Look at individual tests                           Normal                           Ouch!
2   New stuff in the WPT ui
Homepage > Advanced tab
Capture Network Log (Chrome)Returns big TXT file with JSON … then what?Pat: “You probably dont want to use thenetwork log ...
Minimum test durationIt works, kindof ...                       Example (minTestDur=45)
3   WPT API introduction
Getting startedGet an API key from Pat (required)Know your requests will have low prio     /getLocations.phpBasic process:...
Submitting requestsSend a POST or GET tohttp://www.webpagetest.org/runtest.phpurl is only required parameterDefaults: Dull...
ResultsExample XMLIt has it all, incl.1. PageSpeed version & results2. Page <title>3. Links to pages/files for everything ...
DocumentationOfficial API documentationPython lib for ad-hoc batch processingBatch processing command line tool
4   Scripting
Lots of possibilities!https://sites.google.com/a/webpagetest.org/docs/using-webpagetest/scriptingNavigation/DOM interactio...
Example scriptslogData    0navigate   http://www.gamesgames.com/logData    1navigate   http://www.gamesgames.com/search.ht...
Commands youll likely useCommand           Descriptionnavigate          Navigate to next page, wait for it to completelogD...
Why did the test fail?Can be very hard to troubleshoot, esp. onlarge scripts
5   WPT – hidden gems
&notify=theboss@whitehouse.orge-mail address to notify with the test results
&iq=90Specify a jpeg compression level (30-10095)for the screen shots and video capture                                   ...
&pngss=1Set to 1 to save a full-resolution version ofthe fully loaded screen shot as a png                                ...
&f=jsonFormat. Set to "xml" to request an XMLresponse instead of a redirect ("json" is alsoprovisionally supported)
&plr=50Packet loss rate - percent of packets to drop(used when specifying a custom connectivityprofile)                   ...
console.log() outputCan be found on the screen shots page ...                                      Example
Time to TitleNot in UI, but ís in results from API: <titleTime>Can also be found in “Raw Page data” CSV                   ...
6   Closing remarks
WPT can act … surprising
The documentation may not help out
It may drive you mad
Dont give up easily
Put some effort in!
Be the Success Kid!
WebPagetest - Good, Bad & Ugly
Upcoming SlideShare
Loading in...5
×

WebPagetest - Good, Bad & Ugly

5,271

Published on

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.

Published in: Technology
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
5,271
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
19
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

Transcript of "WebPagetest - Good, Bad & Ugly"

  1. 1. Paget e s t: W eWebPagetest APIlyUsing the b he Ug he Ba d&TThe Good, T
  2. 2. 1 First … some basic tips
  3. 3. Understand the test environmentWindows version? DNS resolver?Hardware specs (RAM, processor)?
  4. 4. Run a large number of tests
  5. 5. Collect RUM data too !
  6. 6. Summary statistics hide insight Mean: ~1400 ms Median: ~1100 ms
  7. 7. Look at individual tests Normal Ouch!
  8. 8. 2 New stuff in the WPT ui
  9. 9. Homepage > Advanced tab
  10. 10. Capture Network Log (Chrome)Returns big TXT file with JSON … then what?Pat: “You probably dont want to use thenetwork log - it was added for the Chrometeam themselves to debug the browser :-)”
  11. 11. Minimum test durationIt works, kindof ... Example (minTestDur=45)
  12. 12. 3 WPT API introduction
  13. 13. Getting startedGet an API key from Pat (required)Know your requests will have low prio /getLocations.phpBasic process:1. Submit request via POST or GET2. Poll for the test status (or use pingback)3. Fetch test results4. Fetch objects (charts, screen shots, ...)
  14. 14. Submitting requestsSend a POST or GET tohttp://www.webpagetest.org/runtest.phpurl is only required parameterDefaults: Dulles DSL, 1 run, first & repeatview, public, no videoOverview of parameters
  15. 15. ResultsExample XMLIt has it all, incl.1. PageSpeed version & results2. Page <title>3. Links to pages/files for everything in UI4. Video frame URLs & Speed Index score !
  16. 16. DocumentationOfficial API documentationPython lib for ad-hoc batch processingBatch processing command line tool
  17. 17. 4 Scripting
  18. 18. Lots of possibilities!https://sites.google.com/a/webpagetest.org/docs/using-webpagetest/scriptingNavigation/DOM interaction (submitForm)End Conditions (setDOMelement)Request Manipulation (setDNS)Misc (combineSteps)Great for simulating user-page interaction,multi-page testing and different conditions
  19. 19. Example scriptslogData 0navigate http://www.gamesgames.com/logData 1navigate http://www.gamesgames.com/search.html? search=bloons+4SetDNSName cdn.domain.com www.domain.comoverrideHost cdn.domain.com www.domain.comnavigate www.domain.com
  20. 20. Commands youll likely useCommand Descriptionnavigate Navigate to next page, wait for it to completelogData 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 loadingcombineSteps Causes multiple script steps to be combined into a single "step" in the resultssetViewportSize Changes size of visible browser windowfirefoxPref Allows you to specify arbitrary preferences that will be configured before launching the browser. Eg. firefoxPref network.http.pipelining falsesetDNS Allows for overriding the IP address for a host name.
  21. 21. Why did the test fail?Can be very hard to troubleshoot, esp. onlarge scripts
  22. 22. 5 WPT – hidden gems
  23. 23. &notify=theboss@whitehouse.orge-mail address to notify with the test results
  24. 24. &iq=90Specify a jpeg compression level (30-10095)for the screen shots and video capture iq=default iq=90 Video!
  25. 25. &pngss=1Set to 1 to save a full-resolution version ofthe fully loaded screen shot as a png Normal JPG Big PNG24
  26. 26. &f=jsonFormat. Set to "xml" to request an XMLresponse instead of a redirect ("json" is alsoprovisionally supported)
  27. 27. &plr=50Packet loss rate - percent of packets to drop(used when specifying a custom connectivityprofile) plr=0 plr=50 No diff ! Location specific issue?
  28. 28. console.log() outputCan be found on the screen shots page ... Example
  29. 29. Time to TitleNot in UI, but ís in results from API: <titleTime>Can also be found in “Raw Page data” CSV Example
  30. 30. 6 Closing remarks
  31. 31. WPT can act … surprising
  32. 32. The documentation may not help out
  33. 33. It may drive you mad
  34. 34. Dont give up easily
  35. 35. Put some effort in!
  36. 36. Be the Success Kid!
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×