SWR не обслуживает устаревшие данные?

У меня сложилось впечатление, что SWR должен возвращать устаревшие данные при загрузке страницы, прежде чем обновлять представление новой информацией из API.

Я сделал базовое приложение Nextjs с простым тайм-аутом API, и он "загружается" - в течение 5-секундного тайм-аута, который я добавил в API - каждый раз. У меня сложилось впечатление, что он должен обслуживать ранее кэшированную версию перед обновлением после возврата вызова API?

URL-адрес Vercel – https://swr-test-mkhx72bz3-webknit.vercel.app/

репо - https://github.com/webknit/swr-тест

index.js

import useSWR from 'swr'

const fetcher = (...args) => fetch(...args).then(res => res.json())

export default function Home() {

    const { data, error } = useSWR('/api/hello', fetcher)

  if (error) return <div>failed to load</div>
  if (!data) return <div>loading...</div>

  return (
    <div>{data.num}</div>
  )
}

привет.js

export default function handler(req, res) {

    setTimeout(() => {
        res.status(200).json({ num: Math.floor(Math.random() * 5000) })
    }, 5000)
  
}
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
0
40
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Я не эксперт, но под «каждый раз» вы имеете в виду каждый раз, когда перезагружаете веб-страницу? SWR не будет кэшировать значение между обновлениями веб-страницы для вас.

Кэш в этом контексте означает, что два компонента, использующие один и тот же ключ swr ('/api/hello'), приведут к одному вызову API. Таким образом, какой бы компонент ни вызывал swr первым, он получит ответ API, а второй компонент получит такое же значение из кеша.

Но swr по-прежнему может вызывать API несколько раз позже, чтобы «повторно проверить» и отправить обновленный ответ обоим (или всем) компонентам, которые используют этот ключ.

Да, я имел в виду новый http-запрос. Я знал, что JS существует только в памяти, но я думал, что SWR как-то предлагает серебряную пулю для борьбы с этим. Я чувствовал, что описание SWR немного вводит в заблуждение (хотя я явно неправильно истолковал контекст кеша, как вы упомянули).... «SWR — это стратегия, которая сначала возвращает данные из кеша (устаревшие), а затем отправляет запрос на выборку (перепроверить) и, наконец, получить актуальные данные».

webknit 19.03.2022 09:49

@webknit В этом сценарии вы можете использовать поставщик постоянного кэша на основе localStorage, см. swr.vercel.app/docs/advanced/….

juliomalves 19.03.2022 17:00

Другие вопросы по теме