Download - Site Speed Optimisation for JWC2012
![Page 1: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/1.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
Joomla Site Speed Optimization
@hans2103Hans Kuijpers
![Page 2: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/2.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
![Page 3: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/3.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
Speed matters!
![Page 4: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/4.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
+500 ms ➙ -20% traffic@ Google
+100 ms ➙ -1% sales@ Amazon
![Page 5: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/5.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimizationhttp://www.websiteoptimization.com/speed/tweak/average-web-page/
Websites are bigger
![Page 6: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/6.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
Google for:Gomez Web Speed Survey
![Page 7: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/7.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
Now what?
• Measure
• Learn
• Optimize
• Iterate
![Page 8: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/8.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
and again and again
![Page 9: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/9.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
Default Joomla 2.5.x installationwith sample data
![Page 10: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/10.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
http://tools.pingdom.com/fpt/
![Page 11: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/11.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
![Page 12: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/12.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
http://developer.yahoo.com/performance/rules.html
![Page 13: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/13.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
http://yslow.org
![Page 14: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/14.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
![Page 15: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/15.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
https://developers.google.com/speed/docs/insights/rules
![Page 16: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/16.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
![Page 17: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/17.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
![Page 18: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/18.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
http://gtmetrix.com
![Page 19: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/19.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
![Page 20: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/20.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
![Page 21: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/21.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
![Page 22: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/22.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
things to do first
• reduce http request
• use gzip compression
• use caching
![Page 23: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/23.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
browser server
HTTP requests
![Page 24: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/24.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
![Page 25: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/25.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
![Page 26: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/26.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
6 css files
![Page 27: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/27.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
6 js files
![Page 28: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/28.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
http://yireo.com/scriptmerge
![Page 29: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/29.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
Before cache plugin
![Page 30: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/30.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
2 css files
![Page 31: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/31.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
1 js files
![Page 32: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/32.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
reduced with 11
![Page 33: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/33.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
![Page 34: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/34.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
still too low
![Page 35: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/35.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
Gzip compression
server
serverbrowser
browser
1 2
34
zip
browser5
unzip
![Page 36: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/36.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
http://www.whatsmyip.org/http-compression-test/
![Page 37: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/37.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
change to YES
![Page 38: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/38.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
# Compress output using mod_deflate<IfModule mod_deflate.c> AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css text/javascript AddOutputFilterByType DEFLATE application/xml application/xhtml+xml application/rss+xml AddOutputFilterByType DEFLATE application/javascript application/x-javascript
BrowserMatch ^Mozilla/4 gzip-only-text/html BrowserMatch ^Mozilla/4\.0[678] no-gzip BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html
SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png)$ no-gzip dont-vary SetEnvIfNoCase Request_URI \.(?:exe|t?gz|zip|bz2|sit|rar)$ no-gzip dont-vary SetEnvIfNoCase Request_URI \.(?:pdf|doc)$ no-gzip dont-vary SetEnvIfNoCase Request_URI \.(?:avi|mov|mp3|mp4|rm)$ no-gzip dont-vary</IfModule>
add to .htaccess
![Page 39: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/39.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
![Page 40: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/40.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
![Page 41: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/41.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
Cachingis page in Joomla cache?
• yes ➙ serve cached page• no ➙ generate page
Joomla cache is goodjotCache is better.
exclude pages from cache
![Page 42: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/42.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
http://www.jotcomponents.net/web-programming/jotcache
![Page 43: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/43.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
order last
my settings
![Page 44: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/44.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
# Turn on Expires and set default to 0ExpiresActive OnExpiresDefault A0 # Set up caching on media files for 1 year (forever?)<filesMatch "\.(flv|ico|pdf|avi|mov|ppt|doc|mp3|wmv|wav)$"> ExpiresDefault A29030400 Header append Cache-Control "public"</filesMatch> # Set up caching on media files for 1 week<filesMatch "\.(gif|jpg|jpeg|png|swf)$"> ExpiresDefault A604800 Header append Cache-Control "public"</filesMatch> # Set up 2 Hour caching on commonly updated files<filesMatch "\.(xml|txt|html|js|css)$"> ExpiresDefault A7200 Header append Cache-Control "proxy-revalidate"</filesMatch> # Force no caching for dynamic files<filesMatch "\.(php|cgi|pl|htm)$"> ExpiresActive Off Header set Cache-Control "private, no-cache, no-store, proxy-revalidate, no-transform" Header set Pragma "no-cache"</filesMatch>
add to .htaccess
mod_expiresin combination withmod_deflateI know my providerinstalled both
![Page 45: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/45.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
![Page 46: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/46.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
There are 3 static components without a far-future expiration date.
![Page 47: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/47.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
# Turn on Expires and set default to 0ExpiresActive OnExpiresDefault A0 # Set up caching on media files for 1 year (forever?)<filesMatch "\.(flv|ico|pdf|avi|mov|ppt|doc|mp3|wmv|wav)$"> ExpiresDefault A29030400 Header append Cache-Control "public"</filesMatch> # Set up caching on media files for 1 week<filesMatch "\.(gif|jpg|jpeg|png|swf)$"> ExpiresDefault A604800 Header append Cache-Control "public"</filesMatch> # Set up 2 Hour caching on commonly updated files<filesMatch "\.(xml|txt|html|js|css)$"> ExpiresDefault A7200 Header append Cache-Control "proxy-revalidate"</filesMatch> # Force no caching for dynamic files<filesMatch "\.(php|cgi|pl|htm)$"> ExpiresActive Off Header set Cache-Control "private, no-cache, no-store, proxy-revalidate, no-transform" Header set Pragma "no-cache"</filesMatch>
set this value to a week and YSlow will give you a higher score
add to .htaccess
![Page 48: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/48.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
less is more...
• combine css images in sprites
• css3 instead of images
• optimize images
• remove unwanted css files
• remove unwanted js files
• show less ...
![Page 49: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/49.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
![Page 50: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/50.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
![Page 51: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/51.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
reference to a sprite img
![Page 52: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/52.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
reduction of 6 http requestsfrom 7 to 1
![Page 53: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/53.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
button as css3 instead of image
![Page 54: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/54.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
![Page 55: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/55.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
http://www.colorzilla.com/gradient-editor/
![Page 56: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/56.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
http://css3generator.com
![Page 57: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/57.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
• original image: 2.4MB• png-24: 387.9 KB• gif 256 colors: 164.3KB• png-8 256 colors: 139KB• jpg 60 quality: 99.46 KB
choose wisely
![Page 58: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/58.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
Do you really needmootools?
if not... remove it
using Mootools Enabler/Disabler
![Page 59: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/59.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
https://github.com/phproberto/plg_sys_mootable
![Page 60: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/60.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
![Page 61: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/61.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
set per menu item
![Page 62: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/62.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
and again and again
![Page 63: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/63.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
Is a fast website important?
yes it is!
![Page 64: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/64.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
are there more things to improve?
yes there are... tons of books and sites are written about it.
go out find them and enjoy improving your site speed.
![Page 65: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/65.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
one more thing
• just seen at the presentation by Eli Aschkenasy
![Page 66: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/66.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization
![Page 67: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/67.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimizationhttp://www.flickr.com/photos/trasimac/1217071176
thank you for your time and have fun
http://slideshare.net/hans2103
hans2103
http://about.me/hans2103
![Page 68: Site Speed Optimisation for JWC2012](https://reader034.vdocuments.mx/reader034/viewer/2022042714/55586a90d8b42aaa7e8b4b46/html5/thumbnails/68.jpg)
@hans2103
Joomla World Conference 2012 Site Performance Optimization