Vercel v4 ve Edge Functions: Serverless'in Yeni Boyutu

Vercel'in yeni platform güncellemesi, edge computing'i bir üst seviyeye taşıyor. Edge Functions ile global CDN ağında çalışan serverless fonksiyonlar, web uygulamalarının performansını radikal şekilde artırıyor.

Edge Functions Nedir?

Edge Functions, kullanıcıya en yakın lokasyonda çalışan serverless fonksiyonlardır. Vercel'in global CDN ağında, 100+ lokasyonda çalışırlar.

Avantajları

**Düşük Latency**: Kullanıcıya yakın çalışma

**Otomatik Scaling**: İhtiyaca göre ölçeklenme

**Global Distribution**: Her kıtada çalışma

**Sıfır Yönetim**: Infrastructure yönetimi yok

Vercel v4 Yenilikleri

1. Improved Edge Runtime

Yeni Edge Runtime özellikleri:

// Edge Function örneği
export const config = {
  runtime: 'edge',
  regions: ['iad1', 'sfo1', 'fra1'],
};

export default async function handler(req: Request) {
  const data = await fetch('https://api.example.com/data');
  return new Response(JSON.stringify(data), {
    headers: { 'Content-Type': 'application/json' },
  });
}

2. Edge Middleware

Request'i işlemeden önce middleware çalıştırma:

// middleware.ts
import { NextResponse } from 'next/server';
import type { NextRequest } from 'next/server';

export function middleware(request: NextRequest) {
  // A/B test
  const variant = request.cookies.get('ab-test')?.value || 'A';
  
  // Geolocation
  const country = request.geo?.country || 'US';
  
  // Redirect
  if (country === 'TR') {
    return NextResponse.redirect(new URL('/tr', request.url));
  }
  
  return NextResponse.next();
}

3. Edge Config

Global key-value store:

import { get } from '@vercel/edge-config';

export async function GET() {
  const featureFlag = await get('new-feature');
  
  if (featureFlag) {
    return new Response('Yeni özellik aktif');
  }
  
  return new Response('Eski sürüm');
}

Kullanım Senaryoları

1. Authentication

export async function middleware(request: NextRequest) {
  const token = request.cookies.get('auth-token');
  
  if (!token && request.nextUrl.pathname.startsWith('/dashboard')) {
    return NextResponse.redirect(new URL('/login', request.url));
  }
  
  return NextResponse.next();
}

2. Rate Limiting

import { Ratelimit } from '@upstash/ratelimit';
import { Redis } from '@upstash/redis';

const ratelimit = new Ratelimit({
  redis: Redis.fromEnv(),
  limiter: Ratelimit.slidingWindow(10, '10 s'),
});

export async function middleware(request: NextRequest) {
  const ip = request.ip ?? '127.0.0.1';
  const { success } = await ratelimit.limit(ip);
  
  if (!success) {
    return new Response('Too Many Requests', { status: 429 });
  }
  
  return NextResponse.next();
}

3. Personalization

export async function middleware(request: NextRequest) {
  const country = request.geo?.country;
  const city = request.geo?.city;
  
  // Kişiselleştirilmiş içerik
  const response = NextResponse.next();
  response.headers.set('x-country', country || 'unknown');
  response.headers.set('x-city', city || 'unknown');
  
  return response;
}

Performans Karşılaştırması

MetrikServerless FunctionEdge FunctionCold Start100-500ms0-50msLatency (US)50-100ms5-20msLatency (Global)200-500ms20-50msCost$$$$$

Next.js Entegrasyonu

// app/api/hello/route.ts
export const runtime = 'edge';

export async function GET() {
  return Response.json({
    message: 'Hello from Edge!',
    region: process.env.VERCEL_REGION,
  });
}

Best Practices

1. Doğru Kullanım

**Edge Functions için ideal:**

Authentication/Authorization

A/B testing

Rate limiting

Request routing

Header manipulation

**Edge Functions için uygun değil:**

Database operations (use API routes)

Heavy computation (use serverless functions)

File uploads (use API routes)

Long-running tasks

2. Error Handling

export async function middleware(request: NextRequest) {
  try {
    // İşlemler
    return NextResponse.next();
  } catch (error) {
    console.error('Edge middleware error:', error);
    return new Response('Internal Server Error', { status: 500 });
  }
}

Sonuç

Vercel v4 ve Edge Functions, serverless computing'i yeni bir seviyeye taşıyor. Özellikle global kullanıcı tabanı olan uygulamalar için latency ve performans açısından büyük avantajlar sunuyor. Projelerinizde doğru yerlerde kullanarak kullanıcı deneyimini önemli ölçüde iyileştirebilirsiniz.