Usando la navegación del lado del cliente, puedo navegar entre páginas usando solo JavaScript. La primera solicitud de una página tarda un tiempo en procesarse y luego la navegación de regreso es casi instantánea. Durante ese primer render esa página solo carga lo necesario para ella. Eso aísla cada página haciéndolas independientes. Solo quiero saber si hay una forma de cargar el código para más de una página en una sola solicitud.
Como ejemplo, digamos que tengo varias páginas de perfil para un usuario (información, configuración, historial). Quiero cargar el código de todas esas páginas en una solicitud para cualquiera de esas páginas, de modo que la navegación entre ellas sea instantánea y no haya tiempo de espera.
Siempre que los enlaces (usando next/link ) a esas páginas estén dentro de la ventana gráfica, las páginas se precargarán de forma predeterminada cuando estén en modo de producción (sin embargo, la precarga no funciona en el modo de desarrollo).
prefetch: captura previamente la página en segundo plano. El valor predeterminado estrue. Cualquier<Link />que esté en la ventana gráfica (inicialmente o mediante el desplazamiento) se precargará. La captación previa se puede deshabilitar pasandoprefetch={false}. Cuando laprefetchse establece enfalse, la captación previa seguirá ocurriendo al pasar el mouse por encima. Las páginas que usan generación estática precargarán archivos JSON con los datos para transiciones de página más rápidas. La captación previa solo está habilitada en producción .
Si no está utilizando next/link para navegar a esas páginas, puede usar router.prefetch para forzar la captación previa.
router.prefetch(url, as)
url: la URL para precargar, incluidas rutas explícitas (por ejemplo/dashboard) y rutas dinámicas (por ejemplo/product/[id])as- Decorador opcional paraurl. Antes de Next.js 9.5.3, esto se usaba para precargar rutas dinámicas, consulte nuestros documentos anteriores para ver cómo funcionaba.