Затримки у відео та втрата пакетів — типові проблеми при організації онлайн-трансляцій. Ми створюємо платформи вебінарів, які вирішують ці завдання на рівні архітектури: від вибору медіасервера до CDN-стримінгу. Наш досвід — 5 років у розробці відеоплатформ, понад 20 успішних проєктів. Гарантуємо стабільність трансляцій для аудиторії від десятків до десятків тисяч учасників. Якщо ви стикалися з лагами під час вебінару або втратою якості при масштабуванні, наша архітектура це виключає. Ми опрацьовуємо топології CDN, налаштовуємо HLS-сегментацію та оптимізуємо WebRTC для мінімальної затримки.
Як ми будуємо архітектуру відеозв'язку?
P2P (WebRTC без сервера) підходить тільки для відеодзвінків до 3–4 учасників. При більшій кількості навантаження на клієнт зростає експоненційно.
SFU (Selective Forwarding Unit) — медіасервер пересилає потоки між учасниками, не перекодуючи. Кожен відправляє один потік і отримує потоки інших. Масштабується до 50–200 учасників із затримкою менше 1 секунди.
MCU (Multipoint Control Unit) — мікшує всі потоки в один. Навантаження на клієнт мінімальне, підходить для тисяч глядачів, але серверне навантаження вище.
CDN-стримінг (HLS/DASH) — ведучий транслює в RTMP, медіасервер транскодує в HLS, CDN роздає глядачам. Затримка 5–30 секунд, масштаб необмежений.
Для вебінарного формату (1 ведучий + тисячі глядачів) використовуємо SFU + CDN-стримінг для scale-out.
| Технологія | Затримка | Макс. учасників | Навантаження на клієнт |
|---|---|---|---|
| P2P | < 100 мс | 3-4 | Висока |
| SFU | < 1 с | 50-200 | Низька |
| MCU | < 500 мс | Тисячі | Мінімальне |
| CDN | 5-30 с | Необмежено | Мінімальне |
Що таке SFU і навіщо він потрібен?
SFU — це сервер, який отримує відеопотоки від учасників і пересилає їх іншим без перекодування. Це знижує навантаження на клієнти та сервер, зберігаючи низьку затримку. Для вебінарів SFU забезпечує до 200 учасників із повною інтерактивністю.
Медіасервери
Livekit — open-source SFU на Go, активно розвивається. SDK для React, Vue, iOS, Android. Підтримує ingress (RTMP, HLS-вхід). Хостинг: самостійний або Livekit Cloud. LiveKit — перевірене рішення.
import { Room, RoomEvent } from 'livekit-client'; const room = new Room(); await room.connect('wss://yourinstance.livekit.cloud', token); await room.localParticipant.enableCameraAndMicrophone(); Mediasoup — низькорівнева SFU-бібліотека Node.js, потребує більше розробки, але максимально гнучка. Agora, Daily.co, Vonage — managed-сервіси, оплата за хвилини, швидка інтеграція, менше контролю.
Порівняння SFU-рішень
| Параметр | Livekit | Mediasoup | Agora |
|---|---|---|---|
| Складність впровадження | Середня | Висока | Низька |
| Вартість | Безкоштовно (self-hosted) | Безкоштовно | Похвилинна |
| Гнучкість | Висока | Максимальна | Низька |
Життєвий цикл вебінару
Створення → Налаштування → Промо-сторінка → Реєстрація учасників → Email-нагадування → Старт трансляції → Інтерактив (чат, Q&A, опитування) → Завершення → Обробка запису → Розсилка запису → Аналітика
Реєстрація та керування учасниками
Лендинг вебінару: тема, дата/час з таймзоною, спікери, програма, форма реєстрації. Після реєстрації — підтверджуючий email з посиланням для входу (унікальний токен).
Нагадування: за 24 години, за 1 годину, за 15 хвилин. Інтеграція з Google Calendar / Outlook через .ics-файл.
Інструменти ведучого
- Screen sharing — через WebRTC
getDisplayMedia() - Whiteboard — спільна дошка (Excalidraw-сумісний компонент)
- Slides — презентація через
iframeабо PDF-viewer - Hand raise — сигнал про питання
- Spotlight — виділити учасника (підняти на сцену з глядачів)
- Breakout rooms — розділення на кімнати для воркшопів
Запис та обробка
Після завершення вебінару запис обробляється:
- Медіасервер віддає raw-запис (MP4 або WebM)
- FFmpeg перекодовує в оптимальний формат з різними роздільностями
- Завантажується в Cloudflare Stream або Mux
- Розсилається учасникам (і незареєстрованим, якщо потрібно)
Аналітика вебінару
- Пікова одночасна присутність
- Retention: коли учасники йшли (% тих, хто залишився в кожен момент)
- Engagement: активність у чаті, відповіді на опитування
- Конверсія: реєстрації → відвідувачі → ті, хто завершив перегляд
Що входить в роботу
- Архітектурна схема рішення
- Код серверної та клієнтської частини
- Документація по REST API
- Налаштування інфраструктури (Docker, Nginx, CDN)
- Навчання команди замовника
- Гарантія 6 місяців
Строки
MVP (лендинг, реєстрація, вебінарна кімната з чатом, запис, розсилка): 3–4 місяці. Повна платформа з множинними спікерами, breakout rooms, аналітикою, інтеграцією CRM: 5–8 місяців.
Замовте консультацію по вашому проєкту — оцінимо завдання і запропонуємо архітектуру. Зв'яжіться з нами, щоб обговорити деталі та отримати індивідуальний план розробки.