BunnyCDN Support Hub

Guides, troubleshooting and support requests to help you get started with BunnyCDN.

How to use BunnyCDN to deliver online video

Online videos are a big thing now, but serving them isn't all that easy. The file size can get quite big and you will very quickly reach the bandwidth limits of your hosting providers. Another huge problem with it is that video files are quite big and require a good connection to ensure a smooth playback for your users. This is especially apparent when your users come from all over the world.

To battle this problem, we have included live streaming video support in BunnyCDN that allows you to include a seekable video stream on your site. It's not only incredibly easy to set up, but very cost effective as well, since the video is streamed from our servers and you will not overload your web hosting.

Step 1: Create your pull zone

First thing first, you need to create your pull zone. To do this, simply go to your BunnyCDN control panel, enter the name of the pull zone and enter the URL of your blog as the Origin URL. For a more advanced info check out How To Create Your First Pull Zone

 

Step 2: Encode your videos

Before you start uploading your videos, you need to encode the video into a seekable MP4 format that the majority of the browsers will support. You can also change the quality of the video to an optimal bitrate that won't force a buffering message to your users. To do this, you can use a free but incredibly powerful software called Handbrake: https://handbrake.fr/

First, select a video file source and destination and make sure to click the Web Optimized checkbox. 
Now you can fiddle with the various encoding options on the bottom panels, or simply use one of the presets from the box on the right. 

Finally, simply click on the Start button and wait for the conversion to finish.

Step 3: Upload your videos

After the video has finished converting, it's time to upload it to your file hosting service that you have set in step 1. You can use a FTP client or some other type of file manager, depending on the type of hosting you have.

Step 4: Add a HTML5 video player to your website

You're now ready to roll. The only thing left is to actually include the uploaded video into your website. Thanks to HTML5 and the new video HTML tag, this is now easier than ever without any need for any external plugins.

Additionally, there are a couple of really cool already made video players out there. One such example is VideoJS. It's a free open source library and it's incredibly easy to use, with plenty of features and it looks nice as well. 
You can check it out at: http://www.videojs.com/

To use VideoJS you must include the following script in the <head></head> section of the website where the video will be included:

<link href="//vjs.zencdn.net/4.1/video-js.css" rel="stylesheet"> <script src="//vjs.zencdn.net/4.1/video.js"></script> 

Now you can simply add the video code as following:

<video id="my_vid_id" class="video-js vjs-default-skin" controls preload="auto" width="640" height="264" poster="poster.png" data-setup='{}'> <source src="http://bunnyspeed-video.bunny.zone/tokyo_trip_web.mp4" type='video/mp4' /> <track kind="captions" src="captions.vtt" srclang="en" label="English" /> </video> 

Make sure to replace the video source url with your own and that's it. When you open the website, the video should now start playing. Yay!

video_player.png

Final note

In order for the video seeking option to start working BunnyCDN first needs to cache the full video file. This might take up to a couple of minutes, depending on the file size and the speed of your origin file hosting. After that, you're all set.

 

2 Comments

  • 0
    Avatar
    Luc

    That sounds good, but if I am correct than now I use more bandwidth from BunnyCDN and I pay for that?! But that might be cheaper than my own hosting and making my website load quicker for my clients. If I host them on Youtube it is free (they use themselves CDN to stream all the video's). Am I correct here?

  • 0
    Avatar
    Diwakar Padmaraju

    Hi Luc,

    I am not part of the BunnyCDN but I am a user of their CDN service for our Free Social Blogs Network site. Before using Bunny CDN, we were literally struggling to serve the gigs of files from our SQL Binary Blobs storage and pages loaded slower and our google ranking was very less. We had our own 10 servers cluster serving the content but still did not help until we had opted for Bunny CDN recently. As soon as we started using the BunnyCDN to serve our files, images and videos, our pages started loading faster and more visitors have used our webpages comfortably. Every 1 to 2 seconds improvement in load speed may convert into earnings in tens of hundreds dollars and for large sites it could be in millions of dollars.

    I think, first part of your comment is true that you pay very less with Bunny CDN for file streaming and its a very fast served to the user's browsers from the nearest servers whereas if you have to do the same with your own hosting servers then it costs higher. Thats where BunnyCDN kind of CDN service providers come to your rescue.

    Second part of your comment, when we compare youtube to your own file streaming, ofcourse it depends on the use case. For example in scenarios where you would like to give ads free and promotion free video streaming for your own website visitors or if you would like to provide subscription based file downloads or streaming then Bunny CDN is the cheapest and best choice than going for Youtube.

    Hope this helps.

    Regards.
    Diwakar
    Thulya Social Network

Please sign in to leave a comment.