Access SharePoint with Large Items using React with Asynchronous Recursion and Promises

Recently, I was working on a SharePoint Framework web part that requires displaying large lists and libraries in SharePoint 2016. As many of you may already know, with a list of more than 5000 items, you may run into a list view threshold error. My requirement is allowing users to be able to view more than 20,000 items. After exploring various options, I decided to create a solution that recursively calls the SharePoint REST service with page and skip-token query options, limiting page size per request. Promise objects are used in my solution to perform the asynchronous functions; the items collection handler is used when the value is resolved. Any error is passed down the chain and handled in the desired place without any extra effort.

Code Example

The method getListItem(url: string) is used to perform REST calls against SharePoint. It returns a promise as an object that waits for a GET action to finish.

The getListItemRecursive is very straightforward. It invokes the getListItem method; if the result contains more than x numbers of items, the listing service will return an odata.nextLink property. With the promise, I’m able to get the odata.nextLink value in the then handler after the returned items are resolved. If the odata.nextLink value is not null, the getListItemRecursive method will call itself to retrieve the next set of results by sending the URL value of the odata.nextLink property to the getListItem process. The list service will continue to return a reference to the next set of data in the odata.nextLink property with each response until all of the results have been returned. The items collection is called only when each promise is fulfilled.

This function above is invoked to request getListItem, and supply a callback function that will later be invoked with the result.

Conclusion

The example above performs well in a SharePoint Framework web part. The asynchronous operation helps the overall performance and responsiveness of my application, particularly when accessing large datasets.