CODEWITHSUNDEEP
reactjsgatsby
Kyle Pennell
Kyle Pennell

Reputation: 6097

How to show loader on a Gatsby site while large page-data.json is loading?

I'm loading 2000+ video cards in a big list (that loads/functions quickly with react-window). This main page can take a while to load the first time but then does fine after that (it's loading then cache-ing 10MB of data). I'm trying to show a spinner (loading animation) while the data loads. In other sites, I've simple done a basic conditional to test to see if the length of the items array I'm loading is greater than 0. But with Gatsby, it seems like the site loads the array just fine so array.length doesn't work here.

Is there some kind of event or way to test that the page-data.json is loaded?

Upvotes: 2

Views: 4063

Answers (1)

Z. Zlatev
Z. Zlatev

Reputation: 4820

Consider using the official nprogress plugin https://www.gatsbyjs.org/packages/gatsby-plugin-nprogress/

Upvotes: 4

Related Questions