WordPress: Performance Optimization and Scaling - WordCamp Las Vegas 2011
WordPress Performance optimization
-
Upload
brecht-ryckaert -
Category
Internet
-
view
365 -
download
0
Transcript of WordPress Performance optimization
WORDPRESS PERFORMANCE TWEAKING
BRECHT RYCKAERT
“WordPress Expert” @ combell.com
I blog at brechtryckaert.com
Author “WordPress Security 101”
Proud dad of Fleur!
BRECHT RYCKAERT
LET ME TELL YOU A STORY ABOUT A CRICKET AND AN ANT…
IN MANY WAYS… WE’RE THE CRICKET WHEN LAUNCHING A NEW WORDPRESS SITE…
MORE RAM & CPU =/= A MUCH FASTER SITE
MISCONCEPTION:
PUT IN THE WORK AND YOU WILL GET YOU A FAST SITE!
BE THE ANT…
ANALYZE THE SITESTEP ONE
“YES… THIS SEEMS TO BE AN ACUTE CASE OF SLUGGISHNESS IN YOUR WORDPRESS”
ANALYZE THE SITE
MY ANALYSIS TOOLS OF CHOICE
▸ Firebug in Mozilla Firefox (don’t use it in Chrome)
▸ gtmetrix.com (combines Google Pagespeed, Yahoo YSlow,…)
ANALYZE THE SITE
IDEAL VALUES
▸ 30 to 50 elements -> concurrent browser connections
▸ 0 to 1.5 MB in size
▸ Less is more
ANALYZE THE SITE
WAYS TO IMPROVE LOADING SPEED
▸ Domain sharding
▸ CSS-sprites (http://css-tricks.com/css-sprites/)
OPTIMIZE WORDPRESSSTEP TWO
OPTIMIZE WORDPRESS
SLOW INITIAL GET?
▸ Usually points towards too many queries
▸ Fix: limit or reduce the number of queries
OPTIMIZE WORDPRESS
SLOW INITIAL GET?
▸ Usually points towards too many queries
▸ Fix: limit or reduce the number of queries
Reduce your plugins to the bare minimum!
OPTIMIZE WORDPRESS
OPTIMIZE IMAGES
▸ wp smush it
▸ Reduce the size of images (new and already added images)
OPTIMIZE WORDPRESS
CACHING PLUGINS
▸ W3 Total Cache
▸ WP Super Cache
▸ WP Rocket
▸ WP Faster Cache
▸ …
OPTIMIZE WORDPRESS
MY PLUGIN OF CHOICE
“YOU KNOW THAT’S A SECURITY PLUGIN, RIGHT?”
OPTIMIZE WORDPRESS
MY PLUGIN OF CHOICE
▸ Proof by Mattias Geniar:https://ma.ttias.be/benchmarking-the-performance-of-wordfence-a-wordpress-plugin/
SERVER SIDE TWEAKS STEP THREE
SERVER SIDE TWEAKS
GZIP
▸ Compresses the data sent from server to browser
▸ add to your .htaccess:AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/htmlAddOutputFilterByType DEFLATE text/xmlAddOutputFilterByType DEFLATE text/cssAddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/rss+xmlAddOutputFilterByType DEFLATE application/javascriptAddOutputFilterByType DEFLATE application/x-javascript
SERVER SIDE TWEAKS
DISABLE ENTITY TAGS
▸ Mechanism to verify if browsercache items correspond to current server version
▸ disable by adding this to .htaccess:Header unset ETagFileETag None
SERVER SIDE TWEAKS
MOD_EXPIRES
▸ Allows us to take control of the browsercache without a caching plugin
▸ add to your .htaccess:# BEGIN Expire headers<IfModule mod_expires.c>ExpiresActive On ExpiresDefault "access plus 5 seconds"ExpiresByType image/x-icon "access plus 2500000 seconds"ExpiresByType image/jpeg "access plus 2500000 seconds"ExpiresByType image/png "access plus 2500000 seconds"ExpiresByType image/gif "access plus 2500000 seconds"ExpiresByType application/x-shockwave-flash "access plus 2500000 seconds"ExpiresByType text/css "access plus 600000 seconds"ExpiresByType text/javascript "access plus 200000 seconds"ExpiresByType application/javascript "access plus 200000 seconds"ExpiresByType application/x-javascript "access plus 200000 seconds"ExpiresByType text/html "access plus 600 seconds"ExpiresByType application/xhtml+xml "access plus 600 seconds"</IfModule>
SERVER SIDE TWEAKS
MOD_EXPIRES
▸ add to your .htaccess (second part): # BEGIN Cache-Control Headers<IfModule mod_headers.c><filesMatch "\.(ico|jpe?g|png|gif|swf)$">Header set Cache-Control "public"</filesMatch><filesMatch "\.(css)$">Header set Cache-Control "public"</filesMatch><filesMatch "\.(js)$">Header set Cache-Control "private"</filesMatch><filesMatch "\.(x?html?|php)$"> Header set Cache-Control "private, must-revalidate"</filesMatch></IfModule># END Cache-Control Headers
CACHING STRATEGIESSTEP FOUR
CACHING STRATEGIES
CONTENT DELIVERY NETWORK
▸ Cloudflare
▸ …
CACHING STRATEGIES
CACHING TECHNIQUES
▸ Memcached
▸ Redis
▸ Varnish
CACHING STRATEGIES
CACHING TECHNIQUES
▸ Memcached
▸ Redis
▸ Varnish
OBJECT CACHE
REVERSE PROXY
SO WHAT TECHNIQUE DO YOU CHOOSE?
CACHING STRATEGIES
IDEAL SETUP
VARNISH REDIS
CACHING STRATEGIES
IDEAL SETUP
VARNISH REDIS
CACHING STRATEGIES
IDEAL SETUP
VARNISH REDIS
FRONT-END
CACHING STRATEGIES
IDEAL SETUP
VARNISH REDIS
FRONT-END QUERIES
WHY REDIS AND NOT MEMCACHED?
CACHING STRATEGIES
WHY I PREFER REDIS
▸ Values up to 512MB in size (memcached limited to 1MB per key)
▸ Supports much more programming languages
QUESTIONS?
THANK YOU!I’LL TWEET THE LINK TO THE SLIDES ON
@BRECHTRYCKAERT