I'm currently using loopbackjs for making the API endpoints, and graphQL as an intermediate for making queries from the frontend, where I use Relay and React framework.
Now, I have an application where a user can view a list of projects (The project has very generic information like creation date, name, etc.). This list of projects can be very large. So its infeasible to just send all the projects at once. Now, I want to send the first few projects to the frontend and then as the user scrolls down, I want to send a part of the remaining projects when the user reaches the end of the list provided to him/her in the frontend.
I've thought about maintaining a pointer sort of a thing, that indicates till where I've fetched the projects in the list so that I know from where I would fetch the further projects. But this pointer is dependent on the user so for every user I need to maintain a pointer. This gets everything very messy.
Is there a clean approach for doing what I want with the current stack I am using?
Here is how I fetch my first 25 projects:
projects(first: 25, after: $lastID) {
...
}
You could probably change the either variables passed to graphql to return you the infinite scrolling of list of projects. First 25 already helps u limit the amount u get back.
For more references you could find it here https://facebook.github.io/relay/docs/graphql-connections.html