SlideShare a Scribd company logo

WordPress at Peak Performance (Radio Edit)

•
•
J
jaredwsmith

Jared Smith presented tips for optimizing WordPress performance. He recommends first getting the most out of existing resources through caching plugins and settings, which can improve page speeds and reduce server load. Frontend optimizations like minifying files, lazy-loading scripts, and using a content delivery network can further boost performance. For high-traffic sites, moving to managed WordPress hosting or a virtual private server provides more control and flexibility compared to shared hosting. Ongoing measurement using tools like YSlow and PageSpeed Insights helps identify remaining bottlenecks.

1 of 24
Download to read offline
Jared Smith, BoomTown @jaredwsmith WordPress at Peak Performance Originally presented at WordPress Charleston’s August 2013 meeting; revised May 2014 for WordCamp Charleston
Why Do We Care? • Nobody likes a slow site — you want people to come back, right? • Conserving resources = less money spent on server horsepower • Google takes site speed into consideration for Web searches
First, Get The Most Out of What You’ve Got
Cache Rules Everything Around Me • Your web server can and should tell the browser how to cache things like images, scripts, and CSS stylesheets if you configure it to do so • Less of an issue if using a content delivery network…more on that later!
Good Cache Practices • Set far-future expires headers on images, stylesheets, and scripts. ‘Expires’ headers tell the browser how long to hold onto an object; setting these headers further into the future help browsers hold onto this content longer. • Check Cache-Control headers. These headers instruct the browser on how to cache assets it downloads; you can fine-tune these for specific situations as well. • Set Entity Tags (ETags). ETags can help identify versions of an asset to help ensure content freshness. Plugins like W3 Total Cache can help set these for you, so no monkeying around with the web server is necessary!
Caching plugins WordPress can be tuned to do a lot less work to serve up pages, conserving resources on your server and helping you get more mileage out of it. Caching plugins are a great way to easily accomplish this. • WP Super Cache is a great start for full-page caching and works fairly well on most shared hosts; it’s easy to configure and typically trouble-free; http://wordpress.org/plugins/wp-super-cache/ • W3 Total Cache is the most comprehensive; you can get a lot out of it especially on a VPS or dedicated server, but it requires fine-tuned configuration; http://wordpress.org/plugins/w3-total-cache/ Never, ever, ever run two caching plugins at the same time! You’ll shoot yourself in the foot.
Tuning W3 Total Cache • On shared hosts, there’s not typically much you can do. Disk (enhanced) caching for pages will get you some gains. • For those of you with Virtual Private Servers (VPS) or dedicated machines, use APC where you can to store things like the object cache and database cache, but watch that memory usage if you’re on a low-memory VPS. • W3 Total Cache can integrate with many content delivery networks including CloudFront and MaxCDN (more on CDN in a few) • Ensure browser caching options are enabled • Installation guide: http://wordpress.org/plugins/w3-total-cache/installation/ One size does not fit all. Certain use cases will require different caching strategies, so be sure to test and experiment as needed!
Frontend Optimization • Tuning the server and caching WordPress is great, but if you are loading jQuery three times... • Check for and deactivate any plugins you don’t use -- these often litter every page load with scripts, some unnecessary • Make sure plugins and themes are using wp_enqueue_script to load JavaScript; this ensures WordPress only loads certain scripts once
Mind Your Scripts and Styles • Generally, most scripts should load at the footer of the page. Loading scripts in the header or body (with the exception of a few, notably Google Analytics) can block page load • Don’t use inline CSS if you can at all help it • Minify your CSS and JavaScript files; W3 Total Cache can do this • Make sure gzip compression is turned on to reduce the amount of bandwidth you use; again, W3 Total Cache makes this easy to take care of • Test your site’s frontend with tools like YSlow (http:// developer.yahoo.com/yslow/) and Google Page Speed (https:// developers.google.com/speed/pagespeed/)
Content Delivery Networks (CDNs) • Content delivery networks are a special kind of cache, most often used for static assets such as scripts, styles, and images, that distribute your content over several nodes in different locations • Properly configured CDNs will route traffic to the closest server, geographically speaking, eliminating as much latency as possible
CDN Services • Photon; part of Jetpack, free to use: distributes your media library images over WordPress.com’s CDN, but it does not distribute your theme files. http://wordpress.org/plugins/ jetpack/ • MaxCDN: Well supported by W3 Total Cache and overall in the WordPress community. Many large blogs use MaxCDN and costs are reasonable (using flat monthly fees). http:// www.maxcdn.com • Amazon CloudFront: Distribute your static files over Amazon’s network; costs are reasonable but aren’t flat -- you pay for the bandwidth you use. http://aws.amazon.com/cloudfront/
A Few Other Items… • Cut back on how much you write to your access and error logs to reduce disk I/O (if at all possible, anyway) • Make sure you have a favicon — 404s are expensive! • Speaking of 404s, make sure you comb your site occasionally for broken links or broken images
Where You Host Matters Or: Eventually, You’ll Need To Upgrade
The Pitfalls of Shared Hosts • Shared hosts are great inexpensive ways to get started with self-hosted WordPress • But apply some substantial traffic…and you quickly realize that you’re getting what you pay for. • It’s called shared hosting for a reason: you share a server with many, many other sites. If one makes, say, the front page of Reddit, it’s like everyone did
A Few Upgrade Paths
Managed WordPress Hosting • They take care of (most) of the technical stuff for you! • Often no caching plugins to deal with, other benefits such as a content delivery network (CDN) for your static assets
Popular Managed Hosts • WordPress.com is the most popular hosted service • WPEngine: Managed WordPress hosting that gives much more flexibility than WordPress.com. Pricing tiered by bandwidth usage. http:// www.wpengine.com • DreamPress: New service from DreamHost geared directly toward WordPress hosting. Pricing flat at $19.95/mo. http://dreamhost.com
Virtual Private Servers • Your own private slice of a larger server • Many VPS hosts give direct access to the server for maximum flexibility • Some VPS hosts come with a control panel similar to shared hosts; others leave you to your own devices • In many cases, very painless to scale up and down as your traffic and/or budget require
VPS Providers • Many hosts with shared plans also have VPS plans: DreamHost, HostGator are two I’ve used • Linode, DigitalOcean: Serious VPS for geeks — not a lot of hand-holding but tremendous flexibility
Dedicated Servers • For the highest traffic cases (and the budgets to match) • A well-configured VPS can stave off the need for a dedicated server for quite some time • Rackspace, Softlayer and even DreamHost and HostGator offer dedicated server plans
Measure!
Tools for Measurement • YSlow - The gold standard for measuring site performance. Plugs into Firefox and Chrome, tests your site for potential pitfalls, and gives you a grade. • Google Page Speed - Google’s page grade service works similarly to YSlow. Integrates into Google Analytics. • New Relic - measures app performance on the server side as well as in the browser • Catchpoint - even more advanced! will periodically hit pages you define and generate pretty waterfall graphs to show you where your bottlenecks are
Questions?
Jared Smith jared@jaredwsmith.com http://jaredwsmith.com http://boomtownroi.com ! Twitter: @jaredwsmith

More Related Content

WordPress at Peak Performance (Radio Edit)

  • 1. Jared Smith, BoomTown @jaredwsmith WordPress at Peak Performance Originally presented at WordPress Charleston’s August 2013 meeting; revised May 2014 for WordCamp Charleston
  • 2. Why Do We Care? • Nobody likes a slow site — you want people to come back, right? • Conserving resources = less money spent on server horsepower • Google takes site speed into consideration for Web searches
  • 3. First, Get The Most Out of What You’ve Got
  • 4. Cache Rules Everything Around Me • Your web server can and should tell the browser how to cache things like images, scripts, and CSS stylesheets if you configure it to do so • Less of an issue if using a content delivery network…more on that later!
  • 5. Good Cache Practices • Set far-future expires headers on images, stylesheets, and scripts. ‘Expires’ headers tell the browser how long to hold onto an object; setting these headers further into the future help browsers hold onto this content longer. • Check Cache-Control headers. These headers instruct the browser on how to cache assets it downloads; you can fine-tune these for specific situations as well. • Set Entity Tags (ETags). ETags can help identify versions of an asset to help ensure content freshness. Plugins like W3 Total Cache can help set these for you, so no monkeying around with the web server is necessary!
  • 6. Caching plugins WordPress can be tuned to do a lot less work to serve up pages, conserving resources on your server and helping you get more mileage out of it. Caching plugins are a great way to easily accomplish this. • WP Super Cache is a great start for full-page caching and works fairly well on most shared hosts; it’s easy to configure and typically trouble-free; http://wordpress.org/plugins/wp-super-cache/ • W3 Total Cache is the most comprehensive; you can get a lot out of it especially on a VPS or dedicated server, but it requires fine-tuned configuration; http://wordpress.org/plugins/w3-total-cache/ Never, ever, ever run two caching plugins at the same time! You’ll shoot yourself in the foot.
  • 7. Tuning W3 Total Cache • On shared hosts, there’s not typically much you can do. Disk (enhanced) caching for pages will get you some gains. • For those of you with Virtual Private Servers (VPS) or dedicated machines, use APC where you can to store things like the object cache and database cache, but watch that memory usage if you’re on a low-memory VPS. • W3 Total Cache can integrate with many content delivery networks including CloudFront and MaxCDN (more on CDN in a few) • Ensure browser caching options are enabled • Installation guide: http://wordpress.org/plugins/w3-total-cache/installation/ One size does not fit all. Certain use cases will require different caching strategies, so be sure to test and experiment as needed!
  • 8. Frontend Optimization • Tuning the server and caching WordPress is great, but if you are loading jQuery three times... • Check for and deactivate any plugins you don’t use -- these often litter every page load with scripts, some unnecessary • Make sure plugins and themes are using wp_enqueue_script to load JavaScript; this ensures WordPress only loads certain scripts once
  • 9. Mind Your Scripts and Styles • Generally, most scripts should load at the footer of the page. Loading scripts in the header or body (with the exception of a few, notably Google Analytics) can block page load • Don’t use inline CSS if you can at all help it • Minify your CSS and JavaScript files; W3 Total Cache can do this • Make sure gzip compression is turned on to reduce the amount of bandwidth you use; again, W3 Total Cache makes this easy to take care of • Test your site’s frontend with tools like YSlow (http:// developer.yahoo.com/yslow/) and Google Page Speed (https:// developers.google.com/speed/pagespeed/)
  • 10. Content Delivery Networks (CDNs) • Content delivery networks are a special kind of cache, most often used for static assets such as scripts, styles, and images, that distribute your content over several nodes in different locations • Properly configured CDNs will route traffic to the closest server, geographically speaking, eliminating as much latency as possible
  • 11. CDN Services • Photon; part of Jetpack, free to use: distributes your media library images over WordPress.com’s CDN, but it does not distribute your theme files. http://wordpress.org/plugins/ jetpack/ • MaxCDN: Well supported by W3 Total Cache and overall in the WordPress community. Many large blogs use MaxCDN and costs are reasonable (using flat monthly fees). http:// www.maxcdn.com • Amazon CloudFront: Distribute your static files over Amazon’s network; costs are reasonable but aren’t flat -- you pay for the bandwidth you use. http://aws.amazon.com/cloudfront/
  • 12. A Few Other Items… • Cut back on how much you write to your access and error logs to reduce disk I/O (if at all possible, anyway) • Make sure you have a favicon — 404s are expensive! • Speaking of 404s, make sure you comb your site occasionally for broken links or broken images
  • 13. Where You Host Matters Or: Eventually, You’ll Need To Upgrade
  • 14. The Pitfalls of Shared Hosts • Shared hosts are great inexpensive ways to get started with self-hosted WordPress • But apply some substantial traffic…and you quickly realize that you’re getting what you pay for. • It’s called shared hosting for a reason: you share a server with many, many other sites. If one makes, say, the front page of Reddit, it’s like everyone did
  • 15. A Few Upgrade Paths
  • 16. Managed WordPress Hosting • They take care of (most) of the technical stuff for you! • Often no caching plugins to deal with, other benefits such as a content delivery network (CDN) for your static assets
  • 17. Popular Managed Hosts • WordPress.com is the most popular hosted service • WPEngine: Managed WordPress hosting that gives much more flexibility than WordPress.com. Pricing tiered by bandwidth usage. http:// www.wpengine.com • DreamPress: New service from DreamHost geared directly toward WordPress hosting. Pricing flat at $19.95/mo. http://dreamhost.com
  • 18. Virtual Private Servers • Your own private slice of a larger server • Many VPS hosts give direct access to the server for maximum flexibility • Some VPS hosts come with a control panel similar to shared hosts; others leave you to your own devices • In many cases, very painless to scale up and down as your traffic and/or budget require
  • 19. VPS Providers • Many hosts with shared plans also have VPS plans: DreamHost, HostGator are two I’ve used • Linode, DigitalOcean: Serious VPS for geeks — not a lot of hand-holding but tremendous flexibility
  • 20. Dedicated Servers • For the highest traffic cases (and the budgets to match) • A well-configured VPS can stave off the need for a dedicated server for quite some time • Rackspace, Softlayer and even DreamHost and HostGator offer dedicated server plans
  • 22. Tools for Measurement • YSlow - The gold standard for measuring site performance. Plugs into Firefox and Chrome, tests your site for potential pitfalls, and gives you a grade. • Google Page Speed - Google’s page grade service works similarly to YSlow. Integrates into Google Analytics. • New Relic - measures app performance on the server side as well as in the browser • Catchpoint - even more advanced! will periodically hit pages you define and generate pretty waterfall graphs to show you where your bottlenecks are