ウェブ制作の現場では、動画コンテンツの需要が高まり続けており、neccoでも、パフォーマンスの良い動画配信方法を探し続けています。動画は目を引きますし、音や質感などの、文章や画像では伝えきれない内容を届けられます。よくあるウェブサイトでの動画配信の例としては、動画を「背景動画」としてページ背景に埋め込んだり、あるいは一つのコンテンツとして、プレーヤーをページに表示したりします。

女性がトートバッグを持ってソファに座っている商品紹介のウェブサイトのスクリーンショット。ウェブサイトの右側にはメニューとカートのアイコンがある。
トートバッグの質感を伝えるために、動画を使う(秋田人形道祖神トートバッグ販売ページ

ウェブサイトに動画を埋め込むには、大きく分けて2通りの方法があります。
サーバーにmp4などの動画ファイルを置いて直接再生する方法と、何らかの動画のストリーミングサービスを使って配信する方法です。

サーバーにmp4などの動画ファイルを直接置いて再生する方法は、追加コストがかからず導入も簡単ですが、動画のダウンロードに時間がかかったり、アクセスが集中するとサーバーへの負荷が高まりやすいという課題があります。一方、ストリーミングサービスを利用する場合は、CDNによる安定した配信や、セキュリティ機能など多くの利点がある反面、月額や従量課金などのコストが発生したり、サービスごとの制約も考慮する必要があります。

どちらの方法も一長一短ですが、ある程度の流入が見込まれるサイトの場合や、動画の再生時間が長い場合には、ストリーミング配信を採用することが多いです。

neccoでは、これまでストリーミング配信サービスとしてVimeoを利用してきましたが、今回は、数あるストリーミングサービスの中から、スロベニア発の動画配信サービス「Bunny Stream」を実際に導入してみた結果や感想を掲載します。

※この記事にはBunny Streamへのアフィリエイトリンクが含まれます

Bunny Streamとは

Bunny Streamは、CDNサービスのBunny.netが提供する動画ホスティング・ストリーミングサービスです。
200 Tbps以上のネットワークバックボーンと、119の世界的なPoP(Point of Presence)を活用し、グローバルスケールでの動画配信を実現しているとのこと。転送量などに応じた従量課金ですが、$0.005/GBという、類似サービスの中でも桁違いに安い価格帯が魅力です。

兎をモチーフにしたバニーネットのウェブサイトのスクリーンショット。ウェブサイトの中央に「Bunny Stream」という見出しがあり、その下に「A better way to deliver online video」という見出しがある。
あらゆる場所にウサギがいます

導入レビュー

Bunny Streamでは、14日間有効な20ドル分の無料トライアルが利用できます。クレジットカードの登録も不要でした。
今回は、neccoの自社サイトの埋め込み動画をBunny Streamに入れ替えてみました。

AI家計簿アプリ「ワンバンク」キャラクターデザインの実績紹介のファーストビューのスクリーンショット
「ワンバンク」さま 実績紹介ページでの背景動画利用例
「Awarefyさまのコーポレートサイトが渋谷の大型ビジョンに登場!」の見出しと文章の下に、動画プレーヤーが表示されている
necco Note記事での動画埋め込み例

ライブラリとコレクション

Bunny Streamの動画管理は「ライブラリ」と「コレクション」の2層構造になっています。

まず、「ライブラリ」を作ります。ライブラリごとにプレーヤーの設定やセキュリティポリシーを共通化できる仕様となっており、用途別にライブラリを作成することになります。
そして、ライブラリの中に、動画をグルーピングして整理するための「コレクション」を作れます。コレクションは入れ子構造にできず、シンプルな管理体系となっています。

共有設定を持つ2つの「ライブラリ」がある。左のライブラリは2つの「コレクション」を含み、各コレクションには動画のサムネイルが複数表示されている。右のライブラリは1つの「コレクション」を含み、複数の動画サムネイルが表示されている。

ライブラリを作る

管理画面からライブラリを追加すると、動画のストレージのリージョンを選択する画面が表示されます。
今回は主に日本に向けた配信のため、デフォルトのドイツに加えて、アジアユーザー向けのシンガポールリージョンを追加で選択しました。一度有効化したリージョンは無効化できないため、注意して設定します。

リージョン選択画面のスクリーンショット

配信帯域が「Standard Tier」と「High Volume Tier」の2種あり、Standardの方が応答速度が速く、高性能ですが、neccoではまず、安価な「High Volume Tier」を試すことにしました。

「Choose tier」「Routing filters」の設定セクションが表示され、下部には「Delivery cost: from $0.005 / GB」と表示されている。

プレーヤーのカスタマイズ

プレーヤーの設定では、プレーヤーに表示したいボタンや、スタイルを変更できます。

ビデオプレイヤーの設定ページで、UI言語、フォントファミリー、プライマリカラー、キャプションの外観、プレイヤーコントロール、再生速度、カスタムHTMLヘッド、視聴時間のヒートマップ、再開可能なプレイヤーの位置などを設定できる。

neccoでは背景動画を利用することが多いため、今回はプレーヤーのボタンをすべて非表示にしてみました(操作ボタンをなくすことの是非はここでは忘れてください…)。ただし、実際に埋め込んだところ、ボタンをすべて非表示にしても、プレーヤーの操作ボタンの後ろに表示される黒い帯背景が表示されてしまうことがわかりました。

白い背景に、黒い帯のようなグラデーションが表示されている。

そこで、プレーヤー設定画面からCSSを直接適用して、この帯を消しました。背景動画として使用する際の黒帯の非表示は以下のCSSで実現できました。

.plyr--video .plyr__controls { background: transparent !important; }

セキュリティ設定

IPアドレスでの制限や、動画ファイルURLへのアクセス禁止などを、ライブラリ別に設定できます。この設定はライブラリ全体で共通となり、動画単位で個別には設定できません。また、Vimeoのようなパスワード保護機能は提供されていません。

動画の一般設定ページで、ダイレクトプレイの有効化、ブロック済みドメインと許可済みドメインの管理、ダイレクトURLアクセスとトークン認証のブロック、およびAPIキーの表示ができる。

良いと感じたところ

価格が安い

従量課金ではありますが、やはり他社と比べて桁違いに料金が安いのが魅力です。前払いチャージ制のためひと手間かかりますが、この仕組みのおかげで、意図せず青天井の料金が請求されることもなく、安心できます。

neccoの自社サイトでの利用結果をご紹介すると、2025年の5月末に10ドルをチャージして、7月1日現在、8.95ドル残っています。およそ一ヶ月で、わずか1ドルほどしか消費していません。

Webサイトの統計ダッシュボードで、2025年5月29日から6月28日までのデータが表示されている。使用帯域幅は118.51GB、処理されたリクエスト数は295,415、キャッシュヒット率は84.48%である。帯域幅とリクエスト数の時系列グラフも表示されている。
106GBの転送
ALT
カスタム Gem

分析
「2025年6月1日~2025年6月30日の利用詳細」というタイトルの請求書。サービス内容と料金が記載されており、合計請求額は1ドル。トラフィック料金は米国0.04ドル、ヨーロッパ0.01ドル、アジア・オセアニア0.48ドル、南米0.00ドル、アフリカ0.00ドル。月額最低料金は0.08ドル、その他の料金は-0.01ドル、クラウドストレージは0.40ドル。
2025年6月の請求内訳/計$1ドルにおさまっています。

サポートの対応が超早い

利用に関して不明点があり、サポートに何度か連絡を取りましたが、対応がとても早く、驚きました。
送信から5分足らずで返事が来ることもあります。最初はAIの自動応答を疑ったほどの早さでしたが、返信内容もきちんと問い合わせに沿った的確な内容で、満足度が高いです。

シンプル

Cloudflareのような超多機能なCDNサービスと比べると、設定画面や項目がシンプルで、設定も分かりやすいです。

動画を制御しやすい

Playback control APIを利用して、動画の外部から動画の再生や停止などを制御できます。
neccoではこの機能を利用して、動画がビューポートの範囲にある時だけ再生し、余計な通信が発生しないように配慮しています。

また、Bunny Streamのプレーヤーは、動画のチャプター分けや、字幕の表示、音声切り替え、再生速度の調整や注目度グラフの表示など、さまざまな機能に対応しています。別料金になりますが、文字起こしも可能で、翻訳も可能とのことです。
さらに、CSSでプレーヤーをカスタマイズできるため、細かな要望にも応えられそうな期待感があります。

いまいちなところ

プレーヤーの設定がライブラリ単位

プレーヤーの設定がライブラリ単位で管理されるため、同じ動画を異なるUIで見せたい場合、複数のライブラリに重複してアップロードが必要です。
例えば、同じ動画を、ある場所では背景動画として自動再生し、ある場所では再生ボタン付きで表示したい場合、同じ動画を2つのライブラリにアップロードしなければいけません。
競合サービスのように、動画を呼び出す際のスクリプトで設定できるほうが使いやすいです。

管理画面の動作が遅いことがある

ライブラリ内でたくさんの動画を管理していると、管理画面の動作がやや遅いと感じることもありますが、許容範囲です。

チーム機能がない

なくても良いといえば良いのですが、複数ユーザーを前提とした管理機能ではないため、複数人で動画を管理したい場合は、ログイン情報を共有する必要があります。

外部サイトで非対応のことがある

Bunny Streamにアップロードした動画をBehanceで埋め込もうとしたところ、非対応と表示され、埋め込めませんでした。
Vimeoなどと比べると知名度が低いサービスのため、オンラインフォーラムや投稿サイトなどで、埋め込みスクリプトの利用にセキュリティ上の制限がかかっている場合、Bunny Streamの動画は埋め込めない確率が高そうです。

非エンジニアには埋め込みが難しい

Bunny Streamでは、管理画面から下記のような動画の埋め込みコードを取得できます。

<div style="position:relative;padding-top:56.25%;">
<iframe src="https://iframe.mediadelivery.net/embed/【ライブラリID】/【動画ID】?autoplay=false&loop=true&muted=false&preload=true&responsive=true" loading="lazy" style="border:0;position:absolute;top:0;height:100%;width:100%;" allow="accelerometer;gyroscope;autoplay;encrypted-media;picture-in-picture;" allowfullscreen="true"></iframe>
</div>

レスポンシブ対応はされていますが、動画の比率に関しては16:9にのみ対応しています。
もちろん、自力でCSSを書き換えればどのような比率にも対応できますが、非エンジニアメンバーが気軽にコードをコピーして使うことはできなさそうです。

ただし、Bunny Streamには、動画のアップロードや情報取得が行える Stream APIが用意されているため、自力でビデオアップロードのUIを構築すれば、その辺りの処理を適切に処理できる専用画面を用意することも可能なはずです。

競合サービスとの比較

neccoではこれまで動画ストリーミングサービスとしてVimeoを利用してきました。転送量や再生時間は、時期によってかなりばらつきがありますが、ここ4ヶ月ほどは、ざっくり下記の通りでした。

  • 推定配信時間:100〜200時間
  • 転送量:200〜400GB

※Bunny Stream移行前は、ビューポートを外れたら再生を停止する処理を行っていませんでした。

ストリーミングサービスは課金形態もそれぞれ異なっており、単純な比較が難しいです。実際にはこれらに加えて、動画のストレージのコストなども別途かかるため、本当にちょっとした参考程度ですが、ざっくりと転送量/再生時間ベースで比較してみます。

サービス名料金体系200GB配信時400GB配信時年間コスト(400GB/月)
Bunny Stream$0.005/GB$1.00$2.00$24
(参考価格: 約¥3,454)
Cloudflare Stream$1/1,000分$6.00-12.00$12.00-24.00$144-288
(参考価格: 約¥20,724〜)
Vimeo月¥1200〜定額定額¥14,400〜

こうしてみると、Bunny Streamの圧倒的なコストパフォーマンスが目立ちます。Bunny Streamのサイトでは、利用条件に応じた見積もりも出せますので、気になる方はご自身の条件でお試しください。

料金シミュレーターのスクリーンショット
ページの中ほどに料金シミュレーターがあります

Vimeo vs Bunny Stream

Vimeoには、ウェブサイトにストリーミング動画を埋め込む機能以外にも、ライブ配信機能や、動画ページへのコメントなどのコミュニティ機能、パスワード付き公開機能など、さまざまな機能が揃っています。比較すると、Bunny Streamは「ウェブサイトにストリーミング動画を埋め込めるようにする」機能のみで、その他の機能はなく、上記の機能を活用してきた方にとっては、物足りなさを感じるはずです。

価格に関しては、Vimeoは定額料金です。ただし、動画の転送量に関しては、どのプランも「月間2TBまで」の上限となっており、それを超える場合はエンタープライズプランの契約が必要になります。もし大量にアクセスが発生し、恒常的に2TBを越え続ける場合は、年額数百万円にもなる価格帯での契約が必要となってしまいます(要見積もり)。
一定以上の再生量が見込まれる場合、そして、ウェブサイトに動画を埋め込むだけの用途なら、Bunny Streamのほうが安く利用できる可能性が高いです。

Cloudflare Stream vs Bunny Stream

ウェブサイトに動画を埋め込むだけの用途に限って、Cloudflare Streamと比較した場合、やはり費用面で大きな差があります。250GB利用時、Cloudflare Streamで月額69ドルかかるのに対し、Bunny Streamは月額5ドルと、約14倍の価格差があります。
ただし、Cloudflareはストリーミング以外のサービスも包括的に提供しているほか、企業向けのサポートやより高度な分析機能を提供しており、その面で見ると妥当かもしれません。

YouTube vs Bunny Stream

無料で利用できるストリーミング配信サービスとして、YouTubeはとても人気があります。

ただし、ウェブサイトへの埋め込み用途となると、下記のような制約があるため、特に背景動画としては、使いにくい面があり、他のサービスを利用する必要があります。

  • プレーヤーUIやYouTubeロゴが表示される
  • 動画の再生後に関連動画が表示される(再生リストやループ設定で回避可能)
  • 動画に別要素を被せるなどして、UIを隠してはならない(※1)
  • 同じ画面内で、1つ以上同時再生してはならない(※2)

※1と※2に関しては、下記のYouTube利用規約に基づく制約から判断しました。

オーバーレイとフレーム

埋め込み YouTube プレーヤーの任意の部分(プレーヤーのコントロールなど)の前に、オーバーレイ、フレーム、その他の視覚要素を表示することはできません。同様に、オーバーレイ、フレーム、その他の視覚要素を使用して、埋め込みプレーヤーの一部(プレーヤーのコントロールなど)を隠すことはできません。

https://developers.google.com/youtube/terms/required-minimum-functionality?hl=ja#overlays-and-frames

1 つのページまたは画面に、コンテンツを同時に自動再生する YouTube プレーヤーを複数配置することはできません。

https://developers.google.com/youtube/terms/required-minimum-functionality?hl=ja#autoplay-and-scripted-playbacks

まとめ:コスト効率重視なら最有力候補

Bunny Streamは、ウェブサイトへの動画埋め込み用途に特化したシンプルなストリーミングサービスとして、圧倒的なコストパフォーマンスと十分な機能性を兼ね備えています。また、サポート対応の速さ、CSSによるプレーヤーの柔軟なカスタマイズ性が魅力的です。
一ヶ月を通して利用し、安価な「High Volume Tier」でも充分な配信の快適さだと感じました。

その一方で、チーム管理機能、外部サービスとの連携面では制約も感じられますが、これらが大きな問題とならない用途であれば、Bunny Streamは有力な選択肢になりそうです。

動画配信コストを抑えつつ、安定した配信環境を求める方に、ぜひお試しいただきたいサービスです。