Оптимізація CDN і latency reduction
1) Цілі і карта затримок
Latency = DNS + TCP/TLS + TTFB (сервер/оріджин/кеш) + доставка контенту (RTT × обсяги) + рендер клієнта.
Оптимізація = скорочуємо кількість RTT, зменшуємо байти і переносимо обчислення/кеш ближче до користувача.
2) Архітектура CDN
Anycast POPs - ближній вузол по BGP-маршрутизації.
Tiered caching/Origin Shield - «парасольковий» проміжний шар, що знижує miss-шторм на оріджині.
Geo-/Regional routing - прив'язка тенанта/юрисдикції (суверенітет даних, ліцензії).
Failover - резервний оріджин/регіон, health-проби і швидкий перемикач.
3) Кеш: ключі, заголовки, стратегії
3. 1 Ключі кешу (cache key)
Типово: `scheme + host + path +?query`.
Додавайте тільки потрібні параметри ('? v =','? lang =','? tenant ='). Решта - в ignore-params.
'Vary'- мінімальний: 'Accept-Encoding','Accept-Language'( якщо правда потрібен),'Authorization'зазвичай ламає кеш.
3. 2 Політики
Public статика: `Cache-Control: public, max-age = 31536000, immutable'+ rev (hash в імені).
Напівдинаміка (каталоги, правила, FAQ): `s-maxage=300, stale-while-revalidate=600, stale-if-error=86400`.
API-GET: використовуйте ETag/Last-Modified,'SWR/SIE', включайте coalescing (один запит на гарячий ключ).
Private: персональні відповіді - на периметрі через edge-compute (ESI/kv) або пер-тенант кеш.
3. 3 Анти-шторм
Request coalescing - схлопувати одночасні miss запити.
Serve-stale - віддавати застарілий об'єкт при збої ориджина.
Background revalidation - оновлювати в фоні.
4) HTTP/2-3, TCP/TLS і рання віддача
HTTP/2: мультиплекс, стиснення заголовків; обмежте'max concurrent streams', великі заголовки.
HTTP/3 (QUIC): велике зниження TTFB на мобільних/високих втрат; слідкуйте за Initial-порогами і Retry.
TLS 1. 3: 1-RTT handshake; OCSP stapling; HSTS.
0-RTT: тільки для ідемпотентних «GET» і якщо ризики replay враховані.
103 Early Hints: ранні'Link: rel = preload'для критичних ресурсів.
Preconnect / DNS-prefetch: `<link rel="preconnect" href="https://cdn. example">`.
5) Edge-compute і «тонка персоналізація»
На краю: перепис заголовків, гео/тенант-фіксація, A/B-маркування, легка персоналізація без запиту до оріджину.
Правило: не зберігати PII на POP-вузлах; кешувати тільки агрегати/публічні дані.
6) Оптимізація медіа та форматів
Зображення: автоматична конверсія в WebP/AVIF, resize-on-edge,'srcset/sizes','lazyload'.
Компресія: Brotli для текстів (HTML/CSS/JS/JSON), gzip fallback.
Відео: HLS/DASH, CDN-segment caching, `preload=metadata`, постер.
Шрифти: subset + `font-display: swap`; хостити з довгим кешем.
Критичний CSS: інлайн перший екран; решта - async.
7) API-патерни та кешування
Idempotent GET - кешуємо за ключами запиту (включаючи версію даних).
ETag: сильний хеш корисного навантаження +'If-None-Match'.
Surrogate-Control (CDN-специфіка) для відмінності від'Cache-Control'клієнта.
Signed URLs - для приватної статики/медіа.
GraphQL: нормалізуйте кеш-ключ по операції/змінним; використовуйте partial caching/резолвер-кеш.
WebSockets: для real-time - скорочуйте повідомлення, стискайте (permessage-deflate), розташовуйте WS-шарди ближче до користувача.
8) Приклади конфігурацій
8. 1 NGINX (оріджин: кешуємо API-GET)
nginx
We give SWR and ETag location/api/v1/catalog/{
proxy_cache api_cache;
proxy_cache_key "$scheme$request_method$host$uri$is_args$args";
proxy_cache_valid 200 5m;
proxy_cache_use_stale updating error timeout http_500 http_502 http_503 http_504;
add_header Cache-Control "public, s-maxage=300, stale-while-revalidate=600, stale-if-error=86400";
add_header ETag $upstream_http_etag;
proxy_ignore_headers Set-Cookie; # do not break the Set-Cookie proxy_hide_header cache;
proxy_pass http://catalog;
}
8. 2 Fastly VCL (SWR, coalescing, ignore cookies)
vcl sub vcl_recv {
set req. hash_ignore_busy = true; # coalescing if (req. url. qs ~ "^(?!.(lang v)=)") { remove req. url. qs; }
if (req. http. Cookie) { remove req. http. Cookie; }
}
sub vcl_backend_response {
set beresp. ttl = 300s;
set beresp. stale_if_error = 86400s;
set beresp. stale_while_revalidate = 600s;
if (beresp. http. Set-Cookie) { unset beresp. http. Set-Cookie; }
}
8. 3 Cloudflare (Transform Rules, Cache Rules, Early Hints — псевдо)
json
{
"cache_rule": {
"if": "http. request. uri. path matches \"/assets/.\"",
"action": {"cache": {"eligibility":"eligible", "ttl": 31536000}}
},
"transform_rule": {
"set_headers": [{"name":"Cache-Control","value":"public, s-maxage=300, stale-while-revalidate=600"}]
},
"early_hints": {"enable": true}
}
9) Мобільні мережі та «нестійкий» інтернет
Агресивно використовуйте HTTP/3; зменшуйте розмір критичного шляху (HTML + critical CSS <14 KB).
Priority H2/H3: розставте пріоритети (HTML→CSS→JS→media пізніше).
Ретрай-політика з джиттером, idempotency для API.
Size-budgets і бандлінг: код-спліттинг, deferred JS, видалення невикористовуваного CSS/JS.
10) Спостережуваність і SLO
RUM: TTFB, LCP, INP, CLS по регіонах/ASN/тенантам; розподілу p95/p99.
Синтетика: контрольний маршрут «/health/cdn »по POP-ам.
Кеш-метрики: hit-ratio overall и per-key; origin fetch rate; coalescing savings.
Алерти: падіння hit-ratio, зростання origin-egress, деградація H3-часткою, 5xx на shield.
11) Специфіка iGaming/фінансів
Каталоги ігор/коефіцієнти: коротке's-maxage'+ SWR; region-aware ключ (`tenant|region|lang`).
Подієві піки (матчі, розіграші): прогрів кешу (pre-warm), «заморожування» важких персоналізацій, mirror-джерела.
Платіжні/кабінет: не кешувати приватні, але прискорювати через H3 + edge-TLS і близький регіон.
Юрисдикції: розділені домени/шляхи per-регіон; контроль'Vary: X-Region`.
12) Антипатерни
`Vary: 'на все підряд; кеш-ключ залежить від зайвих куки/заголовків.
Відсутність SWR/SIE → «чорні екрани» при коротких збоях оріджина.
Очищення кешу «по всьому» замість точкової інвалідації за тегами/ключами.
Ресурси без ревізії імен і з'max-age = 0'.
Глобальний deny-cache для'Authorization'навіть там, де віддається public.
Відсутність coalescing → шторм на оріджині.
Передчасна «важка» персоналізація на POP.
13) Чек-лист prod-готовності
- Anycast POP + tiered/shield; health-перевірки та origin failover.
- Ключі кешу мінімальні; ігнор зайвих query/cookies;'Surrogate-Control'.
- SWR/SIE включені, coalescing активний; serve-stale при помилках.
- HTTP/3 включений; TLS 1. 3; 103 Early Hints налаштований для критичних ресурсів.
- Зображення: AVIF/WebP, resize-on-edge; Brotli для текстів.
- API-GET с ETag/Last-Modified; ідемпотентність/ретраї; не кешувати приватні профілі.
- Preconnect до доменів статики; критичний CSS інлайн.
- Метрики: hit-ratio, origin-egress, TTFB/LCP p95, H3-частка, по регіонах/тенантах.
- План прогріву кешу перед подіями; точкова інвалідація (теги).
- Документація Vary/keys/TTL; плейбук інцидентів (падіння hit-ratio).
14) TL; DR
Зведіть походи до ориджину до мінімуму: tiered/shield + правильні cache-keys + SWR/SIE + coalescing. Увімкніть HTTP/3/TLS 1. 3, використовуйте 103 Early Hints і preconnect. Стискайте і конвертуйте медіа на краю, інлайньте критичний CSS. Для API - ETag, акуратний'Vary', ідемпотентність і розумне кешування'GET'. Міряйте hit-ratio, TTFB/LCP p95, origin egress і заздалегідь прогрівайте кеш на піках.