Na co myslet při návrhu aplikace pro streamování

Rozvoj aplikací pro živé vysílání způsobil revoluci ve způsobu konzumace obsahu a umožnil lidem z celého světa komunikovat v reálném čase. Svět živého vysílání se rozšířil nejen na hraní her a sociální média, ale i na platformy jako Zoom, Microsoft Teams a Google Meet, které se používají pro práci na dálku a online vzdělávání. Živé vysílání umožnilo také vzdálené fitness lekce, koncerty, sportovní události a další aktivity, které byly dříve omezeny na fyzickou účast. Aplikace pro živé vysílání jsou stále populárnější, uživatelé očekávají vysoce kvalitní obsah a bezproblémový zážitek. Úspěch těchto platforem do značné míry závisí na schopnosti poskytovat spolehlivé a konzistentní živé vysílání. To vyžaduje překonání technických problémů, jako jsou problémy se synchronizací, kvalitou a latencí, které jsou relevantní při vymýšlení způsobu vývoje aplikace pro streamování videa.

Výzva: Vlastní nahraný obsah a místní přehrávání

Když se rozhodnete vytvořit aplikaci pro streamování hudby nebo videa...

Když instruktor nahrál do své relace vlastní video a hudbu, obsah se přehrával lokálně v zařízení účastníka, místo aby se streamoval, aby se snížilo zatížení sítě a zlepšil výkon. Když se však vlastní video a hudba přehrávaly lokálně, mohla latence mezi instruktorem a účastníkem způsobit zpoždění při přehrávání obsahu, což vedlo k tomu, že účastníci nebyli synchronizováni s instruktorem. To je významný problém v hodinách fitness, kde je přesné načasování klíčové, protože účastníci mohou zmeškat důležité pokyny a pohyby.

Kromě toho mohou různé síťové podmínky a možnosti zařízení jednotlivých účastníků způsobit rozdíly v kvalitě přehrávání, což vede k nekonzistentnosti fitness zážitku. To může mít za následek nedostatečné zapojení a potenciálně vést k negativnímu uživatelskému zážitku. Společnost Moravio proto musela přijít s řešením, jak synchronizovat přehrávání videa a hudby pro všechny účastníky.

Všeobecně existuje řada možných řešení problému synchronizace:

Synchronizace časového kódu Při synchronizaci časového kódu se informace o čase přehrávání instruktora předávají účastníkům v reálném čase a jejich přehrávání videa a hudby se upravuje tak, aby se rovnalo času přehrávání instruktora. Toto řešení původně implementovala společnost Moravio, i když s omezenými výsledky. Problémem je, že kvalita sítě a výkon zařízení mohou stále způsobovat značné zpoždění přehrávání oproti stopám streamovaným kamerou a mikrofonem instruktora, což opět způsobuje nesrovnalosti.

Zpoždění streamu Dalším řešením je mírné zpoždění streamu, aby se zohlednilo případné zpoždění v síti. To znamená, že by instruktor vysílal obsah o něco později než obvykle, aby síť mohla zpoždění dohnat. Tato metoda zajišťuje, že všichni účastníci obdrží stejný obsah ve stejnou dobu, a snižuje pravděpodobnost zpoždění nebo nesynchronizovaného obsahu. Toto řešení je však pro tento případ použití nepoužitelné, protože instruktor musí v reálném čase reagovat na veškeré vstupy od účastníků, které by byly mírně opožděné, což by způsobilo zmatek. Mějte na paměti, že podobné věci je důležité vzít v úvahu, když se učíte vytvářet streamovací aplikaci.

Streaming lokálně přehrávaného obsahu samostatně Místo toho, aby si účastníci mohli přehrávat vlastní video a hudbu lokálně, lze video a hudbu přehrávané na straně instruktora zachytit a streamovat jako samostatné stopy vedle stop kamery a mikrofonu instruktora. Toto je řešení, které společnost Moravio nakonec implementovala, aby vyřešila problém se synchronizací.

Řešení: Snímání a streamování vlastního obsahu

Na dotaz, jak vytvořit webovou aplikaci pro živé streamování videa a pokusit se vyřešit problém se synchronizací, společnost Moravio implementovala řešení, kdy se vlastní video a hudba, které se dříve přehrávaly lokálně na straně instruktora i účastníka v přehrávači médií HTML, nyní přehrávají lokálně pouze na straně instruktora a jsou zachycovány a streamovány jako samostatné video a audio stopy. To znamená, že účastníci již nepřehrávají vlastní video a hudbu lokálně, ale místo toho je jim streamována ze zařízení instruktora. Tím je zajištěno, že pokyny instruktora při cvičení jsou synchronizovány s tím, co se skutečně děje na streamu, a všichni účastníci sledují fitness pohyby v reálném čase.

Proces zachycení a streamování vlastního nahraného obsahu jako samostatné stopy zahrnuje následující kroky:

1. Instruktor nahraje vlastní video a hudbu do relace pomocí nástroje pro tvorbu tříd.
2. Při přehrávání zachytíme vlastní video přehrávané v přehrávači médií HTML pomocí metody captureStream().
3. Hudbu také zachycujeme pomocí metody createMediaStreamSource() na AudioContext
4. Zachycené video a zvuk jsou poté přenášeny k účastníkům jako samostatné stopy.

Mezi výhody tohoto přístupu patří bezproblémový a synchronizovaný fitness zážitek jak pro instruktora, tak pro účastníky. To vytváří příjemnější a efektivnější trénink a zajišťuje, že účastníci přesně sledují pohyby instruktora. Nevýhodou tohoto přístupu je, že kvůli zvýšenému zatížení sítě mohou účastníci se špatnou síťovou konektivitou zaznamenat pokles kvality videa a hudby. LiveKit se však automaticky stará o adaptivní změnu kvality videa na základě kvality síťového připojení, což je ve scénářích, jako je tento, rozhodně klíčové.

Toto řešení navíc zdůrazňuje, jak lze technologii využít ke zlepšení kvality aplikací pro živé vysílání a ke zlepšení uživatelského zážitku. Je to skvělý příklad toho, jak inovativní řešení mohou řešit náročné problémy a nakonec vést k lepšímu produktu pro uživatele. Doufáme, že vám tento článek poskytne několik tipů, jak vytvořit streamovací aplikaci.