Those who use the Disqus comment system in their blog will sooner or later have noticed that there are sometimes loading delays caused by Disqus. The solution: Lazyload.
The basic idea: if a defined point is reached while scrolling in a post, the comments are reloaded. If a reader does not read the whole post, the comments are not loaded at all. If a reader reads a post completely, the comments are loaded in time so that they are displayed when the comment area is reached.
Edit Disqus plugin
To use Lazy Load, the Disqus plugin must be adapted, more precisely the file
disqus-comment-system/comments.php. You start editing in WordPress by selecting the submenu item "Editor" in the menu item "Plugins" and then the corresponding plugin from the list in the upper right corner. At the very end of the
Particularly important is Line 5: there you define which HTML element triggers the reloading of disqus, I chose "Similar Posts" or the CSS class "related_post_title" as it is still located well before the commentary section and well after the start of the post. Depending on the theme it may be necessary to use a different ID (then with # in front) or a different CSS class there.
Disqus Lazy-Load in practice
However, there are also disadvantages: for example, the recognition of the loading mark does not always work reliably and with every browser. As a result, it can happen that no comments are displayed at all. Here in the blog I will leave the function activated for the time being and see how it works. If you want to learn more about Lazy Load and Disqus you can find several script examples and instructions on the net, e.g. here or on Github.com.
4 thoughts on “Pagespeed: Disqus mit Lazyload verwenden”
Servus Falk - and for those who don't use it, there is a possibility. Because the delayed loading history seems very interesting
In principle you can make Lazy Load with all kinds of elements that are loaded via additional files. Here in the blog I have activated it for pictures as well, so that not all of them have to be loaded.
The more pictures or other elements there are and the longer the page is, the greater is the advantage of this approach.