Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Best pattern for pagination for Meteor

Pattern for pagination is currently on a after 1.0 roadmap for Meteor. Are there any examples or suggestions how to do it now? So how to nicely do an infinite scroll by subscribing to new and new elements as user is scrolling to the bottom?

like image 463
Mitar Avatar asked Apr 01 '13 06:04

Mitar


2 Answers

I recommend that you try my package, Pages: https://github.com/alethes/meteor-pages

It's extremely easy to use (you can set it up with just one line of JavaScript), yet very customizable. It features: incremental subscriptions, local cache, neighbor prefetching, request throttling, easy integration, multiple paginations per page, bootstrap 2/3 styling, failure resistance, built-in iron-router support and a lot of settings that can be modified on the fly, without reloading the page.

like image 98
Alethes Avatar answered Sep 28 '22 19:09

Alethes


There is a package on atmosphere.meteor.com for pagination that should get you started

  • https://github.com/egtann/meteor-pagination (Pagination)
  • https://github.com/tmeasday/meteor-paginated-subscription (Pagination with publish)

The second one actually sends down one page of data at a go instead of all the data at once so if you have loads of data it might help with that. With the infinite scroll you would have to attach a manual scroll listener and put in the new data by increasing the size of a page as you scroll down (not specifically moving to page 2).

I'm a bit unsure on what pattern to use specifically because using page size might be a bit troublesome unless you're able to get it to work right with reactivity which should be possible if you're able to seperate your {{#each}} block helpers so that its for each scroll down, perhaps using Meteor.render so that the entire set of data already available isn't re-rendered.

It might also work if you put the data in div block containing a scroll overflow instead of the above so that it does re-render but their position in the scroll remains the same, in effect making the re-render unnoticable.

like image 27
Tarang Avatar answered Sep 28 '22 20:09

Tarang