Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Web performance at WDCNZ
1. The
Forgotten Art
of Web Performance
http://www.flickr.com/photos/mhzmaster/9659478
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
2. I’m here to talk about making websites faster
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
3. I’m here to talk about making websites faster
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
4. Web performance is about driving more traffic to your site
http://www.flickr.com/photos/darrentunnicliff/37179763
The Forgotten art of Web Performance
forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
5. Web performance is about “DevOps"
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
6. FRONT END BACK END
HTML Network
CSS Web server
Javascript Application
Images Database
Third party O/S
Hardware
Web Performance Optimisation Basics
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
7. FRONT END BACK END
HTML Network
CSS Web server
Javascript Application
Images Database
Third party O/S
Hardware
Web performance comes from combination of
“back-end” and “front-end” optimisations
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
8. FRONT END BACK END
HTML Network
CSS Web server
Javascript Application
Images Database
Third party O/S
Hardware
95% of download time comes from “Front-end”
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
9. FRONT END BACK END
HTML Network
CSS Web server
Javascript Application
Images Database
Third party O/S
Hardware
You want to deliver content as fast as possible...
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
10. FRONT END BACK END
HTML Network Requests
CSS Web server
Javascript Application
Images Database
Third party O/S
Hardware
You can maximise the requests you can
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
11. FRONT END BACK END
HTML Network
CSS Web server
Javascript Application
Images Database
Third party O/S
Hardware Minimise
by minimising request times of your stack
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
12. If Average request takes 50ms to serve and
200 “agents” => 4000 requests per second
The Forgotten art of Web Performance
forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
13. How do I fix?
http://www.flickr.com/photos/lenore-m/251580065
The Forgotten art of Web Performance
forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
14. Lots of tools to help you fix your site
http://www.flickr.com/photos/lenore-m/251580065
The Forgotten art of Web Performance
forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
15. YSlow - 35 rules of Web performance
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
16. Pagespeed - 6 principles for speeding up
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
17. Aptimize.com
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
18. The difference web performance can make is huge
http://www.flickr.com/photos/thebusybrain/2492945
The Forgotten art of Web Performance
forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
19. It seems that some sites haven’t evolved
The Forgotten art of Web Performance
forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
20. For web performance, some sites are stuck in the 90’s
http://www.dailystab.com/blog/wp-content/uploads/2007/12/spice-girls-vancouver-lg.jpg
The Forgotten art of Web Performance
forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
21. Here’s a normal website
The Forgotten art of Web Performance
forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
22. I see things a little differently
The Forgotten art of Web Performance
forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
23. No HTTP Compression
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
24. Poor expiry settings
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
25. No CSS / JS bundling
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
26. No Spriting
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
27. Would you be proud of this ?
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
28. 1.2Mb, 133 requests, 21 JS files, 3 CSS files
The Forgotten art of Web Performance
forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
29. Why is WPO
important?
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
30. Why is WPO important
“Slow websites are boring”
Slow websites are boring!
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
31. Customers are complaining about your site
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
32. Fast websites make more money
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
33. “We see a direct correlation between the speed
of our services and our bottom line.
Our customers seem inclined to spend a set time
on our site per session – the more pages they
can view in that time, the more they see and
buy, and the more we earn.”
John MacDonald - CTO Trade Me 2006
Time is Money
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
34. WPO State of Nation
http://www.flickr.com/photos/nznationalparty/4436793708/
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
35. Homepage hall of shame
2011
160 sites
Home broadband
vs
Office broadband
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
36. Key findings
Office BBand Home BBand
Ave page Ave page Ave home
load time load time page size
6.01s 12.5s 665K
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
37. Whoʼs the fastest
1.17s Telecom 1.62s Zenbu
1.23s DOL 1.72s Geonet
1.49s Snipesoft 1.73s School.nz
1.58s Auckland Uni 1.78s Maxx
1.59 Massey Uni 1.59 Westpac
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
38. Whoʼs the S L O W E S T
26.8s Skykiwi 16.3s interest.co.nz
20.9s The Standard 15.1s 3 News
20.1s iStars 15.1s The Big Idea
17.2s WhaleOil 14.7s Readers Digest
16.4s NZ Yahoo 14.3s Stuff
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
39. Data on Google docs
http://tinyurl.com/homepageHOS2011
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
40. Forgotten art of Web performance
http://www.flickr.com/photos/23927132@N05/2500055549/
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
41. Once upon a time...
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
42. Internet speeds were crap
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
43. Had to learn to scale the hard way
http://www.flickr.com/photos/kitby/5414374130/
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
44. 4 principles
to help you
scale your
site
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
45. Rule 1) Dynamic vs Static
The Forgotten art of Web Performance
forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
46. What is dynamic content?
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
47. 1 hour ?
5 minutes ? 1 minute ?
Text
30 minutes ?
Almost everything is static for a time
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
48. We used to pre-generate content
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
49. 2000+ req / sec
vs
30 req / sec
Web servers love static content
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
50. 1) Pre-generate content
http://www.flickr.com/photos/aquariawintersoul/4162431443/
The Forgotten art of Web Performance
forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
51. 2) Cache everything
http://www.flickr.com/photos/markusnl/5563657463/
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
52. Database views
Memcache
http://memcached.org
Varnish / Squid
http://www.varnish-cache.org/
2) Cache everything
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
53. 2) Cache everything
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
54. Google likes Varnish
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
55. 3) Watch out for 3rd party widgets
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
57. Pages are static - server generates page
on earthquake event
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
58. Built own CDN + plus lots of other stuff
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
59. Handles 12,000 req/sec at peak
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
60. Rule 2) User perception
http://www.flickr.com/photos/jasongillyon/243909248/
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
61. We used to divide 50 row table into tables of 10 rows
http://www.flickr.com/photos/silkroadcollection/4886903818/
The Forgotten art of Web Performance
forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
62. 1) Front end techniques
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
63. Delay JS loading
http://www.flickr.com/photos/sbisson/3852086117/
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
64. Load only what users can see
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
65. Asynchronous JS loads content
Who’s doing it right
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
66. Google image search
Who’s doing it right
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
67. Twitter web client
Who’s doing it right
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
69. Uses Aptimize WAX
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
70. Asychronous JS loading of ads, no revenue loss
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
71. Lots of performance optimisations
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
72. Site loads in just over 2 sec with lots of 3rd party stuff
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
73. Rule 3) Reduce requests
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
74. Browser round trip will kill you...
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
75. Looking at a site at DSL speed
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
76. Looking at a site at office speed
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
77. 80+ images to serve
30ms local
270ms overseas
Up to 10 times more effort to
serve content
When the earthquake strikes...
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
78. Javascript and CSS Bundling
http://www.flickr.com/photos/ferguson666/3605271302/
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
79. YUI Compressor
http://developer.yahoo.com/yui/compressor/
Google Closure
http://code.google.com/closure/
Every framework has tools
Bundling tools
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
80. Make bundling part of your build process
http://www.flickr.com/photos/hifumiyo/4021034029/
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
81. Image Spriting
http://www.flickr.com/photos/roadsidepictures/1435060357/
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
82. Sprite me
http://spriteme.org
Smart sprites
http://csssprites.org/
spriteme + smartsprites
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
83. Guide for number of page requests
< 20 Elite
20-30 Excellent
30-60 Average
60-80 Below average
80-100 Poor
>100 My eyes are bleeding
How many requests ???
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
84. Static image expiry
http://www.flickr.com/photos/newtown_grafitti/5131604440/
The Forgotten art of Web Performance
forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
85. Who’s doing it right
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
86. Westpac - 20 requests - 1 request reload
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
87. Rule 4) Change defaults
http://www.flickr.com/photos/deadhorse/367716072/
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
88. ##
## Server-Pool Size Regulation (MPM specific)
##
# prefork MPM
# StartServers: number of server processes to start
# MinSpareServers: minimum number of server processes which are kept spare
# MaxSpareServers: maximum number of server processes which are kept spare
# MaxClients: maximum number of server processes allowed to start
# MaxRequestsPerChild: maximum number of requests a server process serves
<IfModule mpm_prefork_module>
StartServers 5
MinSpareServers 5
MaxSpareServers 10
MaxClients 150
MaxRequestsPerChild 0
</IfModule>
# worker MPM
# StartServers: initial number of server processes to start
# MaxClients: maximum number of simultaneous client connections
# MinSpareThreads: minimum number of worker threads which are kept spare
# MaxSpareThreads: maximum number of worker threads which are kept spare
# ThreadsPerChild: constant number of worker threads in each server process
# MaxRequestsPerChild: maximum number of requests a server process serves
<IfModule mpm_worker_module>
StartServers 2
MaxClients 150
MinSpareThreads 25
MaxSpareThreads 75
ThreadsPerChild 25
MaxRequestsPerChild 0
</IfModule>
Webserver settings
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
89. Apache has 150
clients as default
You can change it!
Webserver settings
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
90. • Turn on compression
• Increase of number of web
clients
• Set expiry for images
Switch to better webserver ;)
Tweak settings
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
91. Server browning out
8Gb ram
Apache 250 clients
running PHP
4Gb Ram free
What to do ??
Vendor says add
more servers
True story - http server
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
92. my-small.cnf
# This is for a system with little memory (<= 64M) where MySQL is only used
my-medium.cnf
# This is for a system with little memory (32M - 64M) where MySQL plays
my-large.cnf
# This is for a large system with memory = 512M where the system runs mainly
my-huge.cnf
# This is for a large system with memory of 1G-2G where the system runs mainly
Database settings
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
94. Summary
1) Use more static content
- Pre-generate
- Cache everything
- Minimise 3rd party widgets
2) Improve browser
- Defer JS loading
- Asychronous JS
- Delay beyond the fold
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
95. Summary
3) Minimise requests
- Bundle JS + CSS files
- Spriting
- Set 2 year expiry for assets
4) Change defaults
- Change defaults for Webserver and DB
- Tweet to fit your server memory
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
96. Video
Final thought - Sites are around 550K
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
97. Video
Final thought - Sites are around 550K
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
98. Questions
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
99. Web testing
Global Performance testing + Videos
www.webpagetest.org
Load testing software - (Linux) Siege + Bombard
Been using for transaction testing of e-commerce buying
http://www.joedog.org/index/siege-home
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011
100. Thank you
The Forgotten Art of Web Performance
14th July 2011
Friday, 15 July 2011