Sitespeed.io

A brief introduction to Sitespeed.io for "Modern Web tools with Node.js" course.

http://paazmaya.gitbooks.io/modern-web-tools-with-node-js/

Links in the slides:
- http://users.metropolia.fi/~jarkkot/sitespeed.io/naginata-sitespeed-v2.5.7/
- http://users.metropolia.fi/~jarkkot/sitespeed.io/naginata-sitespeed-v3.0.0-beta/

- http://www.sitespeed.io/
- http://www.sitespeed.io/documentation/#theoptions
- http://www.sitespeed.io/rules/#allrules

- https://github.com/sitespeedio/sitespeed.io

Transcript

1. Sitespeed.io   Brief  introduc1on  to   11/04/2014  -­‐  Jarkko  Tuunanen  
2. Sitespeed.io   •  Command-­‐line  tool  for  analyzing  website   speed  and  performance   •  Built  on  top  of  YSlow,  PhantomJS,   BrowserTime,  and  Bootstrap   •  Open  source   •  Created  by  Peter  Hedenskog  in  2012   •  Available  for  Mac,  Linux,  and  Windows   – Stable  v2.5.7   – Beta  v3.0.0  released,  stable  around  the  corner  
3. Main  features   •  Analysis  of  one  or  mul1ple  sites   –  Checks  sites  against  web  performance  best  prac1ces   •  Score  based  on  rules  (YSlow  and  more)   –  Predefined  desktop  &  mobile  rules   –  Crea1ng  custom  rules  possible   •  Automa1cally  created  report   –  Output  as  HTML  or  JUnit  XML   –  Summary,  detailed  summary,  screenshots  etc.   •  Support  for  CI  tools  such  as  Jenkins  and  Travis  (par1al)   •  Highly  configurable  
4. Usage   $ sitespeed.io <options>!   Examples   # Analysis by crawling! $ sitespeed.io -u http://example.com -d 4! ! # Analysis by a list of URLs (i.e. no crawling)! $ sitespeed.io -u http://example.com -f urls.txt! ! # Screenshot of every analyzed page! $ sitespeed.io -u http://example.com -k true! ! # Custom viewport size! $ sitespeed.io -u http://example.com -v 640x480!
5. Highly  configurable  
6. Reports   •  Case  study:  naginata.fi   •  Report  v2.5.7   $ sitespeed.io –u http://naginata.fi -k true! –v 800x600 –c firefox! •  http://users.metropolia.fi/~jarkkot/sitespeed.io/naginata-sitespeed- v2.5.7/! •  Report  v3.0.0-­‐beta   $ sitespeed.io -u http://naginata.fi --screenshot! --viewPort 800x600! •  http://users.metropolia.fi/~jarkkot/sitespeed.io/naginata-sitespeed- v3.0.0-beta/ !
7. Version  2.x  vs.  3.x   v2.5.7   •  Dependencies   –  Java  1.6   •  XML  data   •  Velocity  templates   v3.0.0-­‐beta   •  Dependencies   –  node,  npm,  Java  1.6   •  JSON  data   •  Handlebars  templates   •  New  features   –  WebPageTest  &  Google  Page   Speed  Insights   –  Slowest  domains  and  Toplist   •  No  Windows  support  (for   the  1me  being)  
8. Observa1ons   •  v2.5.7  installa1on  easy  on  a  pris1ne  Mac  using   Homebrew   –  Installa1on  on  older  OS  X  with  half  the  internet  already   installed  was  much  harder   •  Using  BrowserTime  with  v3.0.0-­‐beta  froze  completely   •  Rules  really  easy  to  break   –  e.g.  domContentLoadedTime  needs  to  be  less  than  500ms   in  order  to  get  green   •  No  dedicated  task  runner  wrappers  (Grunt,  Gulp  etc.)   available   –  Understandable  as  v3.0.0  is  the  first  node  version  
9. Links   •  Sitespeed.io   – hbps://github.com/sitespeedio/sitespeed.io   •  Op1ons   – hbp://www.sitespeed.io/documenta1on/ #theop1ons   •  List  of  all  rules   – hbp://www.sitespeed.io/rules/#allrules