Blog

In this article you will learn about how you can improve performance of your website.For wordpress site performance improvements you must have knowledge of wordpress, plugins, css, javascript. Now we will discuss in details about optimization.

Step 1

Take Backup of code and database.

Step 2

Goto -> Google PageSpeed Insights is an online tool created by Google to help website owners optimize and test their websites. Check score in mobile and desktop.

Follow the Google resulting guidelines to improve speed and performance of your website. You are not required to follow these rules strictly.

3) Step 3: Fix Render Blocking Scripts and CSS with Autoptimize Plugin

First thing you need to do is install and activate the Autoptimize plugin
Upon activation, you need to visit the Settings » Autoptimize page to configure the plugin settings.

You can start by checking the box next to JavaScript Options and CSS Options and then click on the save changes button.

You can now test your website using PageSpeed tool. If there are still render blocking scripts, then you need to come back to the plugin’s settings page and click on ‘Show Advanced Settings’ button at the top.

Here you can allow plugin to include inline JS and remove scripts that are excluded by default like seal.js or jquery.js.

Next, scroll down to CSS option and allow plugin to aggregate inline CSS.

Click on the ‘Save changes and Empty Cache’ button to save your changes and empty plugin cache.

Once you are done, go ahead and check your website again with the PageSpeed tool.

Make sure that you thoroughly test your website to see that nothing is broken by optimizing your JavaScripts or CSS.

3) Step 4: Fix Render Blocking JavaScript using W3 Total Cache

First you will need to install and activate the W3 Total Cache plugin.

Next, you need to visit Performance » General Settings page and scroll down to Minify section.

First you need to check ‘Enable’ next to Minify option and then select ‘Manual’ for minify mode option.

Click on the save all settings button to store your settings.

Next, you need to add the scripts and CSS that you want to minify.

You can get the URLs of all the scripts and stylesheets that are render blocking from Google PageSpeed Insights tool.

Under the suggestions where it says: ‘Eliminate render-blocking JavaScript and CSS in above-the-fold content’, click on ‘Show how to fix’. It will show you the list of scripts and stylesheets.

Take your mouse over to a script and it will show you the full URL. You can select this URL and then use your keyboard’s CTRL+C (Command+C on Mac) keys to copy the URL.

Now head over to your WordPress admin area and go to Performance » Minify page.

First you need to add JavaScript files that you want to be minified. Scroll down to JS section and then under the ‘Operations in areas’ set the embed type to ‘Non-blocking async’ for the section.

Next, you need to click on the ‘Add script’ button and then start adding script URLs that you copied from Google PageSpeed tool.

Once you are done, scroll down to CSS section and then click on the ‘Add a stylesheet’ button. Now start adding stylesheet URLs you copied from Google PageSpeed tool.

Now click on the ‘Save settings and purge cache’ button to store your settings.

Visit the Google PageSpeed tool and test your website again.

Make sure that you also test your website thoroughly to see that everything is working fine.

3)Step 5:Images Optimization

For image optimization you will need to intstall smush it plugin.

Smush it plugin will resize and optimize most of your images.

After that goto google insight and check images listed in suggestion. if still there are images listed in suggestion than Use adobe photoshop to resize those images and upload them again.

Leave a Reply

Your email address will not be published. Required fields are marked *