8. What the heck does a serial hobbyist,
karaoke-singing culinary guy know
about WordPress?
9. Director of Web
Development and
Agile Product Owner
for A2 Hosting
We spend a lot of time on making
WordPress better for our customers!
Ask me about Agile/Scrum!
10. From the Perspective of a Hosting
Company…
A high percentage of our current and new customers are
WordPress users, and the number keeps rising
Being on the hosting end, we can dig into common
performance issues MUCH deeper because we know our web
servers inside and out
The very high percentage of WordPress related support
requests that we receive are performance related, so we’ve
looked at many different ways to improve performance
12. How many of you…
Have attempted to optimize your WP Site?
Have installed/configured a caching plugin?
Know what a CDN is?
Have added configurations to an .htaccess file
Are running your own server (VPS/dedicated/cloud) ?
14. Some statistics…
40% of people abandon a website that takes more
than 3 seconds to load
A 1 second delay in page response can result in a 7%
reduction in conversions
If an e-commerce site is making $100,000 per day, a
1 second page delay could potentially cost you $2.5
million in lost sales every year
Source: https://blog.kissmetrics.com/loading-time/
15. Bottom line…
A poorly optimized website can cost you real $$ in
support and hosting costs
By diving into performance and optimization, you’ll
learn more about WordPress, and more about web
systems and infrastructure
By becoming a performance expert, you’ll be able to
deliver a much more reliable, robust product to your
customers!
17. Performance Measurement Tools
Gtmetrix.com – my favorite!
Free
Easy to use/understand
Has a WordPress Plugin
WebPageTest.org
Also Free
Lots of great detailed information
LoadImpact.com
Free + Paid plans
Simulates multiple, concurrent users hitting your site
18. What Measurements Matter?
Page Load Time
Most representative of the customer experience
Best “overall” performance metric
Total Page Size
Good to keep an eye on this for major problems such
as
Uncompressed images
High-resource themes/plugins
21. Areas of Focus for Performance
Optimizations within WordPress
Our Web Server Environment
External Services
22. Optimizations within WordPress
Clean house!
Get rid of unused themes/plugins/etc.
Don’t just deactivate… DELETE
Be sure everything is up-to-date
Most recent WordPress version
Plugins are all updated to latest version
24. Optimizations within WordPress
Utilize a Caching Plugin
W3 Total Cache or Fix-W3TC
Free and HIGHLY configurable
WP Rocket
Paid, but comes well-recommended
WP Super Cache
Robust and easy to use
28. With Caching, we skip a bunch of steps!
• File System
• PHP
• Database
29. Enable Caching – Results (Gtmetrix)
Before Caching
After Caching
30. 25 Concurrent Virtual Users
Using LoadImpact.com
No Caching: 1.5s Page Load Time Caching: 180ms Page Load Time
31. Optimizations within WordPress
Turn on Minification
Most caching plugins will have an option for this, but it
may not be enabled by default
You DO have to be careful, because Minification can
break some themes/plugins, YMMV
32. Minification – JQuery Before / After
Before
10,220 Lines
261KB File Size
After
3 (LONG) Lines
85KB File Size
~60%
Reduction
In size
33. Optimizations within WordPress
Turn on GZip Compression
Vast majority of hosts (especially shared hosts) support
GZip from the server level, it just needs to be enabled
Easily enabled via .htaccess rules
Most caching plugins will also have an option to
enable GZip compression
https://codex.wordpress.org/Output_Compression
34. Enable GZip – Results (Gtmetrix)
Before Gzip
After Gzip
35. Optimizations within WordPress
Optimize Images
Images are a significant amount of data that has to get
transferred from the server to the client
Compress them!
Before you upload
During upload with a plugin, such as WP Smush
37. Server-Side Optimizations for
WordPress
Add “Expires” headers for static content
This tells the user’s browser to cache static files locally
so they don’t have to transferred repeatedly
Done in either .htaccess or nginx config
Plugins like W3 Total Cache can help you do this,
though you may still need to edit an .htaccess or nginx
config file
38. Server-Side Optimizations for
WordPress
Switch Web Servers
Apache – most common, not as robust
Nginx – increasingly more common, way better at serving
up static files
LiteSpeed – licensed software, drop in replacement for
Apache, does well with high volume, concurrent traffic
39. Server-Side Optimizations for
WordPress
Switch Web Servers
To switch, typically need to be on your own server
(VPS/Dedicated/Cloud) OR you can find a host that
specifically offers hosting that uses one of the alternative
web servers
40. Server-Side Optimizations for
WordPress
Enable APC/OpCache
APC (for PHP < 5.5) or OpCache (for PHP 5.5 and greater)
reduces the amount of time it takes the server to process
PHP files
Few shared hosts have this enabled on their servers
Typically need to have a VPS or Dedicated server with APC
or OpCache Installed
Once enabled on the server, nothing to configure or turn
on in WordPress
42. What is a CDN?
(Content Delivery Network)
CDN Sits between the server and the client,
and handles serving up some/all of your files
CDN’s typically have a large infrastructure of
multiple servers located in strategic
geographic locations
43. What is a CDN?
(Content Delivery Network)
Benefits:
They can reduce the load on your server
They can shorten the distance (hops) it takes for
the client to get your data
They also can act as a protection tool for things
like DDoS (Distributed Denial of Service) attacks,
brute force attacks, and other attack vectors
48. Some Popular CDNs
CloudFlare
MaxCDN
CacheFly
Softlayer
More in the Codex:
https://codex.wordpress.org/WordPress_Optimization
#Use_a_content_Delivery_Network_.28CDN.29
49. The Downside of CDNs
To be effective they required DNS entry
changes
Typically also need to have a corresponding
WordPress plugin to talk to the CDN and
coordinate content updates
Depending on how much protection / caching
/ etc, can cost $$$
50. What all did we do to our test site?
Enabled GZip
Added Expires
Headers
Installed W3 Total
Cache
Turned on
Minification
Enabled CloudFlare
CDN
Utilized nginx
Enabled opCache
53. What’s up with that ‘C’ ?
If we wanted to further optimize, we could
bring these JS/CSS files local so they would
get Minified/GZipped
54. Look a little closer at our “After”
On a repeat view we are REALLY flying
Only 1 request needed
Under 1s load time
Bytes in: 16KB!
55. Final Thoughts
There are LOTS of options to optimize/gain
performance
You don’t have to do them all
Many people in the WordPress community
know how to help you with these
configurations
The Codex is your friend!
If that kitchen doesn’t look familiar go downstairs! I unfortunately had to cut my studies short when I moved to Michigan.
One of the nice things about working for a hosting company is that I, and my colleagues, get to know WordPress really well.
(talk through each step)
Talk through each step and explain how it is a much shorter process.
On the GTMetrix we can see a direct result in our page load time. It’s not huge, but my website also isn’t very complex, so it’s harder for us to see enormous improvements. The other thing to remember about caching, is that when it REALLY shines, is with concurrent website traffic. Let’s take a look!
Here’s where we really see the difference – this test was conducted with LoadImpact sending 25 users to my site over 5 minutes.
Jquery is a fairly common javascript library used in many frameworks and themes. If you compare the the full, development-ready version of Jquery against the same version run through minification, you can see the difference in size.
Here’s a before and after, you can see the direct results in both our PageSpeed and Yslow scores, but also the Total Page Size is reduced by about a third.
Without a CDN, every connection from the client is DIRECTLY to your server.
The first time we hit a page, we go through the whole cycle so the CDN can capture the content from your site.
The second time, the CDN can take over and serves up your content without even hitting your server. Occasionally the CDN will hit your server to check that it is still serving up valid content, and will update it’s internal cache if it detects a change. Also of note… there are many types of CDN’s, some of them work differently than others or have different subscription levels. For example, some CDN’s only serve up images and JS/CSS files, and it will still contact your server for the page content. This still saves resources on your server and speeds up the page loading time because we aren’t relying on our server to do all the work.
Now let’s say your CDN service also provides DDoS / Brute Force protection. In this case when a DDoS attack commences, the attack is absorbed by the CDN, and it only routes valid traffic back to the client. Why is this important for optimization? Because your site doesn’t go down!!
Where we really see a benefit is in the repeat view…