Once the user reaches the bottom of those 10 messages, the function will trigger again and repeat the process until we're out of messages. On loading the page, the IntersectionObserver will trigger a function to request 10 messages which will then be rendered to the dom. We're going to create a mock database of messages, featuring an index, title and some content. To be clear, this isn't "virtual scrolling" which can be achieved with the IntersectionObserver, however it's about half way there with the exception of not removing content from the dom. It's also a great way to keep users engaged as new content just "appears" once they reach a certain point in the page.Īfter some quick experimentation with the JavaScript IntersectionObserver, we were up and running with a lazy loading page within about 30 lines of code. Lazy loading content provides a more fluid user experience and increases the resposiveness of a page by only loading content when it's required. Personally, I've never been a fan of pagination.Īsking users to paginate through content or to request more by clicking on a button works, but it's not very elegant.
0 kommentar(er)
