|
1 | 1 | # `<Async>`
|
2 | 2 |
|
3 |
| -React component for declarative promise resolution and data fetching. Uses render props for full flexibility or React context |
4 |
| -for convenience. Makes it easy to handle loading and error states, without assumptions about the shape of your data or the type of request. Supports optimistic updates. |
| 3 | +React component for declarative promise resolution and data fetching. Leverages the Render Props pattern for ultimate |
| 4 | +flexibility as well as the new Context API for ease of use. Makes it easy to handle loading and error states, without |
| 5 | +assumptions about the shape of your data or the type of request. |
| 6 | + |
| 7 | +- Zero dependencies |
| 8 | +- A little over 150 LOC |
| 9 | +- Works with any (native) promise |
| 10 | +- Choose between Render Props and Context-based helper components |
| 11 | +- Provides convenient `isLoading`, `startedAt` and `finishedAt` metadata |
| 12 | +- Automatic re-run using `watch` prop |
| 13 | +- Accepts `onResolved` and `onRejected` callbacks |
| 14 | +- Supports optimistic updates using `setData` |
| 15 | + |
| 16 | +> This package is a work-in-progress. It has not yet been published on npm and its API may change before it's released. |
| 17 | +> Feel free to provide feedback. |
| 18 | + |
| 19 | +## Rationale |
| 20 | + |
| 21 | +`<Async>` is different in that it tries to resolve data as close as possible to where it will be used, while using a |
| 22 | +declarative syntax, using just JSX and native promises. This is in contrast to systems like Redux where you would |
| 23 | +configure any data fetching or updates on a higher (application global) level, using a special construct |
| 24 | +(actions/reducers). |
| 25 | + |
| 26 | +`<Async>` works really well even in larger applications with multiple or nested data dependencies. It encourages loading |
| 27 | +data on-demand and in parallel at component level instead of in bulk at the route / page level. It's entirely decoupled |
| 28 | +from your routes, so it works well in complex applications that have a dynamic routing model or don't use routes at all. |
5 | 29 |
|
6 | 30 | ## Usage
|
7 | 31 |
|
|
0 commit comments