Garantizar que la página se pueda restablecer desde la memoria caché atrás/adelante

Información general

La memoria caché atrás/adelante (bfcache) almacena una instantánea de la página en la memoria cuando esta se restablece desde el historial de navegación. Esto acelera significativamente la navegación de retorno a la página. Sin embargo, algunas APIs del navegador (p. ej., los objetos de escucha de descarga) pueden hacer que falle la bfcache y que la página se cargue con normalidad.

Cómo Lighthouse detecta fallas de bfcache

Navegaciones independientes

Al final de una navegación independiente, Lighthouse abandona la navegación e intenta restablecer la página desde el historial de navegación para detectar si se está usando la bfcache.

Flujos de usuarios

Lighthouse no probará activamente la bfcache en la navegación cuando ejecute un flujo de usuarios. Esto se debe a que la navegación hacia fuera y a la página al final de cada navegación no refleja la mayoría de las experiencias del usuario en la página.

Sin embargo, puedes probar el uso de bfcache en el modo de período si incluyes una navegación por el historial como parte del recorrido del usuario. Por ejemplo:

const flow = await startFlow(page);

// This navigation will not test the bfcache
// because it is part of a user flow.
await flow.navigate('https://example.com');

// This timespan will try to restore the page from the bfcache.
// Problems restoring from the bfcache are surfaced in this report.
await flow.startTimespan();
await page.goto('https://example2.com');
await page.goBack();
await flow.endTimespan();

Comprende las fallas de bfcache

Si la página no se pudo restablecer desde bfcache por algún motivo, fallará la auditoría. Lighthouse mostrará los motivos por los que no se pudo usar la bfcache, junto con los fotogramas que causaron el problema. Los motivos de falla pueden ser de uno de los siguientes tres tipos:

  • Practicidad: Puedes solucionar estos problemas para habilitar el almacenamiento en caché.
  • Asistencia pendiente: Chrome aún no admite estas funciones, por lo que evitan el almacenamiento en caché. Sin embargo, una vez que se admiten, Chrome quita estas limitaciones.
  • Poco viable: No puedes solucionar estos problemas en esta página. Algo que está fuera del control de la página evita el almacenamiento en caché.

Resultado de ejemplo de la auditoría de Memoria caché atrás/adelante de Lighthouse

Recursos