Предзагрузка страницы в NextJS
Метод prefetch у роутера заранее
подгружает ресурсы выбранного пути,
чтобы последующий переход прошел быстрее.
Его удобно вызывать после монтирования
компонента через useEffect.
Давайте заранее подгрузим страницу
/login на /test.
В page.jsx подключим
useRouter и useEffect,
а в эффекте вызовем метод prefetch:
'use client';
import { useEffect } from 'react';
import { useRouter } from 'next/navigation';
export default function TestPage() {
let router = useRouter();
useEffect(() => {
router.prefetch('/login');
}, [router]);
return <p>Prefetching login page</p>;
}
На домашней странице заранее подгрузите
раздел /register при открытии страницы.