Читая руководство по Next.Js в Routing API, я узнал об извлечении данных с помощью этих двух библиотек.
Объект выборки из Isomorphic-Unfetch используется в асинхронной функции getInitialProps для вызова внешнего API. Затем в части API маршрутизации SWR вместе с {useRouter} из 'next / router; формирует вызов внутреннего API, разработанного на том же сервере Next.Js, с большой гибкостью для запроса параметров req.
Помимо этих двух аспектов, каковы еще различия между этими двумя подходами?
isomorphic-unfetch позволяет делать fetch вызовы как на клиенте , так и сервер, поэтому он показан в примерах, в которых используется getInitialProps.
Как правило, вы получаете данные на сервере с помощью getInitialProps. Это будет блокировка, т. Е. Разметка не будет возвращена, пока ваши данные не будут получены. Рассмотрим страницу продукта для сайта электронной коммерции. Важно, чтобы мы возвращали название продукта, цену и другую информацию с сервера, а не со стороны клиента.
SWR аналогичен, но немного отличается. Сначала он возвращает данные из кеша (устаревшие), затем отправляет запрос на выборку (повторная проверка) и, наконец, снова возвращает актуальные данные. Реальный пример того, где вы бы использовали что-то вроде SWR, находится на странице панели инструментов. Вы не хотите получать все данные в getInitialProps блокирующим образом, поэтому вы визуализируете «оболочку» информационной панели в состоянии загрузки, а затем используете SWR для получения данных на стороне клиента. Вы можете просмотреть пример этого здесь.
Источник - создатель Mastering Next.js ????
fetch полифилируется - устраняется необходимость в isomorphic-unfetch в качестве зависимости.
- person leerob; 17.05.2020
