jshawl
commented
9 years ago How would you do it with vanilla JS or jquery?
This is quite challenging, indeed! The problem is that you are relying on page height and scroll position to determine when to load more content, but both of those are changing!
The solution references underscore's debounce method http://underscorejs.org/#debounce
This is an extremely common challenge which is also difficult - that's why so many solutions exist as plugins!
Your implementation looks good! My only feedback on your code is that you have hardcoded 10 in the for loop - but you could just as well count the length of the json response to show however many gifs were loaded.
I just built a version of the infinite giphy prompt, which Pat DePuydt promptly declared "a huge benefit to society" after using it to pull up endless corgi gifs. So at least someone has found it useful.
Repo: https://github.com/msteffan/infinite-giphy Completeness: 5 Comfort: 3-4 (I feel pretty comfortable with this API and some of the others I played with, but in terms of CRUD I didn't do much CUD practice, just reading)
Learned about $.getJSON() so that makes AJAX really easy. My question is about the infinite scroll. I worked through a couple of different tutorials that purported to make it "super easy" (which is false), and I ultimately resorted to adding a plugin that implemented this feature. How would you do it with vanilla JS or jquery? The solution on the original repo used something from underscore js, so I wasn't sure how to refactor that into something I would understand.