Önbellekleme

Bu kurallar, Vercel'in CDN ve ISR önbelleklemesini atlayan, gereksiz sunucu taraflı render'a zorlayan ve işlem maliyetlerini artıran kalıpları tespit eder.

Sürüme göre davranış

Önbellekleme tanıları algılanan Next.js major sürümüne göre uyarlanır:

• Next.js 15: uyarılar, fetch ve GET handler'larının varsayılan olarak önbelleğe alınmadığını vurgular.
• Next.js 16+: uyarılar Cache Components rehberliğine ("use cache", cache tag'leri, hedefli revalidation) öncelik verir.
• Diğer/bilinmeyen sürümler: uyarılar framework bağımsız önbellek politikası rehberliği kullanır.

nextjs-no-side-effect-in-get-handler

Yan etkiler (cookie'leri, header'ları değiştirme veya veritabanı çağrıları) içeren veya /logout, /signout, /delete gibi değiştirici rota segmentlerinde bulunan GET route handler'larını tespit eder.

Neden önemlidir: GET istekleri prefetching tarafından tetiklenebilir ve CSRF'ye karşı savunmasızdır. GET handler'lardaki yan etkiler ayrıca önbelleklemeyi engeller.

// app/api/logout/route.ts
export async function GET() {
  cookies().delete("session");
  return Response.json({ ok: true });
}

// app/api/logout/route.ts
export async function POST() {
  cookies().delete("session");
  return Response.json({ ok: true });
}

Tespit edilen değiştirici rota segmentleri: logout, log-out, signout, sign-out, unsubscribe, delete, remove, revoke, cancel, deactivate.

vercel-no-force-dynamic

export const dynamic = "force-dynamic" içeren sayfaları tespit eder.

Neden önemlidir: force-dynamic, her istekte sunucu taraflı render'ı zorlar ve tam sayfa önbelleklemesini tamamen atlar.

export const dynamic = "force-dynamic";

export default function Page() { ... }

export const revalidate = 3600;

export default function Page() { ... }

vercel-no-no-store-fetch

cache: "no-store" veya revalidate: 0 ile yapılan fetch çağrılarını tespit eder.

Neden önemlidir: Bu seçenekler önbelleklemeyi tamamen devre dışı bırakarak her istekte önbelleğe alınmamış bant genişliği ve işlem maliyetlerini artırır.

const data = await fetch(url, { cache: "no-store" });

const data = await fetch(url, {
  next: { revalidate: 3600 },
});

vercel-missing-cache-policy

Herhangi bir açık önbellek yapılandırması olmayan GET route handler'larını tespit eder — Cache-Control header'ları, revalidate export'u veya dynamic export'u yok.

Neden önemlidir: Açık bir önbellek politikası olmadan yanıtlar CDN önbellekleme fırsatlarını kaçırabilir ve tekrarlayan origin isteklerine neden olabilir.

export async function GET() {
  const data = await fetchData();
  return Response.json(data);
}

export const revalidate = 3600;

export async function GET() {
  const data = await fetchData();
  return Response.json(data);
}

vercel-prefer-get-static-props

getServerSideProps kullanan Pages Router rotalarını tespit eder.

Neden önemlidir: getServerSideProps her istekte çalışır. getStaticProps'a (isteğe bağlı ISR ile) geçmek sayfaları CDN'de önbelleğe alır ve sunucu işlem yükünü azaltır.

vercel-get-static-props-consider-isr

revalidate dönüş değeri olmayan getStaticProps kullanımını tespit eder.

Neden önemlidir: revalidate olmadan tüm sayfalar dağıtım zamanında oluşturulur. Büyük siteler için bu, build süresini dramatik olarak yavaşlatır. ISR sayfaları talep üzerine oluşturur ve önbelleğe alır.

export async function getStaticProps() {
  const data = await fetchData();
  return {
    props: { data },
    revalidate: 3600,
  };
}