Настройка Varnish Cache для ускорения веб-приложения

Наша компания занимается разработкой, поддержкой и обслуживанием сайтов любой сложности. От простых одностраничных сайтов до масштабных кластерных систем построенных на микро сервисах. Опыт разработчиков подтвержден сертификатами от вендоров.

Разработка и обслуживание любых видов сайтов:

Информационные сайты или веб-приложения
Сайты визитки, landing page, корпоративные сайты, онлайн каталоги, квиз, промо-сайты, блоги, новостные ресурсы, информационные порталы, форумы, агрегаторы
Сайты или веб-приложения электронной коммерции
Интернет-магазины, B2B-порталы, маркетплейсы, онлайн-обменники, кэшбэк-сайты, биржи, дропшиппинг-платформы, парсеры товаров
Веб-приложения для управления бизнес-процессами
CRM-системы, ERP-системы, корпоративные порталы, системы управления производством, парсеры информации
Сайты или веб-приложения электронных услуг
Доски объявлений, онлайн-школы, онлайн-кинотеатры, конструкторы сайтов, порталы предоставления электронных услуг, видеохостинги, тематические порталы

Это лишь некоторые из технических типов сайтов, с которыми мы работаем, и каждый из них может иметь свои специфические особенности и функциональность, а также быть адаптированным под конкретные потребности и цели клиента

Услуги, которые мы предлагаем
Показано 1 из 1Все 2062 услуг
Настройка Varnish Cache для ускорения веб-приложения
Средний
~2-3 дня
Часто задаваемые вопросы

Наши компетенции:

Этапы разработки

Последние работы

  • image_website-b2b-advance_0.webp
    Разработка сайта компании B2B ADVANCE
    1360
  • image_web-applications_feedme_466_0.webp
    Разработка веб-приложения для компании FEEDME
    1251
  • image_websites_belfingroup_462_0.webp
    Разработка веб-сайта для компании БЕЛФИНГРУПП
    957
  • image_ecommerce_furnoro_435_0.webp
    Разработка интернет магазина для компании FURNORO
    1188
  • image_crm_enviok_479_0.webp
    Разработка веб-приложения для компании Enviok
    929
  • image_bitrix-bitrix-24-1c_fixper_448_0.webp
    Разработка веб-сайта для компании ФИКСПЕР
    947

Отметим: когда ваш веб-сервер начинает задыхаться при пиковых нагрузках, а время ответа (TTFB) превышает 500 мс — это сигнал, что пора внедрять HTTP-акселератор. Varnish Cache перехватывает запросы до backend и отдаёт кэшированные ответы из оперативной памяти. В результате latency снижается до 1–5 мс, а сервер выдерживает десятки тысяч запросов в секунду. Мы — команда с 5-летним опытом в настройке Varnish, реализовавшая более 100 проектов для highload-сервисов. Правильная настройка Varnish улучшает Core Web Vitals (LCP, INP) и может сэкономить до 500 000 рублей в год на серверной инфраструктуре. Типичный hit rate при корректной VCL достигает 95–99%, а время ответа сокращается в 100 раз по сравнению с прямым обращением к backend.

Проблемы, которые решает Varnish

  • Высокая нагрузка на backend. Без кэширования каждый запрос обрабатывается приложением — база данных, рендеринг, бизнес-логика. Varnish снимает до 90% нагрузки, обслуживая кэшированные страницы напрямую.
  • Медленные динамические страницы. Даже если страница генерируется 200 мс, при 1000 параллельных запросах время ожидания растет. Varnish с фрагментарным кэшированием (ESI) позволяет кэшировать общую часть, а персонализированные блоки подгружать асинхронно. Это сокращает время генерации страницы на 60–80%.
  • Нестабильная работа при пиках трафика. Varnish выступает буфером: если backend временно недоступен, отдаётся устаревшая копия (grace mode). Это предотвращает простои и ошибки 503.

Как Varnish улучшает Core Web Vitals?

Core Web Vitals — метрики, от которых зависит ранжирование в Google. Varnish напрямую влияет на Largest Contentful Paint (LCP) и Interaction to Next Paint (INP). При кэшировании HTML-страниц LCP падает с 2–3 секунд до 200–300 мс. INP улучшается за счёт того, что сервер быстрее отдаёт контент, уменьшая задержку для скриптов. На одном из проектов hit rate вырос с 40% до 98% после корректировки VCL.

Grace mode: зачем он нужен?

Grace mode — это механизм, позволяющий отдавать устаревший кэш, если backend не ответил вовремя. Как указано в документации Varnish: Grace mode позволяет отдавать устаревший кэш, предотвращая ошибки 503. Настройка beresp.grace = 6h даёт 6 часов на восстановление, в течение которых Varnish продолжает отдавать старую копию. Это критично для highload-проектов, где каждая секунда простоя стоит денег.

Когда Varnish не нужен?

Varnish не эффективен для сайтов с полностью персонализированным контентом (личный кабинет, онлайн-банкинг), где каждый запрос требует уникальных данных. В таких случаях лучше использовать кэширование на уровне приложения (Redis, Memcached) или CDN. Однако даже для таких проектов Varnish может кэшировать статику и общие блоки.

Базовая конфигурация VCL

# Debian/Ubuntu
apt install varnish

# /etc/varnish/default.vcl
vcl 4.1;

import std;

backend default {
    .host = "127.0.0.1";
    .port = "8080";
    .first_byte_timeout = 60s;
    .connect_timeout = 5s;
    .between_bytes_timeout = 10s;
}

# Несколько бэкендов с балансировкой
import directors;

backend app1 { .host = "10.0.0.1"; .port = "8080"; }
backend app2 { .host = "10.0.0.2"; .port = "8080"; }

sub vcl_init {
    new cluster = directors.round_robin();
    cluster.add_backend(app1);
    cluster.add_backend(app2);
}

sub vcl_recv {
    set req.backend_hint = cluster.backend();

    # Нормализация URL (удалить trailing slash кроме корня)
    if (req.url ~ "^(/[^?]+)/$") {
        set req.url = regsub(req.url, "/$", "");
    }

    # Не кэшировать admin-панель
    if (req.url ~ "^/admin") {
        return (pass);
    }

    # Не кэшировать авторизованных пользователей (если контент персонализирован)
    if (req.http.Authorization || req.http.Cookie ~ "session_id|auth_token") {
        return (pass);
    }

    # Удалить маркетинговые параметры из ключа кэша
    set req.url = regsuball(req.url, "(\\?|&)(utm_source|utm_medium|utm_campaign|utm_content|fbclid|gclid)=[^&]+", "");
    set req.url = regsub(req.url, "\\?&", "?");
    set req.url = regsub(req.url, "\\?$", "");

    # Нормализовать Accept-Encoding
    if (req.http.Accept-Encoding) {
        if (req.url ~ "\\.(gif|jpg|jpeg|png|webp|avif|ico|zip|gz|mp4)$") {
            unset req.http.Accept-Encoding;
        } elsif (req.http.Accept-Encoding ~ "br") {
            set req.http.Accept-Encoding = "br";
        } elsif (req.http.Accept-Encoding ~ "gzip") {
            set req.http.Accept-Encoding = "gzip";
        } else {
            unset req.http.Accept-Encoding;
        }
    }
}

sub vcl_backend_response {
    # Кэшировать 404 ненадолго
    if (beresp.status == 404) {
        set beresp.ttl = 30s;
        return (deliver);
    }

    # Кэшировать только успешные ответы
    if (beresp.status != 200 && beresp.status != 301 && beresp.status != 302) {
        set beresp.uncacheable = true;
        return (deliver);
    }

    # Если backend не прислал Cache-Control — установить по умолчанию
    if (!beresp.http.Cache-Control) {
        if (bereq.url ~ "\\.(css|js|woff2|png|jpg|svg)$") {
            set beresp.ttl = 30d;
        } else {
            set beresp.ttl = 5m;
        }
    }

    # Grace period: отдавать устаревший кэш при backend сбое
    set beresp.grace = 6h;

    # Сжатие
    if (beresp.http.content-type ~ "text/(html|css|javascript|xml|plain)" ||
        beresp.http.content-type ~ "application/(json|javascript)") {
        set beresp.do_gzip = true;
    }

    # Не хранить Set-Cookie в кэше
    unset beresp.http.Set-Cookie;
}

sub vcl_deliver {
    # Debug заголовок (отключить в production)
    if (obj.hits > 0) {
        set resp.http.X-Cache = "HIT " + obj.hits;
    } else {
        set resp.http.X-Cache = "MISS";
    }

    # Скрыть внутренние заголовки от клиента
    unset resp.http.X-Varnish;
    unset resp.http.Via;
    unset resp.http.X-Powered-By;
}

sub vcl_hit {
    if (obj.ttl >= 0s) { return (deliver); }
    # Grace: отдать устаревший объект
    if (obj.ttl + obj.grace > 0s) { return (deliver); }
    return (restart);
}

Инвалидация кэша: PURGE, BAN, ESI

acl purge_acl {
    "127.0.0.1";
    "10.0.0.0"/8;
}

sub vcl_recv {
    if (req.method == "PURGE") {
        if (!client.ip ~ purge_acl) {
            return (synth(405, "Not allowed"));
        }
        return (purge);
    }

    if (req.method == "BAN") {
        if (!client.ip ~ purge_acl) {
            return (synth(405, "Not allowed"));
        }
        ban("req.http.host == " + req.http.host + " && req.url ~ " + req.url);
        return (synth(200, "Ban added"));
    }
}

Использование из приложения:

# Инвалидировать конкретный URL
curl -X PURGE http://localhost/page/about

# Инвалидировать по паттерну (BAN)
curl -X BAN -H "Host: company.com" http://localhost/category/

ESI (Edge Side Includes)

sub vcl_backend_response {
    if (beresp.http.Surrogate-Control ~ "ESI/1.0") {
        set beresp.do_esi = true;
    }
}

Процесс настройки, типичные ошибки и что входит в работу

Процесс настройки

  1. Аудит приложения: анализ URL, cookies, сессий, частоты обновления.
  2. Проектирование VCL: правила кэширования, TTL, grace, ESI.
  3. Тестирование на staging: замер hit rate, нагрузка на backend.
  4. Деплой: настройка systemd, выделение памяти, мониторинг.
  5. Мониторинг и оптимизация: varnishstat, Prometheus, корректировка VCL.
Чек-лист аудита приложения перед настройкой Varnish
  • Анализ структуры URL и параметров
  • Выявление динамических и статических страниц
  • Проверка использования cookies и сессий
  • Определение частоты обновления контента
  • Выявление узких мест в производительности backend

Типичные ошибки и рекомендации

Ошибка Решение
Игнорирование нормализации URL Добавить нормализацию trailing slash в vcl_recv
Кэширование авторизованных страниц Проверять cookies и Authorization header, return(pass) для персонализированного контента
Слишком длинный TTL для динамики Установить разумный TTL (1–5 минут) для страниц с часто меняющимся контентом
Тип контента TTL Grace ESI Пример URL
Статика (CSS, JS, картинки) 30 дней 12ч Нет /static/css/app.css
Страницы каталога 5 минут Да (для фильтров) /catalog/phones/
Персонализированные страницы 0 (pass) - Нет /account/

Что входит в работу

  • Аудит текущей архитектуры и выявление узких мест
  • Проектирование и написание VCL-конфигурации с учётом специфики проекта
  • Настройка балансировки и grace mode
  • Реализация PURGE/BAN-инвалидации и ESI при необходимости
  • Тестирование на staging и замер производительности
  • Деплой в production и настройка мониторинга (Prometheus + Grafana)
  • Документация и обучение команды
  • Гарантийная поддержка после внедрения

Сроки и стоимость

Базовая настройка Varnish с типовой VCL занимает 1–2 рабочих дня. Для проектов с нестандартной архитектурой, ESI или сложными правилами инвалидации — 2–3 дня. Стоимость рассчитывается индивидуально после аудита. Средняя экономия серверных ресурсов — 30-40%, что снижает расходы на хостинг на 200 000-400 000 руб. в год.

Закажите настройку Varnish и получите консультацию — мы поможем увеличить производительность вашего сайта. Свяжитесь с нами, чтобы обсудить ваш проект.

Для углублённого изучения VCL мы рекомендуем документацию Varnish.

Почему Core Web Vitals критичны для технического SEO

PageSpeed показывает 34/100 на мобильных. В Search Console — красные метрики по всем страницам категорий. Конкурент с сайтом на 3 года старше стоит выше в выдаче, несмотря на более слабые тексты. Техническая производительность стала прямым ранжирующим фактором — и разрыв между «приемлемо» и «быстро» стоит позиций. Мы решали эту проблему для десятков проектов — от интернет-магазинов до SaaS-платформ — и знаем, какие ошибки съедают ранжирование.

Core Web Vitals: что реально влияет на позиции

Google использует три метрики как сигналы ранжирования (Page Experience): LCP (Largest Contentful Paint), CLS (Cumulative Layout Shift), INP (Interaction to Next Paint, заменил FID с последнего крупного обновления алгоритма).

LCP: почему 8 секунд — это не проблема изображения

LCP измеряет время отрисовки самого большого видимого элемента страницы. Чаще всего — hero image или H1. Пороги: хорошо < 2.5s, плохо > 4s.

Типичный диагноз на реальном проекте: интернет-магазин одежды, LCP 7.8s на мобильных. Элемент — hero image категории, 4.2MB JPEG без srcset, загружается через CSS background-image (не <img>). Проблема здесь двойная: во-первых, браузер не может preload CSS background images через <link rel="preload"> стандартным способом. Во-вторых, 4.2MB на мобильном соединении — это физически медленно.

Решение по шагам:

  1. Переносим hero из CSS background в <img> с fetchpriority="high" и loading="eager"
  2. Конвертируем в WebP, добавляем srcset: 800w для мобильных, 1400w для десктопа
  3. <link rel="preload" as="image" href="hero-800.webp" media="(max-width: 768px)"> в <head>
  4. Убираем все render-blocking скрипты выше hero через defer

Итог: LCP 7.8s → 1.9s. Без смены хостинга, без CDN.

Если LCP — не изображение, а текстовый блок: проблема может быть в TTFB (медленный сервер), в render-blocking CSS/JS, или в web fonts с font-display: block.

CLS: смещения, которые раздражают пользователя и Google

CLS измеряет суммарный сдвиг элементов в процессе загрузки. Пороги: хорошо < 0.1, плохо > 0.25. CLS 0.35 — это баннер, который появляется через секунду и сдвигает всё содержимое страницы вниз.

Источники CLS:

  • Изображения без заданных размеров. <img src="photo.jpg"> без width и height — браузер не резервирует место, контент прыгает при загрузке. Фикс: явные width/height или aspect-ratio в CSS.
  • Рекламные блоки и виджеты. Google Ads, чат-виджеты, cookie consent — всё, что появляется после основного контента. Решение: резервировать место через min-height или загружать до рендера основного контента.
  • Web fonts. FOUT (Flash of Unstyled Text) и FOIT (Flash of Invisible Text) могут вызывать переформатирование. font-display: swap с size-adjust (CSS свойство для выравнивания размеров fallback шрифта) минимизирует CLS.
  • Динамический контент. Если блок появляется после загрузки (fetch данных, lazy load) — добавляем skeleton placeholder с нужными размерами.
Типичный сценарий CLS до CLS после Основной фикс
Баннер скидок без min-height 0.42 0.02 min-height: 300px
Картинки в статьях без атрибутов 0.18 0.01 width/height + aspect-ratio
Виджет чата, загружаемый через 3с 0.35 0.05 position: fixed с зарезервированным отступом

INP: почему интерфейс «зависает» на 500ms

INP измеряет задержку ответа на любое взаимодействие пользователя: клик, тап, ввод. Пороги: хорошо < 200ms, плохо > 500ms. INP 680ms — это когда пользователь нажимает кнопку фильтра, а ничего не происходит полсекунды.

Главная причина высокого INP — заблокированный main thread. JavaScript-бандл 2.1MB парсируется и выполняется синхронно. Пока выполняется, пользовательские события не обрабатываются.

Диагностика через Chrome DevTools → Performance → взаимодействие с подозрительной задержкой → найти Long Tasks (> 50ms). Типичные виновники:

  • Непрерывная обработка большого списка без requestIdleCallback или requestAnimationFrame
  • Тяжёлые event listeners без debounce/throttle
  • Синхронный setState в React, который триггерит полный ре-рендер сложного дерева компонентов
  • Third-party scripts: livechat, аналитика, виджеты — они исполняются в том же main thread

Решения: code splitting через динамический import(), перенос тяжёлых вычислений в Web Workers, React.memo + useMemo для предотвращения лишних ре-рендеров, scheduler API для приоритизации задач.

Schema.org: разметка, которую читают роботы

Структурированные данные через JSON-LD — не прямой ранжирующий фактор, но дают rich snippets в выдаче (звёзды рейтингов, цены, дата публикации), что увеличивает CTR на 20–30%.

Типы разметки по сценариям:

  • E-commerce: Product с offers (цена, наличие, валюта), aggregateRating (рейтинг из отзывов), brand. BreadcrumbList для навигации. ItemList для страниц категорий.
  • Статьи и блог: Article или BlogPosting с author, datePublished, dateModified, image. Organization и WebSite на главной странице — помогают Google связать сайт с брендом.
  • Локальный бизнес: LocalBusiness с address, telephone, openingHours, geo. Критично для локального SEO.
  • FAQ: FAQPage с mainEntity — вопросы и ответы могут появляться прямо в выдаче как раскрывающийся блок.

Валидация: Google Rich Results Test и Schema Markup Validator. Частая ошибка — указать price без priceCurrency, или ratingValue без reviewCount. Google игнорирует неполную разметку.

Как проводить технический SEO-аудит

Сканируемость. robots.txt блокирует нужные страницы (или наоборот, не блокирует служебные). Canonical URLs настроены неправильно — дублируются страницы с UTM-метками. Sitemap содержит страницы с noindex. Всё это Screaming Frog или Sitebulb покажут за час сканирования.

Core Web Vitals в масштабе. Google Search Console → Core Web Vitals → смотрим не отдельные страницы, а группы URL (шаблон страницы продукта, шаблон категории, блог). Проблема обычно системная — одна ошибка в шаблоне портит сотни страниц.

JavaScript SEO. Google рендерит JavaScript, но с задержкой (иногда дни для полного рендера). Для критичного контента — SSR или SSG обязательны. Проверяем через Search Console → Inspect URL → View Crawled Page: что видит Googlebot.

Internal linking. Орфанные страницы (нет входящих внутренних ссылок) теряют PageRank. Битые ссылки (404) — сигнал качества.

Типичные ошибки при внедрении Schema.org
  • Указан price без priceCurrency — разметка игнорируется.
  • ratingValue без reviewCount — в выдаче не показывается.
  • Несколько Product на одной странице без @type: ItemList — Google берёт только первый.
  • JSON-LD в GTM — Google не всегда видит динамическую разметку, лучше серверный рендеринг.
Этап работы Что входит Срок
Аудит Сканирование, анализ Core Web Vitals, аудит Schema, отчёт с приоритетами 1–2 недели
Оптимизация одного шаблона LCP, CLS, INP, внедрение SSR/SSG, настройка preload 2–4 недели
Полная техническая оптимизация Все шаблоны, code splitting, Web Workers, мониторинг в CI 4–10 недель
Внедрение Schema.org JSON-LD генерация, валидация, тестирование rich snippets 1–3 недели

Что входит в работу

  • Документация: отчёт с найденными проблемами, roadmap по приоритетам, тайминги для каждого этапа.
  • Доступы: настройка мониторинга (SpeedCurve, Sentry Search Console), передача dashboard.
  • Обучение: разбор типичных ошибок для вашей команды (1–2 созвона).
  • Поддержка: сопровождение в течение месяца после деплоя — проверка метрик, фикс регрессий.

Свяжитесь с нами — мы оценим ваш проект за 2 дня и покажем, сколько позиций можно вернуть за счёт технического SEO. Опыт работы с проектами уровня сотен тысяч посещений в месяц — гарантируем измеримый результат в Core Web Vitals до/после. Закажите аудит в этой форме — получите персональный чек-лист из 15 пунктов.