Следует ли использовать next/link (предварительно загруженные переходы на стороне клиента) для страниц с любым динамическим контентом?
Вы можете видеть, что
<Link>
компонент из позволяет переходить на стороне клиента и связывать
prefetching
, которые являются отличными функциями, но, возможно, не для всех случаев.
Пожалуйста, прочтите предостережение, с которым я столкнулся. Допустим, у меня есть следующие страницы:
- - Некоторая целевая страница с навигационной панелью
- - Здесь я вижу свои последние сообщения
- - Здесь я могу добавить больше сообщений
На странице из приведенного выше примера используется
getStaticProps
с участием
revalidate
. Что-то вроде:
export const getStaticProps : GetStaticProps<HomeRoute> = async () => {
const preloadedState = await getPreloadedState();
return({
revalidate: 1,
props: {
preloadedState
}
});
};
Теоретически через 1 секунду он должен отправить последний устаревший ответ для следующего запроса и запустить новую статическую регенерацию, которая будет обслуживаться для последующих запросов. Через 1 секунду процесс повторяется, и вы получаете свежие данные, по крайней мере, каждую секунду, что практически сразу же.
Теперь посмотрим на предостережение, с которым я столкнулся:
-
- Пользователь попадает на страницу. Eсть
Link
на панели навигации, указывающей на. Эта ссылка будетprefetched
от .
- Пользователь попадает на страницу. Eсть
-
- В другом браузере
admin
идет вAdmin
page и добавляет еще одно сообщение (которое в какой-то момент должно появиться на странице).
- В другом браузере
-
- Теперь пользователь нажимает на ссылку страницы. Новый пост не существует.
-
- Нажимает на
Home
очередной раз. И снова щелкаетLatest
. Нового поста пока нет и не будет.
- Нажимает на
Переходы в этом случае очень быстрые, что приятно. Но исходя из моего опыта, я думаю, что этот пользователь заблокирован внутри версии моего веб-сайта, где новый пост никогда не будет доступен, потому что этот 1-й
prefetch
произошло в то время, когда нового поста не существовало.
Единственный способ, которым пользователь когда-либо увидит новое сообщение, - это если он / она нажмет
F5
сделать полную перезагрузку сайта. И может потребоваться обновить дважды, потому что первая версия может вернуть предыдущую устаревшую версию, вызывая регенерацию для следующей.
Я имею в виду, как можно обойти эту проблему? Я не должен использовать
next/link
для страниц, содержащих какие-либо динамические данные? Должен ли я просто использовать нормальный
<a>
теги?
1 ответ
Я разместил этот же вопрос на нескольких форумах и получил такой ответ:
Кажется, то, что вы описали, правда. кеширует результаты на стороне клиента, и ваш посетитель не получит повторно проверенный результат из коробки, если не будет перезагрузки полной страницы.
В зависимости от вероятности изменения содержимого вы можете использовать
вместо этого вы можете взглянуть на некоторую стратегию перезагрузки контента на стороне клиента, которая срабатывает после монтирования, и запросить источник данных для обновленного контента.
Учитывая этот факт, я буду использовать