staleTimes

staleTimes est une fonctionnalité expérimentale qui permet la mise en cache des segments de page dans le cache du routeur côté client.

Vous pouvez activer cette fonctionnalité expérimentale et définir des temps de revalidation personnalisés en configurant le drapeau expérimental staleTimes :

next.config.js
/** @type {import('next').NextConfig} */
const nextConfig = {
  experimental: {
    staleTimes: {
      dynamic: 30,
      static: 180,
    },
  },
}

module.exports = nextConfig

Les propriétés static et dynamic correspondent à la période de temps (en secondes) basée sur différents types de préchargement de liens.

  • La propriété dynamic est utilisée lorsque la page n'est ni générée statiquement ni entièrement préchargée (par exemple avec prefetch={true}).
    • Par défaut : 0 seconde (non mis en cache)
  • La propriété static est utilisée pour les pages générées statiquement, ou lorsque la prop prefetch de Link est définie sur true, ou lors de l'appel à router.prefetch.
    • Par défaut : 5 minutes

Bon à savoir :

  • Les limites de chargement sont considérées comme réutilisables pour la période static définie dans cette configuration.
  • Cela n'affecte pas le rendu partiel, ce qui signifie que les mises en page partagées ne seront pas automatiquement rechargées à chaque navigation, seulement le segment de page qui change.
  • Cela ne modifie pas le comportement du cache retour/avant pour éviter les décalages de mise en page et la perte de la position de défilement du navigateur.

Vous pouvez en apprendre davantage sur le cache du routeur côté client ici.

Historique des versions

VersionModifications
v15.0.0La valeur par défaut de dynamic staleTimes est passée de 30s à 0s.
v14.2.0Introduction expérimentale de staleTimes.