• Skip to main content
  • Skip to primary sidebar
  • Home
  • About
  • Subscribe BMA
  • Contact Us!

Be My Aficionado

Inspire Affection

You are here: Home / Wordpress N SEO / How to SpeedUp Wordpress Website for Google Pagespeed Insight

How to SpeedUp WordPress Website for Google Pagespeed Insight11 min read

April 15, 2017 by Varun Shrivastava 15 Comments

A website that doesn’t load in less than 3 seconds is prone to lose visitors.

When I first read this statement in one of the Google Survey reports, I was amazed. It means you have to make your website so fast that it should load immediately as the user clicks on it otherwise your website is prone to lose potential visitor or sometimes potential clients.

Also, Google ranks websites on the basis of their load time as it is a major concern from their side as well.

The website which does not load fast has many drawbacks. I will share my personal experience with you in this article. This article focuses on how to Speedup WordPress Website for better Google Pagespeed Insight.

Topics Covered

  • Drawbacks of having a slow website
  • Steps to SpeedUp WordPress Website
    • #1 Find the cause of slowness
    • #2 Identify Above the Fold Content
    • #3 Minify HTML, CSS, JS
    • #4 Optimize Images
    • #5 Enable GZIP Compression
    • #6 Leverage Browser Caching
    • #7 Server Response Time

Drawbacks of having a slow website

A slow website is inversely proportional to the number of website visitors and directly proportional to a bad user experience.

Just try to think from a user’s perspective, would you wait for more than 5 seconds for a website to load or you simply navigate to another website which that gives you similar content but is much more faster.

Obviously, we would choose the latter option. Even if your content is better than the second website, the user will choose to leave you because your website failed to load in time. We would never want something like this to happen.

Another drawback comes from Google’s side. Even though you have a pretty decent content overall but if your website performance is poor then Google will demote your website rank for that. Your dream to appear on the first page of google will never be fulfilled. Sad ๐Ÿ™

The third drawback will make you lose your potential clients. Your client is your source of income. You would never want to lose a potential client because of a slow page load speed. That is pretty frustrating don’t you think.

There are a lot of other reasons that can affect you adversely and a whole different article could be written on just the drawbacks of a slow website. That would be one hell of a negative article :p

  • Checklist to follow after migrating Http to Https

Steps to SpeedUp WordPress Website

It is not hard to speed up your website. It is just the matters of hours depending on the level and complexity of your website and its contents. Let’s try to speed up your website. Follow the below steps to speed up your website.

#1 Find the cause of slowness

Very important step in the process of speeding up your website. You need to first identify all the causes that is slowing down your website. Doesn’t it sound like a tough analytical job? Hell Yeah! It is tough. You cannot get everything for granted. You will have to invest time in investigation. Be a CID for a day and find out the root cause.

But wait, we can also use tools to make our job easy and this article is all about that. You can use google’s page insight tool to find the score for your website. Page insight tests your website against the best practices that must follow in order to speedup your website’s performance. Below are the benchmarks against which you can test your website,

Google Pagespeed Insight Benchmarks to SpeedUp WordPress Website
7 Passed Rules

As you can see that bemyaficionado has passed all the 7 rules that we are focusing on this article. It is a pretty decent score in google pagespeed. So, if you follow the article to the end, you might as well get the same or better score at the end. If you do get better result then mine, do share your website in the comment box below.

Great we have everything that addressed for us. Now all we need is a way to achieve what is asked for.

#2 Identify Above the Fold Content

Google gives a lot of weight for above the fold optimization. Above the fold is the first view of your website without scrolling down. The very first thing that the user will see after landing on your webpage. You must give special preference for above the fold content. For that you need to identify the js and css which are required by above the fold content. Below is Above the fold view for BMA?on mobile devices,

Above the fold view

?

There best way to optimize above the fold content is to inline both HTML and CSS for that part. Mostly it is not the js but CSS. So, try to make the CSS inline. Autoptimize ?does that for you in just a matter of seconds. But, the recognition part depends on you.

#3 Minify HTML, CSS, JS

This is one of the major cause of slowness on your website. Often times the assets files are not minified. As a result, the server has to wait till these files are loaded, thus, adding to the overall load time of the webpage. I use a plugin for this purpose. Autoptimize plugin is the best plugin I found for this purpose. It compresses all your HTML, CSS and js files on the go. Immediately after installing this plugin to my website with minor adjustments, all my files were minified. I ran a page insights speed test again and it was passed.

I use below settings for my website,

Autoptimize Plugin Settings

Note- Autoptimize cannot compress external files (files hosted on 3rd party server).

If you run a speed test on my website, you will not find any asset files that are not minified. It passes all the test. Although, the website shows poor marks on speed test because I have multiple plugins which load their dependencies from 3rd party servers. You will have to do a lot of tweaking in order to optimize 3rd party contents. Also, it doesn’t affect the load time for my website as those resources are loaded asynchronously. So, I chose not to do anything for the time being.

#4 Optimize Images

It is one of the most useful steps in the process. Your images must be of the right size. If you intend to render an image at 1024×640 then the image must be saved in that size. The image must not be greater than the required pixel. If you are using CSS to resize the image to fit in the div then that is not optimization. You must render the image of the same size. So, make sure you upload the image in the required pixel.

WordPress gives you the option to resize images in three different sizes found under settings > media. You can give the desired size you wish to render the images on your website. I use below settings,

Settings for Media Image Files on WordPress

I render images in one of the above sizes. Thumbnail, medium or large. You can change these size anytime.

Also, you must compress your images before uploading it to your servers. There are multiple websites that can make your task easy. One of the best websites is Tinyng.com. It will compress your images to the best without losing quality. I have saved more than 78% on many images and that is like a lot. Also, if you can upload images in the .webp then do it. It is web friendly URL as compared to jpeg.

I also use wp smush.it ?plugin which comes for free and does a great work. You have the option to automatically compress the images at the time of upload. It will save a lot of kbs for you and make your images optimized.

#5 Enable GZIP Compression

This requires little bit of technical expertise. First of all this is not limited with the WordPress. GZIP compression is done at the server end. So, it will work for any website hosted on that particular server. If you have access to your .htaccess file which in most cases you will have. Then you must open that file in the edit mode and check follow the instructions below.

Note – Make sure you make a copy of that .htaccess file.

  1. Open .htaccess file in edit mode
  1. Copy and paste the below code right below your current content.
    AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/xml AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/x-javascript
  1. Save the file
  1. Open your website and check if everything’s working as expected.
  1. Check whether GZIP has been enabled successfully from the following link https://checkgzipcompression.com/

That is all you need to do in order to gzip all your files. If you need more information on GZIP compression then I have a wonderful article for you. Read How to Enable GZIP Compression in WordPress.?

#6 Leverage Browser Caching

Yet another server side thing. You can do it in the same way you did GZIP compression. Just copy the below code into your .htaccess file and you are good to go.


## EXPIRES CACHING ##

<IfModule mod_expires.c>

ExpiresActive On

ExpiresByType image/jpg "access 1 year"

ExpiresByType image/jpeg "access 1 year"

ExpiresByType image/gif "access 1 year"

ExpiresByType image/png "access 1 year"

ExpiresByType text/css "access 1 month"

ExpiresByType text/html "access 1 month"

ExpiresByType application/pdf "access 1 month"

ExpiresByType text/x-javascript "access 1 month"

ExpiresByType application/x-shockwave-flash "access 1 month"

ExpiresByType image/x-icon "access 1 year"

ExpiresDefault "access 1 month"

</IfModule>

## EXPIRES CACHING ##

In most cases the above code is sufficient. If you want to have more control over each and every part of the caching then follow this article https://varvy.com/pagespeed/leverage-browser-caching.html.

You will be good to go with the above settings.

#7 Server Response Time

Your server response time could be affected due to so many reasons which is hard to find with a metric tool. But, there are best practices and guidelines that we can follow to avoid common causes. There are a few reason for slow server response –

  • High resource consumption
    This could be one issue which can slow your server performance. There are chances that you are using way too many plugins and all are consuming server resources heavily, thus, cause the servers to respond slow. If you are using heavy plugins or multiple plugins that perform heavy calculation before rendering the page then your server might respond slowly in that case. A very simple solution for this type of problem is ‘Caching’.Cache helps in improving server speed by bypassing all the heavy calculations required to render a page. Cache keeps a copy of the rendered page in a server. Whenever user requests for that page which is cached, the cached page is directly returned to the user thus saving heavy calculation and database calls. This significantly improves website performance. ‘W3 Total Cache’?is my personal favourite free plugin used for caching. The only drawback of this plugin is that it requires proper configuration. Do try it and see the significant difference in your server response.
  • Use of Shared Hosting or Slow hosting
    This is usually the factor for slow response time. Shared hosting is never good for the commercial website. Especially the website which generates revenue from traffic. Learn about different types of hosting to get a better idea. The best hosting providers are Dreamhost and if you are a geeky guy (like me) then Digital Ocean. I personally prefer Digital Ocean but if you want a hassle free hosting then I recommend dream host to. Find the link for both the hosting services below for pricing,– Dreamhost Hosting,
    – DigitalOcean – Get 10$ credit on signup

If W3 Total Cache doesn’t solve your problem then you must look for a better hosting provider. I strongly recommend Dreamhost and DigitalOcean because of their pricing, performance and service.

Run a page insight test one more time and see the difference. The above settings are sufficient to get a good score in google page insights. Just understand that these settings are for the files hosted on your own server and not any third party server. If the files are being fetched from the third party server then you will have to tweak a lot of things in order to customize it. So, if the results on page insights are not good, make sure the warnings does not contain any file that is hosted under your domain.

I’m pretty sure that you will not find any warning for the files hosted on your server. If you have achieved positive results then comment your website name below. ?I would love to hear from you. Let me know what extra do you do to optimize your website. And one final thing – Do not forget to share this article ๐Ÿ™‚

You might find this useful,

  • How to port existing ?WordPress website to new domain
  • How to port your existing website to WordPress
  • Port Existing CodeIgniter website to WordPress

Share this:

  • Click to share on Facebook (Opens in new window)
  • Click to share on LinkedIn (Opens in new window)
  • Click to share on Twitter (Opens in new window)
  • Click to share on Pinterest (Opens in new window)
  • Click to share on Reddit (Opens in new window)
  • More
  • Click to print (Opens in new window)
  • Click to share on Tumblr (Opens in new window)
  • Click to share on Pocket (Opens in new window)
  • Click to share on Telegram (Opens in new window)
  • Click to share on WhatsApp (Opens in new window)
  • Click to share on Skype (Opens in new window)
  • Click to email this to a friend (Opens in new window)

Filed Under: Wordpress N SEO Tagged With: fast, google, google custom search, google pagespeed insights, search engine optimization

Reader Interactions

Comments

  1. suman saxena says

    December 8, 2017 at 5:07 pm

    India is a blossoming country with a significant conventional touch to nearly everything. Notwithstanding that, it’s a sex over the top country to an exceptionally incredible degree. The pioneers of “Kamasutra”, observe sex to be something not adequate in the general public. On inconsistency, we are the second biggest country regarding populace.

    Reply
  2. Ashish says

    May 9, 2017 at 1:56 pm

    Really Great piece of article for wordpress user. As I see wordpress sites take a bit time to load. This tips & tricks will surely help. Keep Updating.Regards

    Reply
    • Varun Shrivastava says

      May 12, 2017 at 6:32 am

      Thanks, Ashish. These techniques has become a necessity with the advent of mobile first website approach.
      Thanks

      Reply
  3. Prince josan says

    May 3, 2017 at 1:42 pm

    Hi, varun,
    Thanx for sharing this nice article and your tips really increase my website speed .thanx again

    Reply
    • Varun Shrivastava says

      May 3, 2017 at 10:58 pm

      I’m so glad to hear about that. Thanks you, Prince.
      Do let me know if you need SEO related help ?

      Reply
  4. Manan says

    April 30, 2017 at 11:24 am

    Hello Sir,
    Very good article,
    Thanks for sharing.

    Reply
    • Varun Shrivastava says

      April 30, 2017 at 3:29 pm

      Thanks, Manan.

      Do read other blogs as well ?

      Reply
  5. VIRENDRA SINGH BHATI says

    April 27, 2017 at 5:29 pm

    Hi Varun Shrivastava,
    very nice.
    keep doing this great work.

    Reply
    • Varun Shrivastava says

      April 27, 2017 at 10:27 pm

      Thanks for the appreciation Virendra ๐Ÿ™‚

      Reply
  6. VIRENDRA SINGH BHATI says

    April 27, 2017 at 5:26 pm

    Hi Varun Shrivastava,
    very nice.
    keep it up

    Reply
    • Varun Shrivastava says

      April 27, 2017 at 10:31 pm

      Thank you, Virendra.

      Reply
  7. Neha Tandan says

    April 25, 2017 at 2:03 pm

    Hi, thanks for this great information. It helped me a lot, keep doing this great work. http://www.nehatandan.com

    Reply
    • Varun Shrivastava says

      April 25, 2017 at 10:29 pm

      Thanks Neha. I would love to create similar posts (Y)

      Reply
  8. VISHAL KUMAR says

    April 17, 2017 at 10:53 pm

    Hi ,very well written article with Lots of good points here.Will love to visit the site again.Thanks

    Reply
    • Varun Shrivastava says

      April 17, 2017 at 11:01 pm

      Thanks Vishal ๐Ÿ™‚
      Much Obliged.

      Reply

Leave a Reply Cancel reply

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Primary Sidebar

Featured Posts

Best Javascript Framework 2017

March 2, 2017 By Varun Shrivastava 1 Comment

Advent Of Code 2020 – DAY 2 – Object-Oriented Way

December 9, 2020 By Varun Shrivastava Leave a Comment

What is LUCK? – The Luck Factor

November 13, 2016 By Varun Shrivastava 1 Comment

Never Do These 10 Things Ever

July 4, 2020 By Varun Shrivastava Leave a Comment

11 (Must Have) Ingredients that Can Turn You Into a Social Media Magnet in Freakishly Less Time

May 26, 2018 By Varun Shrivastava 7 Comments

Latest Posts

  • 3 Best Laptops (Mid-Range) For Every Use Case In India
  • Distributed System Architectural Patterns
  • The Power of being in the Present
  • Basic Calculator Leetcode Problem Using Object-Oriented Programming In Java
  • Study Abroad Destinations : Research and Review

Categories

  • Blogging (103)
  • Cooking (11)
  • Fashion (7)
  • Finance & Money (12)
  • Programming (51)
  • Reviews (4)
  • Technology (22)
  • Travelling (4)
  • Tutorials (12)
  • Web Hosting (8)
  • Wordpress N SEO (19)

Follow us on facebook

Follow us on facebook

Grab the Deal Now!

Hostgator Starting @$3.95/mo

DigitalOcean Free Credits

Trending

Affordable Hosting amazon aoc-2020 bad luck believe in yourself best database earn money blogging education experience fashion finance Financial Freedom food friends goals google india indian cuisine indian education system java javascript life life changing love make money microservices motivation oops poor education system principles of microservices problem-solving programmer programming reality search engines seo SSD Hosting success technology tips top 5 web web developer wordpress

Copyright ยฉ 2021 ยท BeMyAficionado by Varun Shrivastava ยท WordPress

loading Cancel
Post was not sent - check your email addresses!
Email check failed, please try again
Sorry, your blog cannot share posts by email.