Load Disqus comments when scroll near bottom with ajax load , fast load your website check demo http://urlchecker.org with more than 400 comment

index.html

<!-- An element a visitor can click if they <3 comments! -->
<button class="show-comments">Load Disqus comments</button>
 
<!-- The empty element required for Disqus to loads comments into -->  
<div id="disqus_thread"></div>

main.js

// Requires jQuery - fontawesome of course.
$(document).ready(function() {


    var disqusFunction = function() {
        var disqus_shortname = 'YOUR-DISQUS-USERNAME';
        // ajax request to load the disqus javascript
        (function() {
            var dsq = document.createElement('script');
            dsq.type = 'text/javascript';
            dsq.async = true;
            dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
            (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
        })();
    };

    $(window).scroll(function() {
        if ($(window).scrollTop() + $(window).height() > $(document).height() - 100) {
            $(window).unbind('scroll');
            disqusFunction();
            // hide the button once comments load
            $('.show-comments').fadeOut();
        }
    });

    $('.show-comments').on('click', function() {
        disqusFunction();
        // hide the button once comments load
        $(this).fadeOut();
    });
});