While we were building our new site, we noticed that the site got slower and slower as we added the necessary functionality. This is a common problem with WordPress because the more you tap into it’s true potential and begin adding plugins, custom post types, page templates, etc. the database bulks up and more requests are made which causes the site to slow down significantly. The problem gets much more exasperated as you get more and more traffic. Since we spent so much time finding the best ways to speed up the site, we wanted to share some of the best methods we’ve found for fixing the problem.

First – Test Your Site

Use Google PageSpeed Insights and Pingdom Tools to see where the choke-points in your site’s loading process are. These will give you some practical tips to start the slimming process and show you how many resources are being loaded as well as which ones are causing the most pain. Use the results from these tools as the basis in deciding what to take away.

Ensure gzipping is activated 

If you choose not to use W3 Total Cache (below), enable gzipping on your site. This basically compresses files significantly if your server has it enabled. You can activate it by putting the following snippet in your .htaccess file:

[cc]

#Gzip
<ifmodule mod_deflate.c>
AddOutputFilterByType DEFLATE text/text text/html text/plain text/xml text/css application/x-javascript application/javascript text/javascript
</ifmodule>
#End Gzip

[/cc]

Use W3 Total Cache

This excellent plugin leverages caching to bring down the number of required requests on your site. Find it here.

Disable all unused plugins

Most plugins will load stylesheets and scripts on the front end on all pages, even if they’re not being used. Disabling these plugins until you need them will cut down on the amount of requests being made, which is one of the best ways to speed up any site. If you can’t disable a plgin because you’re

Stop Plugins from loading unnecessary files

As we mentioned above, plugins will often load unnecessary stylesheets and scripts on pages where the plugin isn’t doing anything. This slows down a site significantly with absolutely no good reason. For this, we found an excellent snippet from position:relative;. (Thank you Debbie Campbell!)

[cc lang=”php”]

add_action( ‘wp_print_styles’, ‘my_deregister_styles’, 100 );
function my_deregister_styles() {
if ( !is_page(’40’) ) {
wp_deregister_style( ‘contact-form-7’ ); // Contact Form 7
wp_deregister_style( ‘contact-form-7-rtl’ );
wp_deregister_script(‘wpcf7_enqueue_scripts’);
wp_deregister_script(‘contact-form-7’);
}
}

[/cc]

The method employed here uses a wp_deregister item to stop the scripts and styles from loading before they even have a chance. You simply have to find the name of the file being loaded and name it with the appropriate call. Then identify the page that you DO want the files loaded on and name it with the “!” declaration before it. Test and repeat for any other plugins you need to revise.

If using a responsive theme, reduce the requests being made to your CSS

Depending on which method you’re using for your responsive code, you can greatly reduce the server load and amount of files needed. If you’re using @media queries within your spreadsheet, group them all at the bottom and reduce the number of queries to the bare minimum. This should reduce the overall file size and the amount of time the site takes to adjust to the new breakpoint. If you’re using separate stylesheets for your breakpoints, I recommend Scott Jehl’s eCSSential. it’s an excellent tool that will only load the proper stylesheet and speed up the loading process to reduce FOUC.

These methods all take a little time to implement, but will increase your conversion, increase over user experience, and help your search engine rankings. It’s well worth it!

Back to Blog