UPDATED: How I improved my website page load speed

Back in February I posted all the steps I had taken to dramatically increase my website’s page load speed. Since then I have been doing more research and more tweaking and I have even increased my page load speed even further.

There are trade offs I had to make in my latest round of improving my page load speed. For example I want to track analytics using Google Analytics but including this code causes a hit to my page load speed. There are other trade offs that I will discuss each one.

Where I Was Before

If you have not read my initial post about improving my page load speed you should read it first. I give you the exact steps I took initially. This post is a continuation from that one.

From my last post here are my final stats which become my starting stats for this post.
Google PageSpeed Insights

GTMetrix

Pingdom

I have been able to improve my page load performance even more.

Eliminate Render Blocking Javascript and CSS in Above the Fold Content

One item that I am dinged on in Google PageSpeed Insights and in Pingdom was render blocking Javascript and CSS. Rendering is just technical speak for “when the page is loading in the browswer.”

I am using the W3TotalCache plugin along with MaxCDN. The combination of these two have greatly improved my page load speed.

I was able to go into W3TotalCache and modify it to address every Javascript and CSS file that Google PageSpeed identifies as a problem.

Here are the steps that I took to eliminate render blocking Javascript and CSS:

• Get a list of every Javascript file and CSS that is show in Google PageSpeed Insights
• Go to W3TotalCache plugin and open the Performance Tab. From there click on General Settings

• Click on Minify in top menu OR scroll down to the Minify section. You need to enable minify and make sure all settings are configured as below:

• Make sure to save settings once you have made the change.
• Next navigate to the PerformanceTab and click on Minify

• Click on JS in top menu OR scroll down to the JS section
• Enable the JS Minify section. In the Operation in Area section set the Before to Minify and Non-Blocking using “async” in embed type. Your settings should like below:

• You will need your list of every Javascript and CSS file listed in Google PageSpeed Insights for this next step.
• Scroll down to the JS File Management section. Make sure the drop down box is pointing to your currently active WordPress theme as shown below:

• Next you will need to add every Javascript file listed from Google PageSpeed Insights. Click on add script and enter the URL of the Javascript file. Continue adding to you have added every Javascript file listed. Here is what my settings look like:

• Next you are going to add all CSS files. Scroll down to the CSS section.
• Enable the CSS Minify settings. Set the @import handling to Buble. Make sure you theme is selected in the dropdown for CSS File Management. Your settings should look like this:

• You are now going to add every CSS file listed from Google PageSpeed Insights. Enter the URI and click on verify URI button to make sure you have entered the correct and full path. Here is what my CSS files looks like:

• Make sure you save settings when you are finished.

 

After making these changes I went back and tested my website on all 3 testing platforms. Here are the improved results:

Google PageSpeed Insights

 

GT Metrix

Pingdom

 

When compared to February my page load speed has increased in 2 out of 3 tests.

For Google PageSpeed I was able to increase from a 91 to a 93.

For GT Metrix I was able to increase my Page Speed Grade from a 96 to a 97 and my YSlow Grade from an 87 to a 90. I was also able to lower the number of requests from 29 to 19.

For Pingdom my score declined from 96 to 92. But my number of requests declined from 45 to 19.

 

Trade Offs and How to Get Even More Speed

There are two things that I have implemented on my website that are impacting my page load speed. They are:

1. Google Analytics
2. Facebook Tracking Pixel

In my search to get the absolute fastest time possible for the load of my website I looked into removing both of these items because I got much better results.

Google Analytics allows me to track visitors to my website, keyword ranking and demographics.

Facebook tracking pixel tracks people who visit my website so that I can target just these people with a Facebook Ad.

Here are my results if I remove both of these from my website:

Google PageSpeed Insights

GT Metrix

Pingdom

Genesis Theme and Why I Won’t Use Them Again

In my initial post about improving my page load speed I talked about my results using the Genesis Theme and then switching to Thesis theme.

If you are not technical the Genesis theme is very easy to learn and to customize. For that reason it has a very large customer audience.

Thesis 2.0 theme on the other hand is NOT very easy to use if you are not technical. You will have a much steeper learning curve  to use this theme. But once you learn how to use it then you are able to customize it much more than you can with Genesis.

I recently received an email from StudioPress (the makers of Genesis theme) offering you the opportunity to greatly improve the speed of your genesis theme. The catch is they want you to pay them to make their theme load faster.

Here is a company that produces a good theme in Genesis. They realize that they can make improvements to the theme to make it faster. Instead of just implementing that into the product they decide to sell that to people that have already purchased the product.

To me that is a very poor business model. It is like selling someone a car and then saying you have to pay extra to put wheels on the car you already purchased.

It is a very good business model for StudioPress because they get you to pay $99.95 for the theme and then pay them in perpetuity $12/month to make the theme fast.

Compared to that the Thesis 2.0 theme costs $87.

If you hold onto your website for one year it would cost you $243.95 for Genesis vs $87 for Thesis 2.0.

If you want to use Genesis because of its ease of use then you should consider using MaxCDN. MaxCDN costs only $9/month vs $12 for the Genesis Accelerator.

Conclusion

As you can tell from the final tests, removing Google Analytics and Facebook Tracking Tool greatly improved my page speed time and my scores.

My GT Mextrix Page Speed Grade remained the same at 97 but my YSlow Grade dramatically improved from a 90 to a 98!

My Pingdom requests dropped from 19 to 9.

Compared to where I as in February you see a tremendous improvement in my page load speed time. It shows that if you make an effort you can greatly improve your websites page load speed.

For myself I will probably toggle on and off the Facebook tracking pixel. I will turn back on Google Analytics because I want to have this information available to me.

My recommendation is that you utilized W3TotalCache plugin with MaxCDN on your website. The W3TotalCache plugin is free. MaxCDN starts at less than $10/month. I think it is well worth the cost when you consider the improvements you get from MaxCDN.