RFC: поддержка async компонентов
От Эндрю Кларка вышло RFC о поддержке асинхронных компонентов на сервере и промисов на клиенте через хук use. Эти два больших нововведения могут существенно облегчить работу с API и базами данных в React. Компоненты, которые используют эти возможности, должны будут обернуты в Suspense.
Async/await для серверных компонентов:
async function Note({id}) {
const note = await db.posts.get(id);
return (
<div>
<h1>{note.title}</h1>
</div>
);
}
Для серверных компонентов React будет ждать пока промис не зарезолвится и после чего компонент будет отрендерен, как будто значение промиса было получено сразу же. Т.е. не будет рендера компонента без данных.
Использование хука use для браузерных компонентов:
function Note({id, shouldIncludeAuthor}) {
const note = use(fetchNote(id));
let byline = null;
if (shouldIncludeAuthor) {
const author = use(fetchNoteAuthor(note.authorId));
byline = <h2>{author.displayName}</h2>;
}
return (
<div>
<h1>{note.title}</h1>
{byline}
</div>
);
}
Как видно из примера, хук use, в отличие от других хуков, можно вызывать внутри условий, также его можно вызывать внутри циклов. Браузерные компоненты не должны быть определены как async. Чтобы получить данные из промиса, достаточно использовать только хук use.
Это еще не финальный RFC. Остается открытым вопрос с кэшированием данных. Как обещает автор, в будущем будет предложен отдельный RFC по кэшированию, а релизится API запросов будет вместе с API кэширования.
RFC github.com/acdlite…mises.md
Обсуждение https://github.com/reactjs/rfcs/pull/229