37 Lessons I’ve Learned
on the Performance Front Lines
Joshua Bixby
© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   4
© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   4
© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   4
© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   4
This convergence of awareness,
even urgency, on the business side
and growing expertise in the tech
community around web performance
marks the beginning of a new industry
that I’m calling “WPO” – Web
Performance Optimization.

                              Steve Souders, May 2010


© 2012 Strangeloop Networks      Strangeloop. Faster Websites. Automatically.   6
© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   7
Way back in 2009...




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   8
Velocity 2010




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   9
© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   10
© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   11
Our earliest mobile findings




© 2012 Strangeloop Networks    Strangeloop. Faster Websites. Automatically.   12
© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   13
IE9 will not make pages faster by default




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   14
CDN doesn’t always = faster




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   15
Using Google Analytics as a proxy




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   16
Real-world mirrored proxy metrics




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   17
97% of mobile response time is at the front end




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   18
Big players are as guilty as the rest of us




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   19
© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   20
© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   21
1 out 4 top sites don’t use cache headers




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   22
3rd party scripts




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   23
“Mobile rage”
       Not our
       study,
       but still
       interesting




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   24
Latency over 3G varies hugely
       Even when tested from the same location at the same time




© 2012 Strangeloop Networks              Strangeloop. Faster Websites. Automatically.   25
35% of mobile visitors prefer the full site




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   26
Mobile: Full-site visitors spend more




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   27
Impact of delays on m-commerce metrics




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   28
Mobile: Impact of delay on bounce rate




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   29
Mobile: Impact of delays on return traffic




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   30
Average page views across browsers




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   31
Average time on site across browsers




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   32
Average bounce rate across browsers




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   33
© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   34
Site speed and primary success?




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   35
© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   36
Desktop latency ranges from 65-145ms




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   37
Mobile latency ranges from 90-190ms




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   38
Average web page is now 1 MB




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   39
Average web page is now 1 MB




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   40
© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   41
Page size correlates to mobile load time




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   42
How does browser use vary through the day?




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   43
How does browser use vary over a week?




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   44
Finding the “performance poverty line”




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   45
© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   46
Steve’s rules still apply


       http://www.webperformancetoday.com/2012/05/29/browser-
       innovation-14-web-performance-rules-faster-loading-websites/

       http://www.webperformancetoday.com/2012/09/13/browser-
       innovation-performance-rules-faster-loading-websites-2/




© 2012 Strangeloop Networks               Strangeloop. Faster Websites. Automatically.   47
© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   48
Ecommerce State of the Union (Fall 2012)




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   49
© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   50
© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   51
© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   52
iPad 2 versus Galaxy Tablet




                               iPad 2                  Galaxy Tablet

      Platform                 iOS 5.1                  Android 4.04

      Browser                   Safari                 Android Browser

      Processor            1 GHz Apple A5                1 GHz ARM

      Display                  9.5 inch                   10.1-inch
                       512 MB DDR2 (1066 Mbit/s
      Memory                    RAM)                     1GB RAM

      Cellular Radio             3G                            3G
                                                  Class 12 (4+1/3+2/2+3/1+4
      GPRS                       YES                  slots), 32 - 48 kbps

      EDGE                      YES                      Class 12
                          HSDPA, 14.4 Mbps;       HSDPA, 21 Mbps; HSUPA,
      Speed                HSUPA, 2 Mbps                5.76 Mbps
© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   94
iPhone 4 versus Galaxy S



                               iPhone 4                          Galaxy S

      Platform                    iOS 4.1                     Android 2.3.6

      Browser                      Safari                   Android Browser

      Processor               1GHz Apple A4                    1GHz ARM

      Display                    3.5- inch                       4-inch

      Memory                 512 MB eDRAM                     512 MB RAM

      Cellular Radio                3G                             3G
                       Class 10 (4+1/3+2 slots), 32 -   Class 12 (4+1/3+2/2+3/1+4
      GPRS                        48 kbps                   slots), 32 - 48 kbps

      EDGE                 Class 10, 236.8 kbps                 Class 12
                            HSDPA, 7.2 Mbps;            HSDPA, 7.2 Mbps; HSUPA,
      Speed                 HSUPA, 5.76 Mbps                   5.76 Mbps
iPhone 4 vs Galaxy S (3G)




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   96
iPhone 4 vs Galaxy S (3G)




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   97
3G compared to desktop




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   98
iPhone 5 versus Galaxy S3



                                  iPhone 5                           Galaxy S3

     Platform                       iOS 6                           Android 4.0.4

     Browser                        Safari                         Android Browser

     Processor                 1.3GHz Apple A6                 1.4 GHz quad-core ARM

     Display                        4-inch                             4.8-inch

     Memory                       1G eDRAM                            1GB RAM

     Cellular Radio                3G/LTE                              3G, 4G
                                                           Class 12 (4+1/3+2/2+3/1+4 slots),
     GPRS                            YES                              32 - 48 kbps

     EDGE                            YES                               Class 12
                      DC-HSDPA, 42 Mbps; HSDPA, 21 Mbps;
                       HSUPA, 5.76 Mbps, LTE, 100 Mbps;       HSDPA, 21 Mbps; HSUPA,
     Speed                  Rev. A, up to 3.1 Mbps                  5.76 Mbps
iPhone 5 vs Galaxy S3 (LTE)




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   100
LTE compared to desktop




© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   101
© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   62
Source: http://fuzzyco.com/outliers/




© 2012 Strangeloop Networks                                     Strangeloop. Faster Websites. Automatically.   4
© 2012 Strangeloop Networks   Strangeloop. Faster Websites. Automatically.   64
© 2012 Strangeloop Networks
  2011                        Strangeloop. Faster Websites. Automatically.
                                                                Strangeloop. Faster Websites. Automatically.   103

37 Lessons I've Learned on the Performance Front Lines [WebPerfDays 2012]

  • 1.
    37 Lessons I’veLearned on the Performance Front Lines Joshua Bixby
  • 2.
    © 2012 StrangeloopNetworks Strangeloop. Faster Websites. Automatically. 4
  • 3.
    © 2012 StrangeloopNetworks Strangeloop. Faster Websites. Automatically. 4
  • 4.
    © 2012 StrangeloopNetworks Strangeloop. Faster Websites. Automatically. 4
  • 5.
    © 2012 StrangeloopNetworks Strangeloop. Faster Websites. Automatically. 4
  • 6.
    This convergence ofawareness, even urgency, on the business side and growing expertise in the tech community around web performance marks the beginning of a new industry that I’m calling “WPO” – Web Performance Optimization. Steve Souders, May 2010 © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 6
  • 7.
    © 2012 StrangeloopNetworks Strangeloop. Faster Websites. Automatically. 7
  • 8.
    Way back in2009... © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 8
  • 9.
    Velocity 2010 © 2012Strangeloop Networks Strangeloop. Faster Websites. Automatically. 9
  • 10.
    © 2012 StrangeloopNetworks Strangeloop. Faster Websites. Automatically. 10
  • 11.
    © 2012 StrangeloopNetworks Strangeloop. Faster Websites. Automatically. 11
  • 12.
    Our earliest mobilefindings © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 12
  • 13.
    © 2012 StrangeloopNetworks Strangeloop. Faster Websites. Automatically. 13
  • 14.
    IE9 will notmake pages faster by default © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 14
  • 15.
    CDN doesn’t always= faster © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 15
  • 16.
    Using Google Analyticsas a proxy © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 16
  • 17.
    Real-world mirrored proxymetrics © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 17
  • 18.
    97% of mobileresponse time is at the front end © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 18
  • 19.
    Big players areas guilty as the rest of us © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 19
  • 20.
    © 2012 StrangeloopNetworks Strangeloop. Faster Websites. Automatically. 20
  • 21.
    © 2012 StrangeloopNetworks Strangeloop. Faster Websites. Automatically. 21
  • 22.
    1 out 4top sites don’t use cache headers © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 22
  • 23.
    3rd party scripts ©2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 23
  • 24.
    “Mobile rage” Not our study, but still interesting © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 24
  • 25.
    Latency over 3Gvaries hugely Even when tested from the same location at the same time © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 25
  • 26.
    35% of mobilevisitors prefer the full site © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 26
  • 27.
    Mobile: Full-site visitorsspend more © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 27
  • 28.
    Impact of delayson m-commerce metrics © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 28
  • 29.
    Mobile: Impact ofdelay on bounce rate © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 29
  • 30.
    Mobile: Impact ofdelays on return traffic © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 30
  • 31.
    Average page viewsacross browsers © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 31
  • 32.
    Average time onsite across browsers © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 32
  • 33.
    Average bounce rateacross browsers © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 33
  • 34.
    © 2012 StrangeloopNetworks Strangeloop. Faster Websites. Automatically. 34
  • 35.
    Site speed andprimary success? © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 35
  • 36.
    © 2012 StrangeloopNetworks Strangeloop. Faster Websites. Automatically. 36
  • 37.
    Desktop latency rangesfrom 65-145ms © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 37
  • 38.
    Mobile latency rangesfrom 90-190ms © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 38
  • 39.
    Average web pageis now 1 MB © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 39
  • 40.
    Average web pageis now 1 MB © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 40
  • 41.
    © 2012 StrangeloopNetworks Strangeloop. Faster Websites. Automatically. 41
  • 42.
    Page size correlatesto mobile load time © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 42
  • 43.
    How does browseruse vary through the day? © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 43
  • 44.
    How does browseruse vary over a week? © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 44
  • 45.
    Finding the “performancepoverty line” © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 45
  • 46.
    © 2012 StrangeloopNetworks Strangeloop. Faster Websites. Automatically. 46
  • 47.
    Steve’s rules stillapply http://www.webperformancetoday.com/2012/05/29/browser- innovation-14-web-performance-rules-faster-loading-websites/ http://www.webperformancetoday.com/2012/09/13/browser- innovation-performance-rules-faster-loading-websites-2/ © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 47
  • 48.
    © 2012 StrangeloopNetworks Strangeloop. Faster Websites. Automatically. 48
  • 49.
    Ecommerce State ofthe Union (Fall 2012) © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 49
  • 50.
    © 2012 StrangeloopNetworks Strangeloop. Faster Websites. Automatically. 50
  • 51.
    © 2012 StrangeloopNetworks Strangeloop. Faster Websites. Automatically. 51
  • 52.
    © 2012 StrangeloopNetworks Strangeloop. Faster Websites. Automatically. 52
  • 53.
    iPad 2 versusGalaxy Tablet iPad 2 Galaxy Tablet Platform iOS 5.1 Android 4.04 Browser Safari Android Browser Processor 1 GHz Apple A5 1 GHz ARM Display 9.5 inch 10.1-inch 512 MB DDR2 (1066 Mbit/s Memory RAM) 1GB RAM Cellular Radio 3G 3G Class 12 (4+1/3+2/2+3/1+4 GPRS YES slots), 32 - 48 kbps EDGE YES Class 12 HSDPA, 14.4 Mbps; HSDPA, 21 Mbps; HSUPA, Speed HSUPA, 2 Mbps 5.76 Mbps
  • 54.
    © 2012 StrangeloopNetworks Strangeloop. Faster Websites. Automatically. 94
  • 55.
    iPhone 4 versusGalaxy S iPhone 4 Galaxy S Platform iOS 4.1 Android 2.3.6 Browser Safari Android Browser Processor 1GHz Apple A4 1GHz ARM Display 3.5- inch 4-inch Memory 512 MB eDRAM 512 MB RAM Cellular Radio 3G 3G Class 10 (4+1/3+2 slots), 32 - Class 12 (4+1/3+2/2+3/1+4 GPRS 48 kbps slots), 32 - 48 kbps EDGE Class 10, 236.8 kbps Class 12 HSDPA, 7.2 Mbps; HSDPA, 7.2 Mbps; HSUPA, Speed HSUPA, 5.76 Mbps 5.76 Mbps
  • 56.
    iPhone 4 vsGalaxy S (3G) © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 96
  • 57.
    iPhone 4 vsGalaxy S (3G) © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 97
  • 58.
    3G compared todesktop © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 98
  • 59.
    iPhone 5 versusGalaxy S3 iPhone 5 Galaxy S3 Platform iOS 6 Android 4.0.4 Browser Safari Android Browser Processor 1.3GHz Apple A6 1.4 GHz quad-core ARM Display 4-inch 4.8-inch Memory 1G eDRAM 1GB RAM Cellular Radio 3G/LTE 3G, 4G Class 12 (4+1/3+2/2+3/1+4 slots), GPRS YES 32 - 48 kbps EDGE YES Class 12 DC-HSDPA, 42 Mbps; HSDPA, 21 Mbps; HSUPA, 5.76 Mbps, LTE, 100 Mbps; HSDPA, 21 Mbps; HSUPA, Speed Rev. A, up to 3.1 Mbps 5.76 Mbps
  • 60.
    iPhone 5 vsGalaxy S3 (LTE) © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 100
  • 61.
    LTE compared todesktop © 2012 Strangeloop Networks Strangeloop. Faster Websites. Automatically. 101
  • 62.
    © 2012 StrangeloopNetworks Strangeloop. Faster Websites. Automatically. 62
  • 63.
    Source: http://fuzzyco.com/outliers/ © 2012Strangeloop Networks Strangeloop. Faster Websites. Automatically. 4
  • 64.
    © 2012 StrangeloopNetworks Strangeloop. Faster Websites. Automatically. 64
  • 65.
    © 2012 StrangeloopNetworks 2011 Strangeloop. Faster Websites. Automatically. Strangeloop. Faster Websites. Automatically. 103