Have you ever noticed that your most popular blog posts – the ones that trigger an avalanche of comments – take a little longer to load? While it’s nice to watch WordPress comments roll in if your commenting system is not carefully configured it can really slow down your website.
Think about the resources that go into making comments work:
If you find that the comments section is slowing down the load speed of your most popular blog posts there a few things you can do:
Let’s consider each strategy independently so you can figure out which is best for your site.
There are two things that you can do to speed up web pages that have been loaded up with a mountain of native WordPress comments: limit the number of comments that load initially and use locally-hosted avatars. Let’s look at each option in turn.
By default, WordPress is set up to load all of your comments with the initial page load. However, loading dozens or even hundreds of comments, each including a unique avatar, can really bulk up your page and create lots of additional HTTP requests.
You can reduce the number of comments loaded with the initial page load very easily.
After going through those steps, the number of comments you specified will be displayed with the initial page load.
WordPress has built-in support for Gravatar. This means that any user with a Gravatar account will have their custom image added as an avatar when they comment on a blog using the native WordPress commenting system. This adds a nice personalized element to the comments section, but comes at a considerable cost. When WordPress comments are loaded, every single unique Gravatar requires an HTTP request. So if a page is loaded up with comments from 50 different commenters, 50 HTTP requests will be required to download all of those Gravatars. As you can imagine, this can have a considerable impact on page speed.
If you decide that Gravatars aren’t worth the added HTTP requests, you can have two options. First, you can disable avatars entirely by going to Settings > Discussion, finding the Avatars section, and unchecking the box to Show Avatars.
If you don’t want to take such a drastic measure, another option is to switch to locally hosted avatars. To do that, install the WP User Avatar plugin. Once the installation is complete, go to Avatars > Settings and select the checkbox to Disable Gravatar and use only local avatars. If you don’t like the default avatar included with WP User Avatar, there’a clean mystery user image in this tutorial on using locally hosted avatars which you can upload and use as the default avatar.
Keep in mind that after making this change all comments will be displayed with the default avatar unless users register with your site and upload a custom avatar.
Your final option is to load your Gravatars on your own CDN. This is the approach we take on the Kinsta blog. ?
There a variety of reasons why you might be interested in switching to a third-party commenting system. First, there’s the server load to think about. Creating and loading comments is a resource-intensive process. If your blog comment section is really busy, then offloading that work to a third-party commenting system will take that load off of your site’s server.
In addition, third-party systems offer a better user experience than the native WordPress commenting system. They may also encourage more visitors to comment since visitors that already have an account with the third-party system can comment right away without having to register or provide details to your site.
In some cases, all of these benefits pan out. However, that isn’t universally true.
Not everyone loves third-party commenting systems and others worry about the data being gathered behind the scenes. In addition, the idea that third-party comment systems are faster than native WordPress comments sounds good in theory but things don’t usually play out that way in reality.
If you do decide to use a third-party commenting system, do so because you like the experience of using that particular system and because you’re convinced your site visitors will love it as much as you do. Don’t switch to third-party comments for a perceived performance improvement that may be more theoretical than realistic. If you do make the jump to a third-party system, be sure to consider implementing the next strategy as well: lazy loading.
If implementing lazy loading sounds a bit technical to implement, it’s because it is. Thankfully, you don’t have to figure it out. There are plugins you can use to lazy load the commenting system you have chosen.
The ability to lazy load comments isn’t built into the WordPress core. However, a great lightweight and free solution that we recommend is the Lazy Load for Comments plugin.
The plugin is available from the WordPress plugin directory. So you can install it right from the WordPress admin area. This will reduce the number of HTTP requests by lazy loading all the WordPress gravatars. It is very simple to configure. Simply install and under the Discussion settings there are two options. By default, it is set to “On Scroll” which is what most people will probably prefer. You can also set it to “On Click” which will created a button for visitors to click on before the comments load.
Another option to lazy load native comments is using the wpDiscuz plugin.
The plugin is available from the WordPress plugin directory. So you can install it right from the WordPress admin area.
Now, when you visit any page with more than ten comments, only the first ten comments will load. Additional comments will load automatically as soon as you reach the bottom of the comments section.
If you do use Disqus, it’s pretty critical that you lazy load Disqus comments. If you don’t, Disqus can be a real hindrance to your site’s load speed. However, lazy loading Disqus comments can actually speed up your site when compared to native WordPress comments.
Disqus Conditional Load is a free plugin you can use to lazy load Disqus on your site. If you’ve never used Disqus before, you’ll first need to sign up for an account and add a new site to Disqus. Once you’ve set up your Disqus site, install Disqus Conditional Load by going to Plugins > Add New, searching for “Disqus Conditional Load”, and selecting Install Now.
Once the installation is complete go to Comments > Disqus and select Upgrade to configure your database to work with Disqus. On the following screen, log into Disqus using your Disqus username and password. From the next screen, select the Disqus site you added just a few minutes prior and select the Next button. After completing that final step Disqus will be installed on your site and configured to lazy load when readers reach the comments section of your blog.
The same developer of the Disqus Conditional Load plugin mentioned above also created a free plugin to lazy load Facebook comments on your WordPress site. Facebook’s scripts are known for bogging down a website, even if the scripts are loaded asynchronously.
Lazy Facebook Comments is a free plugin you can use to either load comments on scroll or with a click of a button. This ensures you are loading the Facebook scripts only when they are needed. You can also adjust the number of comments, color scheme, language, width, sorting order etc..
Comments are a core feature of most blogs, but a burgeoning comments section can really drag down your site’s load speed. You can speed up comments and your WordPress website by optimizing native WordPress comments and by lazy loading comments to remove them from the initial page load.
Send this to a friend