steve souders

Web Performance

Optimization

stevesouders.com/docs/amsterdam-meetup-20120509.pptx Disclaimer: This content does not necessarily reflect the opinions of my employer.

drives traffic

improves UX

increases revenue

reduces costs

Web

Performance

Optimization WPO

backend frontend

“waterfall chart”

Top 10

24% - backend

76% - frontend

10,000+

8% - backend

92% - frontend

www2012.wwwconference.org/proceedings/proceedings/p41.pdf

research.att.com/articles/featured_stories/2011_03/201102_Energy_efficient

Mobile State Machine

?

www.intuit.com

www.webpagetest.org/result/120503_RC_46SJA/

125

1,847

1.587

9.651

requests

kB

seconds start render

seconds PLT

mbox.js docwrites /mbox/standard

blocks ie7.css blocks rendering

don’t docwrite scripts

domain sharding

PNGs take 3-6 seconds to download

quickbooks.intuit.co

m

www.webpagetest.org/result/120503_B9_46SJB/

106

632

1.265

5.740

requests

kB


seconds PLT

mbox.js docwrites /mbox/standard

blocks ie7.css blocks rendering


domain sharding

add caching headers

turbotax.intuit.com

www.webpagetest.org/result/120503_ZV_46SJC/

112

438

2.412

3.523

requests

kB


seconds PLT

rendering extremely blocked

concat scripts, concat stylesheets

don’t mix inline & external scripts


domain sharding

add caching headers

sprites

turbotax.intuit.com

www.webpagetest.org/compare

this is turbotax

this is turbotax on Page Speed

Caching

http://httparchive.org/interesting.php#max-age

55%

3%

15%

16%

8%3%

max-age(days)

none

max-age<=0

0<max-age<=1

1<max-age<=30

30<max-age<=365

365<max-age

HTTP Archive: 54K URLs, 4.6M resources

55% - NO caching headers

18% - cacheable < 1 day } 73%

http://httparchive.org/trends.php?s=intersection

adoption is slow

Why so few caching headers?

resources are dynamic

lack of awareness

“uncacheable” resources aren’t very dynamic

2 weeks is a long gap - daily would be higher

46% 38%

Jan 15

46%

Feb 1 Feb 15

55% uncacheable

same as

Jan 15

same as

Jan 15

http://www.stevesouders.com/blog/2012/03/22/cache-them-if-you-can/

44% 35%

“uncacheable” resources are LESS dynamic 2 weeks: 46% (uncacheable) vs. 44% (all)

4 weeks: 38% (uncacheable) vs. 35% (all)

who votes for “lack of awareness”?

Jan 15

46%

Feb 1 Feb 15

same as

Jan 15

same as

Jan 15

all resources

36% of resources unchanged after 1 month

only 11% of resources cacheable for > 1 month

http://www.stevesouders.com/blog/2012/03/22/cache-them-if-you-can/

100%

45%

36%32%

28%26%24%22%21%19%18%17%17%16%15%14%14%13%12%12%11%11%10%10%9%

0%

20%

40%

60%

80%

100%

2/11 3/15 4/15 5/16 6/15 7/15 8/15 9/15 10/15 11/15 12/15 1/15 2/15

Resourcesunchangedover meforALLresources

http://www.yuiblog.com/blog/2007/01/04/performance-research-part-2/

40-60% of users missing cacheable resources 20% of page views

* Based on available disk space – I had 50 GB free.

(my) browser cache sizes:

• Chrome: 320 MB (cap)*

• IE 9: 250 MB

• IE 7-8: 50 MB

• Firefox 11: 830 MB*

• Opera 11: 20 MB

• iPhone 4: 30-35 MB

• Galaxy Nexus: 18 MB

https://plus.google.com/103382935642834907366/posts/XRekvZgdnBb

Chrome for Windows stats:

• 30% (48%?) of users have a full cache

• full cache users reach that point after 4

hours of active browsing (20 clock hours)

• 7% of users clear their cache 1+ per week

• 19% of users experience “fatal cache

corruption” 1+ per week

https://plus.google.com/103382935642834907366/posts/XRekvZgdnBb

recap:

• resource owners underutilize max-age

• users are often missing cacheable resources

• cache sizes are small; caches fill quickly

what can we do?

• gather more/better stats

• make caches bigger (and fix corruption)

• improve purging logic (mime type, etc.)

• more intelligent, personalized browsers

cache compressed or uncompressed?

Browser Compressed responses

cached compressed?

Chrome 17 yes

Firefox 11 yes

IE 8 no

IE 9 no

Safari 5 no

Opera 11 yes

http://www.stevesouders.com/blog/2012/03/27/cache-compressed-or-uncompressed/

steve souders

Technology