WordPress Performance optimization

46
WORDPRESS PERFORMANCE TWEAKING BRECHT RYCKAERT

Transcript of WordPress Performance optimization

Page 1: WordPress Performance optimization

WORDPRESS PERFORMANCE TWEAKING

BRECHT RYCKAERT

Page 2: WordPress Performance optimization

“WordPress Expert” @ combell.com

I blog at brechtryckaert.com

Author “WordPress Security 101”

Proud dad of Fleur!

BRECHT RYCKAERT

Page 3: WordPress Performance optimization

LET ME TELL YOU A STORY ABOUT A CRICKET AND AN ANT…

Page 4: WordPress Performance optimization
Page 5: WordPress Performance optimization

IN MANY WAYS… WE’RE THE CRICKET WHEN LAUNCHING A NEW WORDPRESS SITE…

Page 6: WordPress Performance optimization

MORE RAM & CPU =/= A MUCH FASTER SITE

MISCONCEPTION:

Page 7: WordPress Performance optimization

PUT IN THE WORK AND YOU WILL GET YOU A FAST SITE!

BE THE ANT…

Page 8: WordPress Performance optimization

ANALYZE THE SITESTEP ONE

Page 9: WordPress Performance optimization

“YES… THIS SEEMS TO BE AN ACUTE CASE OF SLUGGISHNESS IN YOUR WORDPRESS”

Page 10: WordPress Performance optimization

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,…)

Page 11: WordPress Performance optimization
Page 12: WordPress Performance optimization
Page 13: WordPress Performance optimization
Page 14: WordPress Performance optimization

ANALYZE THE SITE

IDEAL VALUES

▸ 30 to 50 elements -> concurrent browser connections

▸ 0 to 1.5 MB in size

▸ Less is more

Page 15: WordPress Performance optimization
Page 16: WordPress Performance optimization
Page 17: WordPress Performance optimization
Page 18: WordPress Performance optimization
Page 19: WordPress Performance optimization

ANALYZE THE SITE

WAYS TO IMPROVE LOADING SPEED

▸ Domain sharding

▸ CSS-sprites (http://css-tricks.com/css-sprites/)

Page 20: WordPress Performance optimization

OPTIMIZE WORDPRESSSTEP TWO

Page 21: WordPress Performance optimization

OPTIMIZE WORDPRESS

SLOW INITIAL GET?

▸ Usually points towards too many queries

▸ Fix: limit or reduce the number of queries

Page 22: WordPress Performance optimization

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!

Page 23: WordPress Performance optimization

OPTIMIZE WORDPRESS

OPTIMIZE IMAGES

▸ wp smush it

▸ Reduce the size of images (new and already added images)

Page 24: WordPress Performance optimization

OPTIMIZE WORDPRESS

CACHING PLUGINS

▸ W3 Total Cache

▸ WP Super Cache

▸ WP Rocket

▸ WP Faster Cache

▸ …

Page 25: WordPress Performance optimization

OPTIMIZE WORDPRESS

MY PLUGIN OF CHOICE

Page 26: WordPress Performance optimization

“YOU KNOW THAT’S A SECURITY PLUGIN, RIGHT?”

Page 27: WordPress Performance optimization
Page 28: WordPress Performance optimization

OPTIMIZE WORDPRESS

MY PLUGIN OF CHOICE

▸ Proof by Mattias Geniar:https://ma.ttias.be/benchmarking-the-performance-of-wordfence-a-wordpress-plugin/

Page 29: WordPress Performance optimization

SERVER SIDE TWEAKS STEP THREE

Page 30: WordPress Performance optimization

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

Page 31: WordPress Performance optimization

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

Page 32: WordPress Performance optimization

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>

Page 33: WordPress Performance optimization

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

Page 34: WordPress Performance optimization

CACHING STRATEGIESSTEP FOUR

Page 35: WordPress Performance optimization

CACHING STRATEGIES

CONTENT DELIVERY NETWORK

▸ Cloudflare

▸ …

Page 36: WordPress Performance optimization

CACHING STRATEGIES

CACHING TECHNIQUES

▸ Memcached

▸ Redis

▸ Varnish

Page 37: WordPress Performance optimization

CACHING STRATEGIES

CACHING TECHNIQUES

▸ Memcached

▸ Redis

▸ Varnish

OBJECT CACHE

REVERSE PROXY

Page 38: WordPress Performance optimization

SO WHAT TECHNIQUE DO YOU CHOOSE?

Page 39: WordPress Performance optimization

CACHING STRATEGIES

IDEAL SETUP

VARNISH REDIS

Page 40: WordPress Performance optimization

CACHING STRATEGIES

IDEAL SETUP

VARNISH REDIS

Page 41: WordPress Performance optimization

CACHING STRATEGIES

IDEAL SETUP

VARNISH REDIS

FRONT-END

Page 42: WordPress Performance optimization

CACHING STRATEGIES

IDEAL SETUP

VARNISH REDIS

FRONT-END QUERIES

Page 43: WordPress Performance optimization

WHY REDIS AND NOT MEMCACHED?

Page 44: WordPress Performance optimization

CACHING STRATEGIES

WHY I PREFER REDIS

▸ Values up to 512MB in size (memcached limited to 1MB per key)

▸ Supports much more programming languages

Page 45: WordPress Performance optimization

QUESTIONS?

Page 46: WordPress Performance optimization

THANK YOU!I’LL TWEET THE LINK TO THE SLIDES ON

@BRECHTRYCKAERT