Современная загрузка данных, созданная для React

SWR — это минималистичный API со встроенным кэшированием, ревалидацией и дедупликацией запросов. Он поддерживает ваш UI быстрым, согласованным и всегда актуальным — с помощью одного React хука.

Начать

Загрузка данных одним хуком

Передайте ключ и fetcher в useSWR. Хук управляет запросом, кэширует ответ и поддерживает данные актуальными. Вы получаете data, error и isLoading для управления вашим UI.

import useSWR from 'swr'
 
function Profile() {
  const { data, error, isLoading } = useSWR('/api/user', fetcher)
 
  if (error) return <div>failed to load</div>
  if (isLoading) return <div>loading...</div>
  return <div>hello {data.name}!</div>
}

Загрузка, запрос и ревалидация

SWR покрывает все аспекты скорости, корректности и стабильности, чтобы помочь вам создавать лучший опыт.

Быстрая навигация по страницамОпрос с интерваламиЗависимость данныхРевалидация при фокусеРевалидация при восстановлении сетиЛокальная мутация (Оптимистичный UI)Умная повторная попытка при ошибкеПагинация и восстановление позиции прокруткиReact Suspense

Легковесный и агностичный

Небольшая поверхность API с поддержкой любого источника данных — REST, GraphQL или пользовательских fetchers.

В реальном времени и отказоустойчивый

Автоматическая фоновая ревалидация, обновления при фокусе/переподключении и утилиты для пагинации и потоковой передачи.

Нативная эргономика React

Построен для Suspense, совместим с SSR и SSG, полностью типизирован с самого начала.

Начните создавать с SWR

Начать