https://www.matthewrasnake.com/assets/vendor/infinite-scroll.js?v=-JC7kAxgJ1yH71_Y

1/**
2 * Infinite Scroll
3 */
4
5function initInfiniteScroll(window, document) {
6    // next link element
7    var nextElement = document.querySelector('link[rel=next]');
8    if (!nextElement) return;
9
10    // post feed element
11    var feedElement = document.querySelector('nav.cards');
12    // console.log('feedElement', feedElement);
13    if (!feedElement) return;
14
15    var buffer = 300;
16
17    var ticking = false;
18    var loading = false;
19
20    var lastScrollY = window.scrollY;
21    var lastWindowHeight = window.innerHeight;
22    var lastDocumentHeight = document.documentElement.scrollHeight;
23
24    function onPageLoad() {
25        if (this.status === 404) {
26            window.removeEventListener('scroll', onScroll);
27            window.removeEventListener('resize', onResize);
28            return;
29        }
30
31        // append contents
32        var postElements = this.response.querySelectorAll('nav .card');
33        postElements.forEach(function (item) {
34            feedElement.appendChild(item);
35        });
36
37        // set next link
38        var resNextElement = this.response.querySelector('link[rel=next]');
39        if (resNextElement) {
40            nextElement.href = resNextElement.href;
41        } else {
42            window.removeEventListener('scroll', onScroll);
43            window.removeEventListener('resize', onResize);
44        }
45
46        // sync status
47        lastDocumentHeight = document.documentElement.scrollHeight;
48        ticking = false;
49        loading = false;
50    }
51
52    function onUpdate() {
53        // return if already loading
54        if (loading) return;
55
56        // return if not scroll to the bottom
57        if (lastScrollY + lastWindowHeight <= lastDocumentHeight - buffer) {
58            ticking = false;
59            return;
60        }
61
62        loading = true;
63
64        var xhr = new window.XMLHttpRequest();
65        xhr.responseType = 'document';
66
67        xhr.addEventListener('load', onPageLoad);
68
69        xhr.open('GET', nextElement.href);
70        xhr.send(null);
71    }
72
73    function requestTick() {
74        ticking || window.requestAnimationFrame(onUpdate);
75        ticking = true;
76    }
77
78    function onScroll() {
79        lastScrollY = window.scrollY;
80        requestTick();
81    }
82
83    function onResize() {
84        lastWindowHeight = window.innerHeight;
85        lastDocumentHeight = document.documentElement.scrollHeight;
86        requestTick();
87    }
88
89    window.addEventListener('scroll', onScroll, { passive: true });
90    window.addEventListener('resize', onResize);
91
92    requestTick();
93};
94
95initInfiniteScroll(window, document);