← Справочные архитектуры / reference-architecture / diagrams / content-delivery
Проектирование распределённой архитектуры для повышения производительности веб-сайтов
Введение
В этом руководстве для архитекторов и разработчиков описана комплексная стратегия повышения производительности приложений на уровне L7 (уровень 7). В условиях высокой конкуренции в цифровой среде производительность приложений становится ключевым конкурентным преимуществом бизнеса. Однако главная цель заключается в том, чтобы найти баланс между производительностью и безопасностью.
Хотя это руководство посвящено максимальному повышению скорости и удобства использования (UX), производительность не должна достигаться в ущерб безопасности. Архитекторам необходимо соблюдать баланс между снижением задержек и неизбежными издержками на обработку, связанными со строгими мерами безопасности, такими как защита от DDoS, WAF и Bot Management.
В сценариях с высоким риском безопасность должна иметь приоритет: «бюджет задержки», полученный за счёт этих оптимизаций производительности, целенаправленно направляется на важнейшие механизмы защиты, чтобы приложение оставалось достаточно быстрым для конверсии пользователей и достаточно защищённым для бизнеса.
| Ключевые бизнес-показатели | Почему это важно |
|---|---|
| Вовлечённость и удержание пользователей | Первое впечатление и отказ от использования: Быстрая загрузка сайта является основой положительного пользовательского опыта. Сегодня пользователи ожидают мгновенного доступа к информации, и исследования это подтверждают: значительная часть пользователей уходит с сайта, если он загрузка занимает слишком много времени ↗, напрямую повышая показатель отказов. |
| Формирование дохода и конверсия | Прямое влияние на бизнес: Производительность веб-сайта напрямую влияет на его конверсию, то есть долю посетителей, совершающих целевое действие, например покупку или подписку на рассылку. Более быстрый сайт обеспечивает более высокую конверсию: например, один исследование ↗ обнаружило, что даже сокращение времени загрузки главной страницы на 100 миллисекунд привело к росту конверсии на 1.11%. |
| Органическая видимость и позиции в поиске | Получение трафика и авторитетность: Поисковая оптимизация (SEO) отражает то, как поисковые системы вроде Google учитывают скорость загрузки страницы как один из факторов ранжирования. Сайты, которые загружаются быстрее, как правило, занимают более высокие позиции в результатах поиска, а это увеличивает органический трафик. Инструмент Google Core Web Vitals (CWVs) представляют собой набор метрик, которые измеряют скорость загрузки страницы, интерактивность и визуальную стабильность. Все они напрямую влияют на производительность и могут существенно повысить позицию сайта в результатах поиска. |
| Высокая скорость доставки и надежность | Пользовательский опыт и доверие: Эта метрика сочетает высокий Доля успешных загрузок (Availability/Resiliency) с максимальной Пропускная способность при загрузке (Speed). Для критически важных ресурсов, таких как программное обеспечение, видео или AI модели, это обеспечивает быструю и надёжную доставку файлов пользователям, что напрямую влияет на удобство продукта и доверие клиентов, особенно во время всплесков трафика. |
| Эффективность периферийной сети и контроль расходов | Снижение операционных затрат: Эта метрика в первую очередь измеряется с помощью Cache Hit Ratio (CHR) для крупных файлов. Максимизация CHR снимает нагрузку с origin-сервера, что является ключевым фактором снижения нагрузки на инфраструктуру и достижения значительной Снижение затрат на исходящий трафик данных (например, через Bandwidth Alliance ↗), что напрямую ведет к снижению операционных затрат и повышению прибыльности бизнеса. |
Оценка эффекта: хотя маркетинговые панели (например, Google Analytics) отслеживают бизнес-показатели, Cloudflare Web Analytics и Observatory измеряют факторы производительности. С их помощью можно напрямую связывать улучшения Core Web Vitals (CWV) и Real User Monitoring (RUM) в реальном времени со снижением показателя отказов и ростом конверсии, не жертвуя конфиденциальностью и не полагаясь на тяжелые клиентские скрипты.
Следуя этой архитектуре, организации могут рассчитывать на следующее:
- Улучшение показателей Core Web Vitals (CWV) таких как LCP и INP, которые помогают снизить показатель отказов и увеличить продажи.
- Максимизация Cache Hit Ratio, что снижает нагрузку на исходный сервер, сокращает расходы на инфраструктуру и в целом снижение операционных расходов.
- Обеспечение высокого времени безотказной работы и доступности, а также устойчивость бизнеса даже во время всплесков трафика.
Цели и метрики производительности
Измерение производительности представляет собой непростую задачу ↗, и относится к более широкому бизнес-контексту, в котором Security и Соответствие требованиям ↗ часто являются обязательными требованиями. Организации регулярно проверяют, соответствует ли их архитектура нормативным стандартам (например, резидентность данных ↗ или протоколы шифрования, включая Постквантовая криптография (PQC)) прежде чем открыть возможности повышения производительности.
После того как эти базовые требования безопасности и соответствия выполнены, эффективная оптимизация начинается с измерения «правильных» показателей, которые, что интересно, у каждого свои. Тем не менее большинство сходится на том, что для производительности сайта стоит ориентироваться на метрики, ориентированные на пользователя, с помощью TTFB как диагностический инструмент ↗ для отзывчивости сервера, но при этом отдавая приоритет Core Web Vitals (CWV) ↗ для оценки пользовательского опыта.
Об успешности внедрения свидетельствуют следующие показатели:
| Метрика | Целевое значение (75-й процентиль) | Что измеряется |
|---|---|---|
| Largest Contentful Paint (LCP) | < 2.5 s | Производительность загрузки (видимость главного изображения и текста). |
| Interaction to Next Paint (INP) | < 200 ms | Интерактивность и отклик на действия пользователя. |
| Cumulative Layout Shift (CLS) | < 0.1 | Визуальная стабильность (непредвиденные смещения макета). |
| Время до первого байта (TTFB) | < 800 ms | Отзывчивость сервера (время сети и обработки). Получите полную картину производительности соединений с помощью таких полей, как cf.timings.origin_ttfb_msec чтобы отделить задержку сервера-источника от накладных расходов сети. |
Целевое значение 75-го процентиля составляет на основе предыдущего анализа ↗ для разумного баланса.
Поток данных
Эта диаграмма иллюстрирует жизненный цикл запроса, показывая, как уровни/фазы - Сеть, оптимизация, кеширование и подключение к источнику совместно сводят задержку к минимуму.

В демонстрационных целях архитектура разделена на четыре логических уровня и следует определённым фазы. Для достижения наилучшей совокупной производительности необходимо оптимизировать каждый этап этой цепочки.
1. Пользователь (eyeball client)
Путь к производительности начинается на устройстве клиента. Аппаратное обеспечение устройства, браузер ↗, качество сети и топология определяют начальную отзывчивость. Здесь цель - установить максимально быстрое соединение с сетью Cloudflare.
- Разрешение DNS: Клиентское устройство отправляет DNS-запрос к домену, который проходит через публичный DNS-резолвер и в итоге достигает авторитетного DNS-сервера. Cloudflare глобальная anycast-сеть ↗ направляет запросы к ближайшей точке присутствия (PoP) с помощью глобальный DNS ↗ разрешение имён с минимальной задержкой поиска, включая возможность расширения до континентальный Китай.
- Установление соединения: Клиент устанавливает соединение по IPv4/IPv6 с помощью HTTP/3 (QUIC) и TLS 1.3 - это также позволяет Постквантовая криптография (PQC). Если клиент уже обращался ранее, Возобновление соединения 0-RTT устраняет round-trip во время handshake. Кроме того, Строгая транспортная безопасность HTTP (HSTS) обеспечивает переадресацию на HTTPS на стороне браузера, устраняя лишние обращения к серверу. Как правило, рекомендуется принудительно применять HTTPS-соединения. Кроме того, используя соответствующие Поля TCP, можно реализовать адаптивные стратегии повышения производительности.
- Оптимизация браузера: Такие функции, как Speed Brain (Speculation Rules API) заранее загружают ресурсы, тогда как Early Hints отправляют заголовки Link браузеру в течение "server think time", ускоряя отрисовку страницы.
- Делегирование сторонним сервисам: Zaraz переносит выполнение сторонних инструментов (таких как Google Analytics 4 или Mixpanel) в облако. Это снижает блокировку основного потока на устройстве, значительно улучшая показатель INP.
- Web Analytics (RUM): Используйте Cloudflare Web Analytics для сбора данных о производительности напрямую из браузера пользователя без использования cookie и с приоритетом конфиденциальности. Этот лёгкий JavaScript-маячок предоставляет реальные данные о показателях Core Web Vitals (LCP, INP, CLS) без отслеживания пользователей и хранения состояния на стороне клиента.

2. Сеть и оптимизация (периферийная сеть Cloudflare)
Как только запрос достигает границы сети, Cloudflare обрабатывает и оптимизирует контент, прежде чем отдать его или получить из кеша.
- Управление трафиком: Запрос проверяется. Нормализация URL обеспечивает согласованность, тогда как Redirect Rules или Transform Rules эффективно обрабатывают изменения пути. Waiting Room защищает бэкенд во время значительные всплески трафика, сохраняя доступность.
- Программная настройка: Для сложных сценариев, где стандартных правил недостаточно, Snippets и Workers позволяют выполнять программную настройку. Это даёт возможность выполнять пользовательскую логику кода для изменения заголовков, переписывания URL, оптимизация изображений, или реализовать уникальную логику кэширования прямо на периферии сети. Используйте Service Bindings чтобы обеспечить связь между этими Workers с низкой задержкой и без дополнительных издержек.
- Оптимизация контента: Текстовые ресурсы сжимаются с помощью Compression Rules (Brotli/Gzip). Изображения обрабатываются на лету через Преобразования изображений или Polish чтобы они отдавались в оптимальном для устройства формате (AVIF/WebP) и размере, что значительно улучшает показатели LCP и CLS.
- Оптимизация шрифтов и тегов: Cloudflare Fonts устраняет DNS-запросы и TLS-соединения к Google Fonts, встраивая шрифты прямо в домен. Google Tag Gateway повышает точность измерения рекламных сигналов и уровень конфиденциальности.
- Маршрутизация, доступность и анализ протоколов: Cloudflare управляет одной из самых взаимосвязанные сети ↗ в мире, взаимодействующей более чем с 13 000 сетей и управляющей глобальная магистральная сеть ↗, а также участвует в ряде ведущих Точки обмена интернет-трафиком (IXP) ↗ по всему миру. Мы используем уникальная аналитика ↗ полученных из этого огромного массива данных для динамической оптимизации управления перегрузкой (Congestion Control, CC) на уровне протокола: система автоматически выбирает оптимальный алгоритм и настраивает нужные параметры для каждого соединения исходя из состояния сети в реальном времени. Для динамических запросов, которые невозможно кэшировать, Argo Smart Routing находит самый быстрый путь через сеть до origin-сервера. Custom Errors обеспечивают единообразный фирменный стиль даже при сбоях.

3. Tiered Cache и хранилище (периферийная сеть Cloudflare)
Cloudflare можно организовать по определённой топологии. Этот уровень отвечает за хранение и получение содержимого. Он выступает щитом для origin и высокоскоростным хранилищем для клиента.
- Логика кэширования: Заголовки Cache-Control на источнике, Cache Rules и Уровни кэширования позволяют точно управлять TTL и обработкой строки запроса. Реализуйте стратегии нормализации кеша, чтобы объединять запросы с переменными URL, например с разными маркетинговыми или SEO параметрами, в единый Cache Key, значительно повышая коэффициент попаданий в кэш. URL-адреса для предзагрузки может заранее заполнять кэш критически важными ресурсами с помощью файлов манифеста, что дополнительно снижает задержку. Обратите внимание на поведение и лимиты кеширования по умолчанию.
- Tiered Caching: Если контента нет в локальной точке присутствия (PoP), Cloudflare проверяет топологию кеша более высокого уровня. Smart Tiered Caching и Regional Tiered Cache централизуют соединения, повышая коэффициент попаданий в кэш и снижая нагрузку на origin-сервер в глобальном масштабе. Для более гибкого подхода клиенты Enterprise могут выбрать Custom Tiered Cache топология.
- Выделенный долгосрочный кэш: Cache Reserve продлевает срок жизни больших, редко запрашиваемых объектов (например, изображений, архивного видео, обновлений ПО или статических AI-моделей), перемещая редко используемый контент в постоянное объектное хранилище на базе R2. Это предотвращает вытеснение из-за Least Recently Used (LRU) алгоритмы и позволяет избежать обращений к исходному серверу, увеличивающих задержку, одновременно обеспечивая избыточность хранения и требования к отказоустойчивости.
- Instant Purge: Используйте возможности Cloudflare децентрализованная архитектура очистки кеша ↗ чтобы сбрасывать кеш контента по всему миру примерно за 150 мс. Этот Instant Purge поддерживает различные детализированные подходы, включая очистку кэша по URL, тегу, префиксу или имени хоста (Purge by URL, Tag, Prefix, or Hostname), благодаря чему пользователи сразу получают актуальный контент, не дожидаясь истечения TTL.
- Облачное подключение: Cloud Connector Rules упрощают маршрутизацию трафика к публичным облачным провайдерам (AWS, Azure, GCP) для конкретных задач объектного хранения или origin-серверов. Для частной инфраструктуры Workers VPC обеспечивает прямое подключение к приватным конечным точкам хранилищ или базам данных в публичных облаках (например, AWS, Azure) без публикации их в открытом интернете.
- Хостинг статических ресурсов: Целые части приложения (ресурсы фронтенда, изображения, включая крупные медиафайлы, пакеты ПО) можно хранить напрямую в R2 Object Storage или Workers Static Assets, обслуживая их прямо на периферии сети без обращения к традиционному origin-серверу. Дополнительные варианты хранения доступны.

4. Исходный сервер
Для запросов, которым нужно пройти весь путь (то есть для динамического контента или промахов кеша), итоговое влияние на задержку определяется конфигурацией источника. У архитекторов здесь есть два основных пути: применить производительную, отказоустойчивую бессерверную модель (также известную как originless) или оптимизировать подключение и безопасность для традиционного Origin Server.
Serverless: Cloudflare Developer Platform достигает оптимального уровня производительности за счёт модели «без исходного сервера». Fullstack-приложения создаются и развёртываются непосредственно в глобальной edge-сети по всему миру, что исключает необходимость полного прохождения пути до удалённого origin-сервера. Динамические запросы обрабатываются в ближайшей точке присутствия (PoP) Cloudflare и обеспечивают прямой доступ к интегрированным edge-решения для хранения данных такими как R2 Object Storage и D1 Serverless SQLite Database. Это значительно сокращает TTFB и вносит существенный вклад в достижение строгих целей CWV. Кроме того, эта Originless-модель на основе Workers и R2 представляет собой оптимальную архитектуру для высокопроизводительной раздачи файлов, устраняя необходимость в традиционном backend-сервере для доставки больших наборов данных и медиафайлов.
Традиционная оптимизация источника: Для приложений, которые нельзя переработаны или модернизированы ↗ к модели без origin-сервера необходимы следующие оптимизации для минимизации связанного с этим влияния на задержку традиционной инфраструктуры:
- Подключение: Cloudflare подключается с помощью HTTP/2 to Origin, используя Повторное использование соединений чтобы мультиплексировать запросы через одно постоянное соединение, снижая накладные расходы TCP/TLS. Для повышения надежности и безопасности Cloudflare Network Interconnect (CNI) позволяет подключать вашу сетевую инфраструктуру напрямую к Cloudflare в обход публичного интернета для более производительной и безопасной работы. Кроме того, использование Bandwidth Alliance ↗ (включая партнёров, таких как Microsoft Azure Routing Preference ↗) может значительно снизить или полностью отменить плату за исходящий трафик данных.
- Частная инфраструктура: Workers VPC и Cloudflare Tunnel обеспечивают прямое подключение к приватным конечным точкам хранилищ или базам данных в публичных облаках без обязательной публикации их в открытом интернете.
- Балансировка нагрузки: Трафик распределяется между исправными серверами с помощью Cloudflare Load Balancing. Если источник выходит из строя, трафик мгновенно перенаправляется на исправные пулы серверов. Кроме того, Round-Robin DNS можно использовать для более простых стратегий распределения.

Инструменты и ресурсы
Каждая оптимизация проверяется с помощью непрерывного мониторинга и тестирования. Измерения и журналирование подтверждают реальный эффект, позволяют выявлять регрессии на раннем этапе и обнаруживать пограничные случаи задолго до того, как они затронут клиентов.
При анализе этих данных важно учитывать лимиты подключений и Поведение TCP-соединения, учитывая при этом Краулеры Cloudflare и конечная точка /cdn-cgi/, а также потенциальных расхождения в данных между Cloudflare и Google Analytics.
Инструменты платформы Cloudflare
- Cloudflare Observatory ↗: Основная панель для оценки производительности. Она объединяет синтетические тесты (Google Lighthouse) для получения стандартизированных базовых показателей с мониторингом реальных пользователей (RUM), который фиксирует фактический опыт пользователей на разных устройствах и в разных регионах.
- GraphQL Analytics API: Используйте это для Trends и Timing Insights ↗. Запрашивайте конкретные метрики, такие как
edgeDnsResponseTimeMsпо сравнению сoriginResponseDurationMsчтобы точно определить, на каком этапе возникает задержка. - Web Analytics: Подходит специально для edge-аналитики RUM с приоритетом на приватность.
- Cache Analytics: Важно для анализа Cache Hit Ratio (CHR) и отчета "Requests by Cache Status", чтобы находить некешируемый контент, создающий нагрузку на источник.
- Ruleset Engine: Изучение и использование обширной библиотеки поля, включая такие сетевые метрики, как Поля TCP RTT и TCP, чтобы реализовать точную пользовательскую логику маршрутизации, кэширования и безопасности на основе свойств соединения в реальном времени.
- Журналирование & криминалистика:
- Log Explorer: Для произвольных запросов к логам напрямую в дашборде. Используйте Настраиваемые поля журнала чтобы регистрировать в журнале дополнительные заголовки запросов, заголовки ответов и файлы cookie.
- Logpush: Для экспорта логов в сторонние SIEM с опциональным Параметры вывода журнала, с поддержкой таких форматов, как CSV или JSON. Это необходимо для анализа пользовательских полей и долгосрочных трендов, а также для расчёта Download Success Rate и анализа Download Throughput для больших файлов.
- Instant Logs: Проверка трафика в реальном времени для оперативной отладки.
- Network Error Logging (NEL): Фиксирует проблемы с подключением на стороне клиента, которые сервер может не увидеть.
Открытый исходный код и автоматизация
- Cloudflare Telescope ↗: Кроссбраузерный агент для front-end тестирования с открытым исходным кодом, способный запускать тесты во всех основных браузерах. Используйте его для автоматизации регрессионного тестирования производительности в CI/CD-конвейере.
- Cloudflare Speed Test ↗: Измеряет реальное качество интернет-соединения (включая задержку под нагрузкой, джиттер и потерю пакетов), моделируя реальное использование в глобальной сети Cloudflare с помощью заранее заданных блоков данных, а не просто проверяя пиковую пропускную способность.
- Cloudflare Prometheus Exporter ↗: Собирает метрики из GraphQL Analytics API и предоставляет их в формате, совместимом с Prometheus, что позволяет визуализировать данные о производительности Cloudflare вместе с метриками вашей инфраструктуры в Grafana или аналогичных инструментах.
Инструменты внешней проверки и сравнительного тестирования
Хотя Cloudflare предоставляет собственные метрики, внешние (сторонние) инструменты крайне важны для независимой проверки и детального анализа критического пути рендеринга.
- WebPageTest ↗: Подробные waterfall-диаграммы и глубокий анализ поведения загрузки.
- Google PageSpeed Insights ↗: Стандарт оценки Core Web Vitals (данные Field и Lab).
- DebugBear ↗: Отлично подходит для непрерывного мониторинга и отслеживания истории скорости.
- Pingdom ↗: Подходит для простого тестирования доступности и скорости на основе географического расположения.
- Treo.sh ↗: Быстрая визуализация исторических данных Chrome User Experience Report (CrUX).