Is your Website Fast Enough?

WordPress is a fantastic web tool that helps people get up and running with a functional website as soon as possible. But the hassle-free install comes with a few downsides. One of them is Render blocking Javascript and CSS. This is code that is built into WordPress themes and plugins that slow down your website.

WordPress can be flashy or bare based on the requirement. However, as is the law of nature, flashy comes with a price: Speed. We all want the latest in parallel parallax web technologies boasting of animations that jump out of screens. But with all that fancy graphics comes the burden of rendering. Now we could solve the problem by taking out all the JS and CSS, but then our website will look like it went back to the stone age in a time machine. What we need is something that maintains a magic balance between two crucial aspects of a modern website:

                      User experience                                    Speed

And today at Dotcord Tutorials, we will be showing you the best compromise we could find. We’re talking about Autoptimize.

Autoptimize is a WordPress plugin which helps to optimize JS and CSS code that slows down page renders. In other words, there are some parts of your website that are slow to load, in turn slowing down your entire website. We can almost see that imaginary person taking the three seconds of attention span to try and open your website before pronouncing judgement on how “it sucks”. We have to face facts; the internet is a brutal place where a bad website just sinks to the bottom of the digital ocean like the Titanic, only available to brave explorers. Also, don’t forget Google. Everyone types ‘google’ in google and then the websites name. And Google rewards faster sites by placing them higher on the search list.

Got a feeling of hopelessness? Scared your website is not good enough? We can help make it better, and here’s how.

First, we need to make a stop at Google’s Pagespeed Insights. Here is a demo website we tested this plugin on.

The beauty of the Internet is never seen so clearly as when it points out what a bad job you’ve done. We can see here a mobile and desktop report stating that our website scores 51 and 58 points out of 100 respectively. The page also suggests some optimizations that might improve the speed of our website. Today we will focus on the third one; eliminating render-blocking JavaScript and CSS in above-the-fold content.

Let’s get started by logging into our WordPress dashboard.

Then head on over to the plugin menu and click on “Add New”.

In the top right there is a search bar; type “Autoptimize” in there. Click on the install button and wait a couple of seconds. After the installation don’t forget to activate the plugin.

Now go to the installed plugins page and find Autoptimize in the list. Below it is the settings link.

Clicking on it will bring up the options page to enable HTML, JS and CSS optimizations. Make sure that all the checkboxes are ticked. Scroll down and hit the “Save changes and Empty Cache” button.

And you’re done. Conduct a new Google Pagespeed Test to see if there is any improvement.

The changes might take a few minutes to show results, so don’t freak out if nothing happens. However, if after a day or two nothing changes, drop us a comment below to let us know. We hope this helps and all the best!