the web performance testing toolbox (jfokus 2013)
DESCRIPTION
Slides from my Jfokus 2013 presentation. (Demos not included.) So, your web application is slow. You read all the books, follow all advices, but users are still complaining. What now? It turns out that there are really good tools out there to help you, whether your problem is slow loading third party widgets, badly performing javascript or heavy paint times for DOM elements. But which one is right for you? This hands on session will give guide help you assemble your own toolbox with the the different (mostly free) tools available for analyzing and troubleshooting web performance. You'll learn what you can expect from high level tools that measure page load time through synthetic or real user monitoring, down to low level javascript profiling and graphic rendering. We'll dive straight into the advanced parts of WebPagetest, Chrome Dev Tools, Dynatrace Ajax Edition and others, and you'll also get to know how to do most of this on actual mobile devices.TRANSCRIPT
THE WEB PERFORMANCETESTING TOOLBOX
T!b"#$ Jär%&'(@)#r%&'(
YSLOW PAGESPEED
LOADING#'(
RENDERING
*#"'+#"'"', #
RESPONSIVEUI
LOADING AND RENDERING
+-. r.+&r' !f +-.WATERFALL (.v.%!/*.'+ /r!0.$$
DNS
CONNECTION
FIRST BYTE
DOWNLOAD
Av!"(
STAIRS
M"'( +-.
GAP
setViewportSize 320 480navigate http://www.jfokus.se/
setDOMElement id=fb-‐rootnavigate http://www.jfokus.se/
block facebook twitternavigate http://www.jfokus.se/
RESTFUL API!
/runtest.php?f=xml&location=Stockholm&url=http://www.jfokus.se/&k=mykey
...w"+- # '!(..)$ *!(&%.
SHOWSLOW.COM GTMETRICS.COM
R.#% &$.rMONITORING
NAVIGATION TIMING API
S&//!r+.( .v.r1w-.r. 20./+ S#f#r" #'( O/.r#
GOOGLE ANALYTICS
AVERAGESv$
PERCENTILES
DO IT YOURSELFB!!*.r#',https://github.com/lognormal/boomerang/
THE CRITICAL PATHP#,.$/..( !'%"'.
Single Point Of Failure
fr!'+.'(
SPOF
SPOF-O-MATIC
SPOF-O-MATIC
SPOF-O-MATIC
SPOF-O-MATIC
MAINTAIN ARESPONSIVE UI
D1'#+r#0.
AJAX.("+"!'
C-r!*.
DEVTOOLS
T.$+ !' #0+&#%
MOBILE(.v"0.$
WEBPAGETEST*!b"+.$+.#3#*#".0!*
IOS 6'.+w!r3 %"'3 0!'("+"!'.r
...b&+ 1!& '..( +! $.+&/ 1!&r (.v"0. f!r (.v.%!/*.'+ "' X0!(.
REMOTE DEBUGGING
DEBUGGINGC-r!*. !' A'(r!"(
https://developers.google.com/chrome-developer-tools/docs/remote-debugging
DEBUGGINGS#f#r" !' IOS 6
http://developer.apple.com/library/ios/documentation/AppleApplications/Reference/SafariWebContent/DebuggingSafarioniPhoneContent/DebuggingSafarioniPhoneContent.html
LOADING/RENDERINGYSLOW / PAGESPEEDWEBPAGETEST.ORGSPOF-O-MATICGOOGLE ANALYTICS/NEW RELIC/TORBIT/PINGDOM/GOMEZ/LOGNORMALBOOMERANGPAGESPEED ONLINE: THE CRITICAL PATHGTMETRICS.COM/SHOWSLOW.COM
MAINTAIN A RESPONSIVE UIDYNATRACE AJAX EDITIONCHROME DEVELOPER TOOLS
MOBILEWEBPAGETEST.ORG/MOBITEST.AKAMAI.COMCHROME (ANDROID)SAFARI (IOS)
T!b"#$ Jär%&'(@)#r%&'(
http://bloggar.aftonbladet.se/utvecklingsbloggen/