Where do we put prefetches?

[iway1]

It seems more and more React itself and the community is wanting us to steer away from fetching data in a useEffect hook. I don't have any ideas as to where I should be prefetching data now? Where should that happen

[TkDodo]

depends on which framework you're using:

• if you're using next: on the server, probably in getServerSideProps or getStaticProps.
• if you're using react-router v6.4, or react-location for routing: the provided loaders are a good point in time.
• if you have nothing, so purely client side rendered app:
  • consider prefetching onHover of the link that takes you to the next page, if you now what that pages needs
  • for the first page, start prefetching before you call ReactDOM.render, if you know what data the first page will need.

[iway1]

for the first page, start prefetching before you call ReactDOM.render, if you know what data the first page will need.

I'm using React Native and wanting to really just prefetch some static options we house in the backend so I think this option works really well. Interesting, I hadn't thought of initiating prefetches outside of the component tree, makes a lot of sense though.