React-static: [Bug] Potential race condition when prefetching sharedData of the same path in parallel.

Created on 10 Feb 2020  路  2Comments  路  Source: react-static/react-static

Continuing figuring out bugs that I see in production on our website. Somewhat related to loading bugs from this issue: https://github.com/react-static/react-static/issues/1203.

Except this time it appears to be a similar issue but in react-static itself. I have not verified this, but it really looks wrong to me.

What I see is sometimes when I load the index page of our website and move to some other page real quick, it fails with an error. If you dig down into the error, it's one of the sharedData props being "undefined". Let's see how sharedData is loaded:

https://github.com/react-static/react-static/blob/614990ebbe574b85461e958fd10ce26f83a29cf1/packages/react-static/src/browser/index.js#L281-L291

We have this snippet that is within prefetchData function, which is called from prefetch function itself. As far as "prefetch" goes, it can be called multiple times for the same component. Prefetch is initiated from ticker which prefetches stuff for visible links and then prefetch also might be called from useRouteData even (which can throw a promise for suspense to handle it). The problem is that once you enter "prefetchData" function, it sets the empty object on sharedData property routeInfo.sharedData = {} and goes into some async stuff, which in turns makes other code think sharedData is already loaded. But the loading is not complete.

So, a hypothetical scenario:

  1. I load index page, prefetch kicks in due to visible links.
  2. prefetchData sets routeInfo.sharedData to empty object and then goes doing some async requests after that which will later fill in that object.
  3. I click the page link, which loads the component which in turn calls useRouteData, which thinks sharedData is already loaded (https://github.com/react-static/react-static/blob/614990ebbe574b85461e958fd10ce26f83a29cf1/packages/react-static/src/browser/hooks/useRouteData.js#L61-L63).
  4. But in reality sharedData is an empty object at this point.

End result - I get my "undefined" error when trying to access some of the props (sharedData props) of useRouteData() result.

bug

Most helpful comment

Is there any progress about this issues?

All 2 comments

Is there any progress about this issues?

What does the fail look like? Curious to see if we got the same issue...

Was this page helpful?
0 / 5 - 0 ratings

Related issues

lottamus picture lottamus  路  3Comments

josephdburdick picture josephdburdick  路  4Comments

achenwei-chwy picture achenwei-chwy  路  3Comments

josephdburdick picture josephdburdick  路  4Comments

getDanArias picture getDanArias  路  4Comments