```js

export const loader = async () => {

// fire them all at once<br /> const critical1Promise = fetch('/test?text=critical1&delay=250').then(res => res.json()); const critical2Promise = fetch('/test?text=critical2&delay=500').then(res => res.json()); const lazyResolvedPromise = fetch('/test?text=lazyResolved&delay=100').then(res => res.json()); const lazy1Promise = fetch('/test?text=lazy1&delay=500').then(res => res.json()); const lazy2Promise = fetch('/test?text=lazy2&delay=1500').then(res => res.json()); const lazy3Promise = fetch('/test?text=lazy3&delay=2500').then(res => res.json()); const lazyErrorPromise = fetch('/test?text=lazy3&delay=3000').then(res => { throw Error('Oh noo!') });

// await for the response return defer({ critical1: await critical1Promise, critical2: await critical2Promise, lazyResolved: lazyResolvedPromise, lazy1: lazy1Promise, lazy2: lazy2Promise, lazy3: lazy3Promise, lazyError: lazyErrorPromise }) } ```

Note, in newer versions of the router, this won't work because a route can only contain one child. Try wrapping the two routes in a <switch>:</switch>

  <Switch>
    <Route exact path="/" component={ List } />
    <Route path="/react" component={Detail}  />
  </Switch>

In newer versions of React, this won't work without a history prop and hashHistory. Depending on how you import hashHistory, the code will look something like this:

let hashHistory = createHashHistory();

<Router history={hashHistory}>
    <Route path="/" component={ Detail } />
</Router>,