A look at the soon to be released bunny.net (formally BunnyCDN) video streaming CDN service. Simply labelled for now as “video” you can upload video files to have them be streamed with HLS.
Pricing starts at just $5 per Terabyte meaning you’re still getting the same low bunny.net pricing along with a very decent CDN performance.
Features & settings
Bunny.net video behaves very similar to storage zones, whereby you make a library and then you can upload individual videos into that library. Settings and options can then be set for each individual library.
You get the common Bunny.net options for pricing and security such as; Choosing a network tier, blocking and allowing domains, allowing direct play and token authentication.
With Bunny.net video the library’s encoding settings include; Video resolution sizes, watermark image, encryption and MP4 fallback.
The video resolution sizes for encoding is a crucial feature as it means when you upload full HD (1080p) content it can be streamed back at smaller sizes (480p etc) if the viewer has a poor connection speed.
If you upload a watermark it gets encoded into the video for each size.
Using bunny.net video if going to be great for me because instead of having to encode a low res, low bitrate video for a blog post I can just use the original as a bunny.net video because it is adaptive. It will pick the quality based on the viewer’s internet connection and not slow the page loading by fetching MP4 chunks.
Including ads in your bunny.net video streams is possible too, by simply using a VAST tag or vi.ai id.
Uploading video files can easily be done in the panel or with the bunny.net API. When using the panel you get the current upload speed, percentage completed and time remaining.
Once uploaded the video will go through the stages of processing, then encoding and finally playable.
Clicking the video brings up its information, you can rename the video file and even upload captions. In this panel you get the:
- Video Id
- Direct play URL
- HLS Playlist URL
- Thumbnail URL
- Preview animation WebP URL
- Embed code
If you get the playlist URL and use FFmpeg:
ffmpeg -i "https://vz-5cec31c7-45d.b-cdn.net/8f5ac362-8836-4bab-9ca9-a3242e51e2cb/playlist.m3u8"
You can view all the video (and audio if it exists) streams and their bitrate:
Examples & issues
There was only actually just one issue I came across in fairly limited use and that was to do with the iframe.
For me the default iframe has a giant navy coloured bar sitting below the video, this can be tinkered with to disappear but then once viewing on a mobile device the issue returns.
This happens on this blog and along with Bootstrap frameworkrk. Yes digging around with CSS should find somewhat of a fix but simply placing the iframe in a Bootstrap card should make it work first time.
Bootstrap example at CodePen using CSS tweak.
See these images or resize this page with the example iframes below:
Embedded bunny.net video examples:
Default iframe copied: