Оптимізація завантаження сайту для різних регіонів (Edge Computing)

Оптимізація завантаження веб-сайту для різних регіонів (Edge Computing)

Edge Computing перевносить частину обчислень з централізованого сервера на граничні вузли CDN. Замість того щоб кожен запит летів у дата-центр у Москві, він обробляється на найближчому до користувача Edge-вузлі — у Новосибірську, Берліні чи Токіо.

Що можна запускати на Edge

Cloudflare Workers: геопersоналізація

// workers/geo-personalization.js
export default {
  async fetch(request, env) {
    const country = request.cf.country;
    const city    = request.cf.city;

    // Отримуємо відповідь від origin
    const response = await fetch(request);
    const html     = await response.text();

    // Підставляємо регіональний контент
    const personalized = html
      .replace('{{COUNTRY}}', country)
      .replace('{{SHIPPING_NOTICE}}', getShippingNotice(country))
      .replace('{{CURRENCY}}', getCurrency(country));

    return new Response(personalized, {
      headers: response.headers,
      status:  response.status,
    });
  }
};

function getShippingNotice(country) {
  const notices = {
    'RU': 'Безкоштовна доставка у Росії від 3 000 ₽',
    'DE': 'Безкоштовна доставка від 50 €',
    'US': 'Free shipping on orders over $50',
  };
  return notices[country] ?? 'Free international shipping';
}

Vercel Edge Middleware: редиректи та локалізація

// middleware.ts (Next.js)
import { NextResponse } from 'next/server';
import type { NextRequest } from 'next/server';

export function middleware(request: NextRequest) {
  const url = request.nextUrl.clone();

  // Редирект мови на основі геолокації
  const country  = request.geo?.country ?? 'US';
  const locale   = countryToLocale(country);

  if (url.pathname === '/') {
    url.pathname = `/${locale}`;
    return NextResponse.redirect(url, { status: 302 });
  }

  // Edge A/B тестування
  const bucket = request.cookies.get('ab_bucket')?.value
    ?? (Math.random() < 0.5 ? 'a' : 'b');

  const response = NextResponse.next();
  response.cookies.set('ab_bucket', bucket, { maxAge: 86400 * 30 });
  response.headers.set('X-AB-Bucket', bucket);

  return response;
}

export const config = {
  matcher: ['/', '/(ru|en|de|fr)/:path*'],
  runtime: 'edge',  // виконується на Edge, не на Node.js сервері
};

Edge KV Storage: кеш регіональних даних

Cloudflare Workers KV — глобальне сховище key-value з репліцією на всі Edge-вузли. Затримка читання < 1ms:

// Кешуємо дані про ціни за регіонами
async function getRegionalPricing(country, env) {
  const cacheKey = `pricing:${country}`;
  const cached   = await env.PRICING_KV.get(cacheKey, 'json');

  if (cached) return cached;

  // Запитуємо у origin
  const pricing = await fetch(`https://api.example.com/pricing?country=${country}`)
    .then(r => r.json());

  // Кешуємо на 1 годину
  await env.PRICING_KV.put(cacheKey, JSON.stringify(pricing), { expirationTtl: 3600 });

  return pricing;
}

Durable Objects: SSR на Edge

Для веб-сайтів із SSR (Next.js, Nuxt, Remix) Cloudflare Pages + Workers дозволяє запускати серверний рендеринг на Edge-вузлах без централізованого сервера:

User (Tokyo) → Cloudflare Edge Tokyo
                    ↓ SSR тут, не у Москві
               Rendered HTML → User

Затримка TTFB зменшується з 300–500ms до 50–80ms для користувачів у регіонах.

Метрики для вимірювання ефективності

До та після впровадження Edge-оптимізації:

• TTFB (Time to First Byte) — ключова метрика, має зменшитися
• FCP (First Contentful Paint) — впливає на сприйняття швидкості
• Core Web Vitals за регіонами в Google Search Console

Інструменти вимірювання

# Вимірювання TTFB з різних регіонів через curl
curl -w "\nTTFB: %{time_starttransfer}s\nTotal: %{time_total}s\n" \
  -o /dev/null -s https://example.com

# Або через WebPageTest з регіоном
# https://www.webpagetest.org — виберіть Test Location: Moscow, Frankfurt, Singapore

Тривалість

Базова Edge-оптимізація (редиректи, геолокалізація через Cloudflare Workers): 3–5 днів. Перенесення SSR на Edge (Cloudflare Pages + Workers): 10–15 днів.