Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
the hidden cost of 
web components 
Hubert Liu @hcliu 
Kyle Conarro @conarro 
Atlanta Web Performance Meetup 
November 4, ...
in the beginning...
in the beginning...
rethinking the waterfall 
source: A Better Waterfall Chart by Mark Zeman
taking a step back 
HAR spec
finding slow resources 
z.cdn.turner.com 
7925 ms 
i2.cdn.turner.com 
7633 ms
finding slow resources 
Domain Total Load Time (ms) 
z.cdn.turner.com 7,925 
i2.cdn.turner.com 7,633 
i.cdn.turner.com 5,2...
finding slow resources 
Domain Total Load Time (ms) 
z.cdn.turner.com 7,925 
i2.cdn.turner.com 7,633 
i.cdn.turner.com 5,2...
finding slow resources 
9 references to 
z.cdn.turner.com
finding slow resources 
but wait…
finding slow resources 
but wait… 
where are slow requests coming from?
tracking down the source
tracking down the source 
“...an HTTP header field that identifies the address of the web page that 
linked to the resourc...
tracking down the source 
Referer Request Count Total Load Time (ms) 
homepage (www.cnn.com) 177 34,433 
z.cdn.turner.com/...
tracking down the source 
only 19 referers!
tracking down the source 
insights.rigor.com
when to use what 
Waterfall Chart Domain Analysis Referer Analysis 
Visually represents a single 
page load 
Useful for: 
...
questions?
Upcoming SlideShare
Loading in …5
×

The Hidden Cost of Web Components - ATL Web Performance Meetup

699 views

Published on

Eliminating slow or unnecessary HTTP requests is essential to maintaining fast websites. Identifying which requests should be removed, however, can prove difficult. In this session, we'll present a new way of analyzing HAR data that ranks the various components of a website by the cost they have on performance.

Published in: Software
  • Be the first to comment

The Hidden Cost of Web Components - ATL Web Performance Meetup

  1. 1. the hidden cost of web components Hubert Liu @hcliu Kyle Conarro @conarro Atlanta Web Performance Meetup November 4, 2014
  2. 2. in the beginning...
  3. 3. in the beginning...
  4. 4. rethinking the waterfall source: A Better Waterfall Chart by Mark Zeman
  5. 5. taking a step back HAR spec
  6. 6. finding slow resources z.cdn.turner.com 7925 ms i2.cdn.turner.com 7633 ms
  7. 7. finding slow resources Domain Total Load Time (ms) z.cdn.turner.com 7,925 i2.cdn.turner.com 7,633 i.cdn.turner.com 5,209 ds.serving-sys.com 3,829 ads.cnn.com 2,569
  8. 8. finding slow resources Domain Total Load Time (ms) z.cdn.turner.com 7,925 i2.cdn.turner.com 7,633 i.cdn.turner.com 5,209 ds.serving-sys.com 3,829 ads.cnn.com 2,569
  9. 9. finding slow resources 9 references to z.cdn.turner.com
  10. 10. finding slow resources but wait…
  11. 11. finding slow resources but wait… where are slow requests coming from?
  12. 12. tracking down the source
  13. 13. tracking down the source “...an HTTP header field that identifies the address of the web page that linked to the resource being requested.” http://en.wikipedia.org/wiki/HTTP_referer
  14. 14. tracking down the source Referer Request Count Total Load Time (ms) homepage (www.cnn.com) 177 34,433 z.cdn.turner.com/xslo/cvp/assets/contain er/2.0.4.0/cvp_main_container... 44 7,214 ads.cnn.com/html.ng/site=cnn&cnn_page type=main&cnn_position=728x90... 9 2,977 z.cdn.turner.com/cnn/tmpl_asset/static/w ww_homepage/2970/css/hplib-min.css 22 2,348 ds.serving-sys.com/BurstingRes//Site- 40150/Type-2/ed3d7348-93fb-4938-8d... 2 2,308
  15. 15. tracking down the source only 19 referers!
  16. 16. tracking down the source insights.rigor.com
  17. 17. when to use what Waterfall Chart Domain Analysis Referer Analysis Visually represents a single page load Useful for: ● Identifying parser / render-blocking assets ● Spotting opportunities for domain sharding Aggregates resource load times by domain Useful for: ● Finding slow hosts ● Monitoring third-party providers Aggregates resource load times by HTTP Referer Useful for: ● Assigning costs to resources ● Tracking down the source for particular requests
  18. 18. questions?

×