Налаштування Synthetic Monitoring: захист критичних шляхів від збоїв

Наша компанія займається розробкою, підтримкою та обслуговуванням сайтів будь-якої складності. Від простих односторінкових сайтів до масштабних кластерних систем, побудованих на мікро сервісах. Досвід розробників підтверджено сертифікатами від вендорів.

Розробка та обслуговування будь-яких видів сайтів:

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

Це лише деякі з технічних типів сайтів, з якими ми працюємо, і кожен із них може мати свої специфічні особливості та функціональність, а також бути адаптованим під конкретні потреби та цілі клієнта.

Послуги, які ми пропонуємо
Показано 1 з 1Усі 2062 послуг
Налаштування Synthetic Monitoring: захист критичних шляхів від збоїв
Середній
~2-3 дні
Часті запитання

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

Етапи розробки

Останні роботи

  • image_website-b2b-advance_0.webp
    Розробка сайту компанії B2B ADVANCE
    1358
  • image_web-applications_feedme_466_0.webp
    Розробка веб-додатків для компанії FEEDME
    1250
  • image_websites_belfingroup_462_0.webp
    Розробка веб-сайту для компанії БЕЛФІНГРУП
    956
  • 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

Як Synthetic Monitoring захищає критичні шляхи від збоїв

Уявіть: посеред робочого дня падає форма оформлення замовлення. Uptime-моніторинг показує 200 OK, але користувачі не можуть оплатити. Ми впроваджуємо Synthetic Monitoring — браузерний моніторинг, який кожні 5-15 хвилин проходить ключові сценарії та б'є тривогу при помилці. За 5 років практики на 50+ проектах ми відпрацювали схему, яка ловить збої до того, як їх помітить бізнес. Synthetic Monitoring імітує дії реального користувача: відкриває браузер, проходить за сценарієм (оформлення замовлення) і записує час кожного кроку, наявність помилок і скріншоти. Це виявляє проблеми, невидимі для uptime-моніторингу: зламаний JavaScript, змінений селектор, повільну відповідь API. За даними State of Synthetic Monitoring, 78% компаній уже використовують синтетичні перевірки для критичних сценаріїв. Synthetic Monitoring відповідає на питання «чи працює бізнес?», а не просто «чи відповідає сервер?». Це ключовий елемент Business Continuity.

На типовому e-commerce сайті ми налаштовуємо 5-7 сценаріїв: пошук, картка товару, кошик, checkout, підтвердження замовлення. Для SaaS — логін, створення ресурсу, ключова дія. Кожен сценарій виконується з кількох регіонів, щоб відсікти випадкові мережеві помилки.

Різниця з uptime моніторингом

Простий ping на GET / не є synthetic monitoring. Він відповідає лише на питання «чи живий сервер». Synthetic Monitoring перевіряє бізнес-функції:

  • Реєстрація нового користувача
  • Пошук і видача результатів
  • Додавання товару в кошик
  • Проходження checkout

Такі автоматичні перевірки надають метрики доступності та продуктивності кожного кроку. Це безпосередньо впливає на виручку: якщо checkout зламаний, сайт втрачає гроші. Одна година простою checkout може коштувати бізнесу мільйони гривень, залежно від трафіку та середнього чека.

Які критичні шляхи ми моніторимо

Тип сайту Критичні шляхи Частота перевірок
E-commerce Пошук → товар → кошик → checkout Кожні 5-10 хв
E-commerce Логін → особистий кабінет → історія замовлень Кожні 15 хв
SaaS Логін → дашборд → створення проекту Кожні 5 хв
SaaS API-ендпоінти для B2B клієнтів Кожні 1 хв
Контент-сайт Пошук → стаття → форма підписки Кожні 15 хв

Чому ми обираємо Playwright + Checkly?

Playwright — сучасний фреймворк для браузерної автоматизації. Він працює з Chromium, Firefox, WebKit. Playwright виконує тести в 2-3 рази швидше за Puppeteer завдяки паралельним контекстам і ефективному управлінню браузером. У поєднанні з Checkly (managed-платформа) ми отримуємо запуск тестів з 10+ регіонів світу, знімки екрану при помилці, трейс водоспаду запитів, інтеграцію з PagerDuty, Slack, Opsgenie.

Приклад скрипту для перевірки checkout:

// checkly: checkout-flow.spec.js
const { chromium } = require('playwright')
const { expect } = require('@playwright/test')

async function checkoutFlow() {
  const browser = await chromium.launch()
  const page = await browser.newPage()
  
  try {
    // Открыть каталог
    await page.goto('https://example.com/catalog')
    await expect(page.locator('.product-grid')).toBeVisible()
    
    // Выбрать первый товар
    await page.locator('.product-card').first().click()
    await expect(page.locator('[data-testid="product-title"]')).toBeVisible()
    
    // Добавить в корзину
    await page.locator('[data-testid="add-to-cart"]').click()
    await expect(page.locator('[data-testid="cart-count"]')).toContainText('1')
    
    // Перейти в корзину
    await page.goto('https://example.com/cart')
    await expect(page.locator('.cart-items')).toContainText('1 товар')
    
    console.log('Checkout flow: PASS')
  } finally {
    await browser.close()
  }
}

Що входить у налаштування Synthetic Monitoring під ключ

  • Аудит критичних шляхів: разом з вами визначаємо 5-7 сценаріїв, від яких залежить бізнес
  • Написання Playwright-тестів з обробкою помилок і асертами
  • Налаштування managed-платформи (Checkly або Datadog) або self-hosted на GitHub Actions
  • Інтеграція алертів у PagerDuty, Telegram, Slack
  • Управління тестовими даними: створення тестового користувача, очищення замовлень, виключення з аналітики
  • Документація по запуску та підтримці
  • Навчання команди (1 година відеоконференції)

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

Self-hosted варіант: GitHub Actions + Playwright

Якщо бюджет обмежений, розгортаємо моніторинг на GitHub Actions. Код у репозиторії, запуск по cron кожні 5-15 хвилин:

name: Synthetic Monitoring
on:
  schedule:
    - cron: '*/5 * * * *'
  workflow_dispatch:
jobs:
  check-critical-paths:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - name: Install Playwright
        run: npx playwright install chromium
      - name: Run synthetic checks
        run: npx playwright test tests/synthetic/
      - name: Notify on failure
        if: failure()
        run: curl -X POST "$SLACK_WEBHOOK" -d '{"text":"FAILED"}'

Обмеження: GitHub Actions cron не гарантує секундної точності (затримка до 5-15 хвилин). Для time-critical сценаріїв використовуйте managed-сервіси.

Як Synthetic Monitoring запобігає падінню виручки?

Реальний кейс: у клієнта-рітейлера після оновлення CMS зламався крок вибору способу доставки. Uptime-моніторинг мовчав (200 OK), а замовлення не оформлювалися 4 години. Synthetic-перевірка виявила проблему за 5 хвилин після деплою. Завдяки швидкому зворотному зв'язку downtime був зведений до мінімуму, що врятувало бізнес від втрати мільйонів гривень на місяць.

Ще один приклад: як ми запобігли збою на SaaS-платформі На одному проекті зміна API повернула 500 помилку на ендпоінті створення проекту. Synthetic-тест, що запускається кожні 5 хвилин, зафіксував падіння через 2 хвилини після деплою. Розробники отримали алерт і відкотили зміну за 10 хвилин. Без моніторингу простій тривав би до 2 годин.

Етапи робіт і терміни

  1. Аналітика (1 день): визначаємо критичні шляхи, узгоджуємо тестові дані
  2. Розробка тестів (1-2 дні): пишемо Playwright-скрипти, налаштовуємо середовище
  3. Інтеграція платформи (1 день): Checkly / Datadog / GitHub Actions + алерти
  4. Тестування (0.5 дня): прогін тестів, коригування таймаутів і локаторів
  5. Деплой і передача (0.5 дня): документація, навчання, передача доступу

Загальний термін — від 2 до 5 робочих днів залежно від кількості сценаріїв. Оцінимо ваш проект безкоштовно — напишіть на пошту або в месенджер.

Управління тестовими даними

  • Окремий synthetic-користувач з production-акаунтом
  • Платіжний метод: тестова картка (Stripe 4242)
  • Замовлення позначаємо тегом synthetic і виключаємо зі звітів
  • Щоденне очищення кошика та чернеток через API

Метрики та алерти

Метрика Опис Поріг спрацьовування
Availability % Відсоток успішних прогінок < 99% → warning, < 95% → critical
Step duration Час кожного кроку (P95) > 3 сек → warning, > 5 сек → critical
Total flow duration Загальний час сценарію > 10 сек → warning, > 20 сек → critical
First failure step На якому кроці сталася помилка Будь-яка помилка → critical

Алерти: якщо 2 з 3 перевірок з різних регіонів завершилися помилкою — critical в PagerDuty. Налаштовуємо ескалацію до команди за 5 хвилин.

Готові впровадити Synthetic Monitoring і захистити ваш бізнес від простоїв? Зв'яжіться з нами — оцінимо проект за один день. Отримайте консультацію інженера — розповімо, як убезпечити ваш проект.

Чому юніт-тести важливі, але не панацея?

Баг, знайдений юніт-тестом, коштує хвилини виправлення. Той самий баг у продакшені — години інциденту, компенсації та втрата довіри. На проекті інтернет-магазину помилка в розрахунку знижки пройшла ручне тестування, потрапила в прод і за 4 години обробила 37 замовлень за нульовою ціною. Автотест на граничні випадки розрахунку зловив би її при першому ж push. Оцініть свій проект — ми проведемо аудит поточного покриття і дамо рекомендації.

Jest — стандарт для JavaScript/TypeScript, але юніт-тести виправдані тільки там, де є ізольована логіка: функції трансформації, валідатори, бізнес-правила, утиліти. Тестувати React-компоненти через Jest + Testing Library правильно для поведінкових тестів: «кнопка з'являється після завантаження», «форма показує помилку при порожньому email». Снепшот-тести (toMatchSnapshot) — пастка: вони ламаються при будь-якій зміні верстки і стають шумом, який розробники оновлюють не дивлячись. Покриття коду (code coverage) — погана метрика якості: 80% coverage можна отримати тестами, які нічого не перевіряють. Coverage показує, що код виконався, а не те, що він працює правильно.

Критерій Jest Vitest
Швидкість для великих проектів Середня (Babel-трансформація) В 10–20 разів швидше (ES modules)
Інтеграція з Vite Через плагін Нативна
Монорепозиторії Вимагає конфігурації З коробки

Vitest як альтернатива Jest для Vite-проектів: в 10–20 разів швидше завдяки нативним ES modules без трансформації через Babel. Для монорепозиторіїв з тисячами тестів різниця у швидкості відчутна. Детальніше про юніт-тестування.

Як налаштувати E2E тести, які не будуть flaky?

Playwright обійшов Cypress за ключовими параметрами: нативна підтримка multi-tab, multi-origin, iframe; паралельне виконання на рівні тестів; WebKit, Firefox, Chromium з коробки; немає iframe для додатку — тести працюють в реальному браузері.

Playwright codegen записує дії та генерує тест — хороша точка старту, але згенерований код потрібно рефакторити. Локатори за text content крихкі: getByRole('button', { name: 'Оформить заказ' }) — стійкіше, ніж locator('.btn-primary').

Page Object Model — стандарт організації E2E тестів. Кожна сторінка — окремий клас з методами замість прямих локаторів. Коли кнопка переїхала з хедера в сайдбар — міняємо в одному місці, не шукаємо по всіх тестах.

Як уникнути flaky тестів? Типова проблема — flaky tests. Причини: race condition між запитом і рендером, анімації без очікування, залежність від зовнішніх API. Рішення: `page.waitForResponse()` замість `page.waitForTimeout()`, мокування зовнішніх API через `page.route()`.
// Погано
await page.click('#submit');
await page.waitForTimeout(2000);
await expect(page.locator('.success')).toBeVisible();

// Добре
await page.click('#submit');
await page.waitForResponse(resp =>
  resp.url().includes('/api/orders') && resp.status() === 201
);
await expect(page.getByRole('alert', { name: /заказ создан/i })).toBeVisible();

Наші інженери гарантують стабільність тестів у CI. Документація Playwright — основний інструмент на проектах з мільйонами користувачів.

Навантажувальне тестування з k6

k6 — інструмент для навантажувального тестування з JavaScript API. Сценарії пишуться як код, версіонуються в git, запускаються в CI. Три основних сценарії:

  • Spike test — різке зростання навантаження: 0 → 1000 користувачів за 30 секунд. Імітує запуск рекламної кампанії. Показує здатність системи реагувати на піки.
  • Soak test — стабільне навантаження на 2–4 години. Виявляє memory leaks, connection pool exhaustion, деградацію продуктивності.
  • Stress test — навантаження вище розрахункової (150–200% від очікуваного піку). Показує точку відмови та graceful degradation.

Порогові значення:

thresholds: {
  http_req_duration: ['p95<500', 'p99<1000'],
  http_req_failed: ['rate<0.01'],
}

p95 < 500ms означає: 95% запитів відповідають швидше півсекунди. Якщо поріг не виконується — k6 завершується з кодом помилки, CI-пайплайн падає.

На одному проекті інтернет-магазину ми виявили деградацію API на 4-й годині тесту: p95 зріс з 200ms до 2s через витік з'єднань. Після оптимізації клієнт заощадив значну суму на інцидентах та зайвих ресурсах. Отримайте аналогічний аудит вашого проекту — замовте навантажувальне тестування.

Як Core Web Vitals впливають на ранжування?

Google використовує Core Web Vitals у ранжуванні. Lighthouse CLI в CI-пайплайні: при кожному деплої перевіряємо, що LCP < 2.5s, CLS < 0.1, INP < 200ms. Детальніше про веб-продуктивність. Реальні проблеми, які Lighthouse знаходить:

  • Hero image без атрибутів width/height: CLS 0.35 при завантаженні.
  • JavaScript-бандл 2.1MB синхронно блокує парсинг: INP 450ms.
  • Шрифти без font-display: swap: невидимий текст до завантаження шрифту (FOIT).
  • Неоптимізований hero image 4MB: LCP 8.2s.

Lighthouse CI (lhci) зберігає історію метрик і надсилає коментар до PR з деградацією. За даними Google, 53% користувачів залишають сайт при завантаженні довше 3 секунд — наші тести запобігають таким втратам.

Піраміда тестування в проекті

Рівень Інструмент Кількість Швидкість
Юніт Vitest/Jest Багато (тисячі) <5 хв
Інтеграція Vitest + supertest Середня 5–15 хв
E2E Playwright Мало (happy path) 10–30 хв
Навантаження k6 За розкладом 30–60 хв
Продуктивність Lighthouse CI При кожному деплої 5 хв

Що входить в роботу?

  • Аудит поточного покриття та визначення критичних user flows.
  • Написання unit-тестів для ключової бізнес-логіки, інтеграційних тестів для API, E2E для сценаріїв користувача.
  • Налаштування паралельного виконання в CI (sharded workers для Playwright).
  • Навантажувальне тестування зі звітом та рекомендаціями.
  • Документація за тест-кейсами, навчання вашої команди роботі з тестами.
  • Гарантійна підтримка 1 місяць після впровадження.

Процес роботи

  1. Аналітика — аудит поточного тестування, виявлення слабких місць, визначення пріоритетів.
  2. Проектування — вибір інструментів, написання тест-плану, узгодження.
  3. Реалізація — написання тестів, інтеграція в CI.
  4. Тестування — прогін всіх рівнів, аналіз результатів, виправлення помилок.
  5. Деплой — запуск в прод, моніторинг метрик, навчання команди.

Терміни

Налаштування повного тест-пайплайна (Jest + Playwright + k6 + Lighthouse CI) з нуля: 2–4 тижні. Покриття E2E-тестами існуючого проекту (20–30 сценаріїв): 3–6 тижнів. Навантажувальне тестування зі звітом та рекомендаціями: 1–2 тижні. Вартість розраховується індивідуально після аудиту.

Готові обговорити ваш проект? Залиште заявку — ми проведемо аудит поточного тестування безкоштовно і запропонуємо план з економією до 60% часу на інциденти. Отримайте консультацію з тестування веб-додатків — напишіть нам.