Date post: | 27-Jan-2015 |
Category: |
Technology |
Upload: | marcel-duran |
View: | 104 times |
Download: | 0 times |
@marcelduran
Performance as a Feature
tri afudê tchê
about me
web-perf
features
losing features
omg!
losing performance
before after
what does performance mean?
how to lose performance
new feature
bugfix
omg!
new release
typicaldev cycle
build
users
deploy
test
monitor
reactive
rum
new release
continuous integration
continuous integration
acceptanceregression
smokeintegrationunit
ninjachuck norris
continuous integration
branches * (new features + bugfixes)
looking for performance regression
previous
diff
new
yslow.org
har
{ "log": { "version": "1.1", "pages": [ { "startedDateTime": "2012-08-16T18:27:29.000+00:00", "id": "page_1_0", "pageTimings": { "onLoad": 13701, . . .
generating har
$ npm install yslow -g
+ +
yslow + phantomjs
$ phantomjs yslow.js http://yslow.org
new test output formats
-f, --format <format>
( json | xml | plain | tap | junit )
test specs
-t, --threshold <score>( [0-100] | [A-F] | {json} )
default: 80
test specs examples
-t B-t 75-t '{"overall": "C", "ycdn": "F"}'-t '{"ycdn": "F", "yexpires": 75}'
browser impersonation
-u, --ua "<user agent>"
e.g: -u "Mozilla/5.0 (iPhone; ...)"
-vp, --viewport <WxH>
e.g: -vp 320x480
authentication
-ch, --headers <JSON>
e.g: -ch '{"Cookie": "auth_token=foo"}'
exempli gratia
$ phantomjs yslow.js http://twitter.com--info grade --format tap
-t '{"overall": "B", "ycdn": "F"}'-ch '{"Cookie": "auth_token=foo"}'
jenkins
+wpo build test
deploymonitor users
wpo
proactive
high performance
A A A A ...
what's your metric?
page load
domReady
TTFBstart render
TTF
speed indexAFTfoobar
TTFT
TTFT
RESTful API
XML
JSON
marcelduran.com/webpagetest-api
webpagetest-api wrapper overview
http://webpagetest.org/testStatus.php?test=121119_DJ_J0R
var WebPageTest = require('webpagetest'), wpt = new WebPageTest();
wpt.getTestStatus('121119_DJ_J0R', function(err, data) { console.log(err || data);});
$ webpagetest status 121119_DJ_J0R
http://webpagetest.aws.af.cm/status/121119_DJ_J0R
commands
statusresultslocationstesterstestcancelharpagespeed
utilizationrequesttimelinenetlogconsoletestinfowaterfallscreenshot
options
serveraftbodiesfirstfullignoresslkeepuanetlognoadsnoheaders
noimagesnooptnoscriptonloadprivatesensitivestandardstimelinevideoauth
typeblockbwdowntcpdumpbwupconnectionsconnectivitydomdurationjpegkey
labellatencylocationloginnotifypasswordpingbackplrrequestrunsspof
webpagetest architecture
location alpha
WPT server
age 1nt
age 2nt
age 3nt
location beta
age 1nt
age 2nt
age 3nt
any work for me? (polling)
test done! your results (post)
test foo.com
test
bar
.com
any work for me? (polling)
test done! your results (post)
via user
via api
testing then polling results
$ webpagetest test twitter.com
{ ..., "testId": "121119_DJ_J0R", ... }
$ webpagetest results 121119_DJ_J0R
{ ..., "statusText": "Test Started", ... }
$ webpagetest results 121119_DJ_J0R
{ ..., "loadTime": 1810, ... }
polling workflow
some location
WPT server
age 1nt
age 2nt
age 3nt
some server
test foo.com
1te
st ID
=123
2 any work for me?yes foo.com
4
test foo.com5
test 123 done!results (post)
6
give me details of test 123
7
test
123
don
e?
3
pingback workflow
some location
WPT server
age 1nt
age 2nt
age 3nt
some server
test foo.com
1te
st ID
=123
2 any work for me?yes foo.com
3
test foo.com4
test 123 done!results (post)
5
test
123
don
e!
6
give me details of test 123
7
sync test
$ webpagetest test twitter.com --poll
{ ..., "loadTime": 1810, ... }
{ ..., "loadTime": 1810, ... }
$ webpagetest test twitter.com --wait
performance test specs
{ "response": { ... "data": { ... "median": { "firstView": { ... "requests": 15 "render": 500, "loadTime": 2500, "score_gzip": 70 ... } } } ... }}
wpt results
{ "median": { "firstView": { "requests": 20 "render": 400, "loadTime": 3000, "score_gzip": { "min": 90 } } }}
specs
testspecs.json
performance test specs
$ webpagetest test example.com --poll --spec testspecs.json
WebPageTest ✓ median.firstView.requests: 15 should be less than 20 1) median.firstView.render: 500 should be less than 400 ✓ median.firstView.loadTime: 2500 should be less than 3000 2) median.firstView.score_gzip: 70 should be greater than 90
2 passing (3 ms) 2 failing
2
$ echo $?
wpt perf test specspowered by
performance test reporters
dot (default)
spec
tap
xunit
list
progress
min
nyan
landing
json
doc
markdown
teamcity
continuous integration+ performance
bit.ly/wpt-jenkins bit.ly/wpt-travis bit.ly/wpt-drone
bit.ly/wpt-ci
continuous performance measurement
pre prod
branches: foo + bar + baz
foo
bar
baz
continuous performance measurement
build test
deploy
monitor
wpo
perf
users
proactive
+perf
webpagetest
fim
image creditsChimarrão: terramate.com.brSpeed gauge: WebIconSet.comYahoo logo: YOOtheme.comFlower: linux.softpedia.com/developer/Oliver-Scholtz-93.htmlBandaid: nahas-pro.deviantart.comGuinea pig: en.academic.ru/dic.nsf/enwiki/2191230Needle: business2community.com/social-media/4-tips-for-converting-social-media-leads-0144554Ninja: Iconka.comSad Face: memegenerator.netFork: fortawesome.github.io/Font-AwesomeOthers: iconfinder.com