Videa na webu jsou jedna z věcí, kde Webflow nativně nestačí. Můžeš sice přidat video přes VideoLink pole v CMS nebo embedovat YouTube, ale jakmile chceš vlastní přehrávač, rychlé načítání nebo čistý vzhled bez cizího brandingu, narazíš na zeď. Tady nastupuje Bunny.net.
Proč nevkládat videa přímo do Webflow
Webflow ukládá assety na vlastním CDN. Pro obrázky to funguje dobře, ale pro videa je to špatná volba. Velké soubory zpomalují web, nejde nastavit vlastní přehrávač a nemáš žádnou kontrolu nad tím jak se video načítá a streamuje. Soubor se buď načte celý, nebo nenačte vůbec. Výsledek: špatné Core Web Vitals, frustrovaní uživatelé a zbytečně drahý hosting.
YouTube a Vimeo jsou lepší než vlastní soubor v CMS, ale přináší jiné kompromisy. YouTube znamená cizí branding, reklamy a doporučená videa konkurence na konci přehrávání. Vimeo je drahý jakmile potřebuješ víc prostoru nebo bandwidth. Ani jedno ti nedá plnou kontrolu nad přehrávačem.
Co je Bunny.net a proč ho používám
Bunny.net je CDN a video hosting platforma zaměřená čistě na výkon a cenu. Není to YouTube alternativa pro publikum, ale infrastruktura pro vývojáře a weby, kteří chtějí mít videa pod kontrolou.
Pro Webflow projekty jsou klíčové dva produkty:
Bunny Stream je vlastní video hosting s HLS streamingem. Video se načítá progressively, takže uživatel vidí první frame za sekundu i při pomalém připojení. Automatický encoding do více rozlišení (360p, 720p, 1080p, 4K), vlastní přehrávač přes embed kód nebo API, analytiky ke každému videu.
Bunny CDN je globální síť s PoP ve stovkách lokací. Videa se servírují z nejbližšího serveru k uživateli, ne z jednoho datacentra někde v USA.
Cena je pay-as-you-go, platíš za skutečně přenesená data, ne za storage nebo počet videí. Pro většinu webů vychází výrazně levněji než Vimeo Pro nebo Wistia.
Jak Bunny Stream zapojit do Webflow
Celý workflow zabere maximálně odpoledne.
1. Založ účet na Bunny.net. Registrace je zdarma, platíš až za skutečně přenesená data.
2. Vytvoř Stream knihovnu v Bunny dashboardu pod Stream. Vyber název a region, pro CZ klienty doporučuju Frankfurt nebo Amsterdam.
3. Nahraj video přetáhnutím nebo přes API upload. Bunny ho automaticky enkóduje do všech rozlišení, trvá to pár minut podle velikosti souboru.
4. Zkopíruj embed kód z detailu videa. Vypadá takhle:
<iframe src="https://iframe.mediadelivery.net/embed/LIBRARY_ID/VIDEO_ID" loading="lazy" allow="autoplay" allowfullscreen></iframe>
5. Vlož do Webflow. Pro statické stránky dáš embed kód přímo do Embed elementu na canvas. Pro CMS stránky přidáš do kolekce pole Plain Text nebo Embed, do kterého ukládáš iframe kód, a na stránce ho napážeš přes Embed element.
Nastavení přehrávače
Bunny Stream umožňuje přehrávač vizuálně přizpůsobit tak, aby zapadl do designu webu. V dashboardu pod Stream, tvá knihovna, Player Settings nastavíš barvu přehrávače, vlastní thumbnail, autoplay a loop chování, viditelnost ovládacích prvků a kapitoly nebo titulky.
Výsledkem je přehrávač bez cizího brandingu, který vypadá jako součást webu, ne jako embednutý YouTube.
Výkon v praxi
Na projektech kde jsem Bunny.net nasadil, se Core Web Vitals zlepšily hlavně v LCP. Video přestalo blokovat načítání zbytku stránky, Bunny Stream načítá přehrávač asynchronně a lazy-loaduje samotné video až když uživatel skrolluje blízko elementu.
Oproti přímému vložení MP4 souboru z Webflow assetu je rozdíl znatelný hlavně na mobilech a pomalejším připojení. A oproti YouTube embedu odpadá zbytečný JavaScript a tracking pixel, který YouTube vkládá do každé stránky kde je embed.
Cena, co reálně zaplatíš
Bunny.net funguje bez měsíčního paušálu. Storage vyjde na $0.01/GB/měsíc, bandwidth od $0.005/GB podle regionu a encoding pro základní rozlišení je zdarma.
Web s 10 videi průměrné délky 3 minuty a 1000 přehrávání měsíčně vyjde přibližně na $2 až $5 měsíčně. Vimeo Pro stojí $20/měsíc, Wistia začíná na $19/měsíc a limituje počet videí.
Kdy Bunny.net použít a kdy ne
Bunny Stream dává smysl pokud potřebuješ vlastní přehrávač bez cizího brandingu, máš víc videí nebo videa na CMS stránkách, záleží ti na výkonu a Core Web Vitals, nebo nechceš platit Vimeo paušál za bandwidth co nevyužiješ.
Pokud publikuješ videa primárně pro YouTube publikum a chceš organický dosah přes YouTube vyhledávání, Bunny není náhrada. V tom případě dávej videa na YouTube a na web embeduj přes YouTube, ale schovej doporučená videa přidáním parametru ?rel=0 na konec URL.
Pro všechny ostatní případy, vlastní showreel na homepage, videa na produktových stránkách nebo testimonial videa v CMS, je Bunny.net nejlepší volba co jsem zatím zkoušel.
