instant

Core Idea

Route segment config que valida se a navegação para um segmento vai produzir UI instantânea, expondo em desenvolvimento qualquer código que bloquearia a atualização imediata da UI.

Key Concepts

• instant: export em layout/page; aceita true, false ou um objeto com level.
• true: opta o segmento na validação no nível configurado globalmente (default: só em dev, erros no dev overlay).
• false: desativa a validação para o segmento.
• level: 'warning': único nível disponível hoje; valida só em desenvolvimento, sem afetar o build.
• Requer cacheComponents habilitado; não pode ser usado em Client Components (lança erro).

Code Examples

export const instant = true

export default function Page() {
  return <div>...</div>
}

• O que demonstra: opt-in básico de validação de navegação instantânea.

export const instant = {
  level: 'warning',
}

• O que demonstra: forma expandida com level explícito.

Anti-patterns

• Usar instant sem cacheComponents habilitado: o export só funciona com essa flag ligada.
• Declarar instant em Client Component: gera erro em runtime.
• Confiar no comportamento de dev para prever produção: Next.js não faz prefetch em desenvolvimento, então a sensação de "instantâneo" só reflete a realidade em next start.

Key Takeaways

1. instant é uma ferramenta de diagnóstico/contrato, não uma otimização automática — ela só sinaliza onde a navegação não será instantânea.
2. A validação atual acontece só em dev (level: 'warning'); um nível para build está planejado para o futuro.
3. Use junto do Instant Navigation guide para entender e corrigir os bloqueios apontados.

Connects To

• cacheComponents: pré-requisito de config para instant funcionar.
• prefetch: outra config de segmento relacionada a performance de navegação.