In previous 5-6 days, I'm not active on my blog because I'm busy in maintaining my blog's page speed score and user experience and today jubilant to tell you guys. Finally, I've got success. Now I've achieved 98/100 page speed score and 100% mobile user experience as per Google PageSpeed Insights Tool.
Some of us are saying, Scoring 90+ Page Speed is not possible on Blogger platform, but I've proved that nothing is impossible in this world. If you work hard, you'll get the best result. Here I'm going to insert screenshot to give you proof.
Okay! Now the question is How I make this possible? Don't worry guys, today in this article I'm not here to only share the result instead I'm here to share How I Achieve this.
Note: Some of the tricks I've applied without the knowledge of legal and illegal. ;) So please forgive me, guys. ;)
How I Achieved 98/100 Page Speed Score for my Blogger Blog?When I checked first time my blog's page speed score, then it was 62/100 and seriously I got upset that time. Just like others, I also thought that Compare to WordPress, Scoring 90+ loading speed is not possible in Blogger hosted Blogs.
But one day I've opened www.hackinguniversity.in the blog of Rishabh Jain's (That is also hosted on Blogger) and get shocked by the loading speed, and I again click on the Reload button, and it is taking only 1-2 seconds to load. I opened the Google's PageSpeed Insights tool and checked the speed score and again get amazed by the result. Just like as me his blog also have 97-98 page speed score. That was the time when I changed my think about the blogger platform and start checking what he did at their blog to achieve this and here I'm going to share what he did and what I've done to get this fantastic result.
#1 - Removed All Unnecessary PluginsSometimes our goal is only to provide high-quality content to our visitors, but we never think about how they feel when to opening your blog. We should think about ourselves that what we feel when we open other's blog which is taking a lot of time to load. We always leave that blog instantly when it is taking too long to loading and never think again to reopen. So first thing is providing good user-experience to the readers.
I realize that some of the plugins are taking a lot of time to load and then I've started to find useless plugins on my blog and remove one by one all of them.
According to me, Twitter and Facebook widget is useless (This is my personal view.). Instead of the widgets, you should use only buttons because they're taking half time to load.
Popular Posts, Random Posts, and Recent Posts widgets are also increasing blog loading time. So I'll recommend you to use it but without snippets [Featured Images]. This trick is helpful but not sufficient to get this fantastic result. Now read what I've done next.
#2 - Default CSS Bundle WidgetsDo you know, by the default setting of the blogger, There are hidden CSS Bundle Widgets available inside your template which you couldn't see in the code area, but when you check your blog's view-source code then you can see it easily?
I'll recommend you to remove that CSS bundle widgets from your blog, but by making this change, maybe you'll face some problems. But if you've some knowledge of the CSS coding then you can fix that bugs quickly. I've written a detailed guide about removing default CSS bundle widgets. You can read - How To Remove Default CSS Bundle Widgets from Blogger?
#4 - FontAwesome CSS and jQuery LibraryNowadays every template designer uses many widgets to make it more eye-catchy and stylish like; slider posts widgets, back-to-top button, and many other widgets too which will not work without the jQuery library but do you know these libraries are taking too much time to load. But the issue is how you can remove it if your widgets do not work? :)
This was the trick, above I'm talking about; I don't know the method is legal or illegal, but I did and got a good result. I've also faced the problem When I've removed it. Some of mine blog's widgets are not working. So, I've tried to add the whole jQuery code inside my blogger template instead of using the jQuery link in the template.
Note: When you'll try to add script code inside blogger template then you'll face many errors because BlogSpot template is in XML format and will not accept '&' and ">" like characters. So you need to add the jQuery library like as below example.
Add jQuery Code Here
Now come up to the FontAwesome Icon CSS library link. I was using it but I realize FontAwesome icons are useless for me and then I've also removed it and customize HTML coding to eliminate all icon codes and shocked by the result because now I've scored 86 by making above changes and I'm too happy with making these changes.
#5 - Compressing CSS and Remove Useless CSS CodesDo you know you can compress your CSS codes using some online tools and Compressing CSS codes is a good idea to make your blog fast to load, and Google Page Speed Insights tool is also recommending to minifying CSS? So I've compressed the whole CSS Codes in my blogger template.
Compressing CSS is not enough. You need to find all useless CSS codes available in your blogger template and remove one by one all of them. It'll help you out of sure.
#6 - Removing the Featured Image from HomePageYou can check my Blog's home page, I've removed all featured images from there. This step is optional. I know featured images at home page will help you in attracting visitors to click on the link and increasing page views but to get more clicks from search engines and to make my Blog's home page quick to load I've removed all images from there.
So this is an optional trick. I've faced the problem of page views after changing the template. So I'll not recommend anyone to take the risk. I always love to do experiments, that's why I've made this change, and still I'm not using featured images because I'm waiting, is Google improve the ranking of my blog posts? :)
#7 - Using The Technique of Click to Load DisqusTo get more control and for improving comment section you should use Disqus comments widget but it is taking too much time to load, and it is always reducing our Blog speed score on Google Page Speed Insights Tool.
There are many methods to handle Disqus comments widget like; click to load Disqus, load only on the scroll or both, but the best one is load Disqus comments on click because the load on the scroll is working well but not as click to load. If you're also interested in applying any of this technique, then you've to read this complete guide - How To Load Disqus Comments on Click or Scroll in Blogger?
#8 - Compress All Your Images Before UseThis one is last but not least. When you create a picture for your blog post, have you checked it's size (KB)? Some of the newbies never think about it, and they never get good Google PageSpeed Insights score. You can check all images of mine blog. They're not higher in the KB size.
I'll recommend you to use tinypng.com to compress all of your images before uploading them to use in your blog posts. Tinypng.com is an excellent site which will compress your all images 60-70% without losing the quality of your pictures. I hope this site will help you. :)
In Last of the Scoring Google PageSpeed Insights:So above I've shared tips to improve your blogger blog loading speed and how to get 90+ Google PageSpeed Insights score with Blogger. I hope this article will help you in boosting the loading speed of your BlogSpot Blog.
Did you like this article? If you like this, then share it on social media platforms. You can also subscribe us to get free newsletter direct into your mailbox for free.
I've not thought about writing this article. This post is here today because of the Umar Farooq (Easyasfart.com) and because of the motivational words of my brother Abdul Samad Essani (bornblogger.net).
Thank you so much, guys, for appreciating my work. :) Thanks for supporting and keep motivating me. Love you friends :) Do share, please. ;)