Maximizing Performance and Speeding Up WordPress

6,787 views
6,693 views

Published on

Syed Balkhi shows how to speed up your slow WordPress.

Talk delivered May 21st at WordCamp Raleigh.

Published in: Education, Technology, Business

Maximizing Performance and Speeding Up WordPress

  1. 2. So let’s speed it up
  2. 3. I’m Syed Balkhi <ul><li>Founder of WPBeginner, Uzzz Productions, Awesome Motive Inc., and more to come . </li></ul>
  3. 4. Why Performance Matters <ul><li>Decreases Bounce Rate </li></ul><ul><li>Increase Time Spent on the Page </li></ul><ul><li>Often increases pageviews </li></ul><ul><li>SEO Benefits </li></ul><ul><ul><li>Increases Indexing Rate </li></ul></ul>
  4. 5. Our #1 Problem <ul><li>Hosting Providers </li></ul><ul><ul><li>Memory Usage Limits on Shared Hosts </li></ul></ul><ul><ul><li>Potential of Account Termination if you exceed limits. </li></ul></ul><ul><ul><li>Most importantly site crashes during peak times (such as hitting front page of Digg or other social media networks) thus hurting your brand’s reputation. </li></ul></ul>
  5. 6. Solution(s)?? <ul><li>Getting a better and more reliable webhost </li></ul><ul><li>Install Caching Methods </li></ul><ul><li>Content Delivery Networks (CDN) </li></ul><ul><li>Minify </li></ul><ul><li>Database Maintenance </li></ul><ul><li>Limiting HTTP Queries </li></ul><ul><li>Proper 3rd Party Integrations </li></ul>
  6. 12. I recommend MaxCDN They were kind enough to give a 25% coupon code: wpbeginner
  7. 14. Best Caching Plugin is: W3 Total Cache
  8. 15. Decrease Page Size <ul><li>Use Excerpts instead of Full Posts. </li></ul><ul><li>Show a maximum of 10 posts per page. </li></ul><ul><li>User smaller images (optimize them) - use Smush.it </li></ul>
  9. 16. Database Maintenance
  10. 19. Limiting HTTP requests
  11. 20. Plugins are Great, But... <ul><li>They can increase your site’s load time when they add custom stylesheet(s) and JavaScript(s). </li></ul><ul><li>One or two plugin does not mater, but when you have 8 plugins, each adding a CSS and JS file, you got yourself 16 HTTP requests which can/should be limited. </li></ul>
  12. 22. Oops, the theme is broken
  13. 23. Yes, I know so lets FIX it.
  14. 24. Merging CSS Files <ul><li>Copy the plugin’s CSS file, and paste it in your theme’s style.css file. </li></ul><ul><li>So in this case, we will copy “cleaner-gallery.css” file and paste it into our theme’s style.css file. </li></ul><ul><li>Repeat this STEP for all plugins that are adding additional CSS files. </li></ul>
  15. 25. In a Perfect World
  16. 28. Proper 3rd Party Integrations
  17. 29. Facebook the right way
  18. 30. Enable XFBML Support http://wordpress.org/extend/plugins/facebook-open-graph-meta-in-wordpress/
  19. 31. Asynchronous Loading < body > < div id = &quot;fb-embed&quot; ></ div > < script > window.fbAsyncInit = function() { FB.init({appId: 'XXXXXXXXXXXXXXX', status: true, cookie: true, xfbml: true}); }; (function() {      var e = document.createElement('script'); e.async = true;      e.src = document.location.protocol +      '//connect.facebook.net/en_US/all.js';      document.getElementById('fb-embed').appendChild(e);      }()); </ script >
  20. 32. Analytics the right way
  21. 33. Asynchronous Loading < body > < script > var _gaq = _gaq || []; _gaq.push(      ['_setAccount', 'UA-XXXXX-X'],      ['_setDomainName', 'domain.com'],      ['_trackPageview'] ); (function() {var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;ga.src = ('https:' == document.location.protocol ? ' https://ssl ' : ' http://www ' ) + '.goog le-analytics.com/ga.js';document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(ga);})(); </ script >
  22. 34. Don’t forget the BASICS
  23. 35. Add scripts in the footer
  24. 36. Update Core & Plugins REGULARLY
  25. 37. Tools to check Performance <ul><li>Yahoo YSlow </li></ul><ul><li>Google Page Speed </li></ul><ul><li>Pingdom Tools </li></ul>
  26. 38. Additional Resources <ul><li>http://www.wpbeginner.com/wp-tutorials/how-wordpress-plugins-affect-your-sites-load-time/ </li></ul><ul><li>http://codex.wordpress.org/Conditional_Tags </li></ul><ul><li>http://www.wpbeginner.com/plugins/how-to-install-and-setup-w3-total-cache-for-beginners/ </li></ul><ul><li>http://www.tutorial9.net/web-tutorials/wordpress-caching-whats-the-best-caching-plugin/ </li></ul><ul><li>http://www.wpbeginner.com/wp-tutorials/18-useful-tricks-to-speed-up-wordpress-boost-performance/ </li></ul><ul><li>http://line25.com/articles/wordpress-fat-loss-diet-to-speed-up-ease-load </li></ul><ul><li>http://www.hongkiat.com/blog/ultimate-guide-to-web-optimization-tips-best-practices/ </li></ul><ul><li>http://www.w3-edge.com/weblog/2011/02/optimize-social-media-button-performance/ </li></ul>
  27. 39. I’m Syed Balkhi <ul><li>Founder of WPBeginner, Uzzz Productions, Awesome Motive Inc., and more to come. </li></ul><ul><li>Twitter: @wpbeginner / @syedbalkhi </li></ul><ul><li>Facebook: http://facebook.com/wpbeginner </li></ul><ul><li>Email: [email_address] </li></ul>

×