// the find
ryanflorence/async-props
Co-located data loading for React Router
async-props is a 2016-era experiment that lets a React Router component declare its data needs in a static loadProps method, loading that data before the new screen renders and passing it down as props. It targets React Router v2 and the README calls it pre-release, so it is most useful as a reference for the pattern rather than as a dependency to adopt.
Putting loadProps on the route component keeps each screen's data requirements next to the screen itself, and the same method runs on client navigation and inside loadPropsOnServer. The server helper serializes the loaded data into a script tag, so the client can render with what the server already fetched instead of fetching it again. The surface is small, one wrapper component and one server helper, which makes the whole idea quick to read.
The last push was 31 January 2017 and the README still says pre-release, so there is no sign of work against React Router v4 or later, which removed the match and RoutingContext APIs this example depends on. loadProps takes a Node-style callback instead of returning a promise, which fits poorly with async/await and makes combining several loads awkward. The API is documented only through an example, with a note that docs will come eventually, and the README says nothing about caching, cancelling stale navigations, or what happens when a load fails mid-transition.