世界を動かす技術を、日本語で。

初のQUICを利用したメディアCDN: Cloudflare

概要

Cloudflareが Media over QUIC (MoQ) CDN を発表し、世界規模の anycastネットワーク で技術プレビューを公開。 MoQは WebRTC/HLS/DASH/RTMP/SRT の置き換えを目指す新標準。 hang.liveなどの Webデモやライブラリ で手軽に配信・視聴が可能。 現時点では 機能制限やバグ があるが、今後の発展が期待。 MoQの実運用を通じて 標準化プロセスの前進 を促進。

CloudflareがMedia over QUIC CDNを発表

  • CloudflareMedia over QUIC (MoQ) CDN を正式発表
  • 世界規模の anycastネットワーク 上で試験運用開始
  • MoQは ライブメディア配信 の新標準
  • WebRTC/HLS/DASH/RTMP/SRT の後継を目指すプロトコル
  • Cloudflareが 初のCDN提供者 として先陣を切る

MoQとは何か

  • MoQ: ライブメディア配信向けの新しい標準プロトコル
  • 低遅延・高効率 な配信を実現
  • 既存の WebRTCやHLS/DASH/RTMP/SRT を置き換える可能性
  • IETF で標準化進行中、まだドラフト段階
  • 実世界での運用を通じて 仕様改善 を目指す動き

今すぐ試せること

  • Cloudflareの公開リレーエンドポイント (relay.cloudflare.mediaoverquic.com)で無料テスト可能
  • @kixelated/hang ライブラリや各種クライアントで接続可能
    • Mike’s fork
    • Lorenzo’s imquic
    • Meta’s moxygen
  • Webデモ で配信・視聴が簡単
  • Web Component API または Javascript API で柔軟な開発
  • Rustライブラリ も用意、ffmpegやgstreamer連携も可能

実装例

  • Web配信デモ: <hang-publish>要素でブラウザから直接配信
  • Web視聴デモ: <hang-watch>要素でライブ視聴
  • AI字幕機能: silero-vad + whisper + transformers.js + onnxruntime-web + WebGPUでブラウザ生成
  • Javascript API: 個別フレーム取得や高度な制御に対応
  • Rust API: MP4インポートやgstreamer連携で複雑な用途もカバー

現時点の制限事項

  • 技術プレビュー のため仕様・APIは変更可能性あり
  • 認証機能なし :ユニークで推測困難な配信名を必須
  • ANNOUNCEサポートなし :配信開始/終了検知は未対応
  • Safari未対応 :今後サポート予定
  • 最適化未実施 :ユーザー体験は今後改善
  • 古いドラフト・限定的な機能 :バグの可能性高い
  • 自己ホスト可能 :独自運用やプライベートネットワーク導入も可能

今後の展望とコミュニティ

  • WebRTC/HLS/RTMP再実装 を目指す壮大な挑戦
  • 標準化プロセス の加速を期待
  • Discordコミュニティ に900人以上参加
  • Google/Akamai/Fastly など他社への参加呼びかけ
  • 実運用データ を元にユーザーニーズを反映したプロトコル設計

開発者向けサンプルコード

  • @kixelated/hang ライブラリでの配信・視聴例
    • Broadcastの開始・停止制御
    • 音声/映像トラック情報の取得
    • CanvasやAudioEmitter/VideoRendererでの描画
    • フレーム単位の独自処理も可能
  • 未公開API での物体検出やMoQトラックへの結果配信
  • Typescript対応 :型安全な開発環境

まとめ

  • MoQ CDN の登場はライブ配信業界の大きな転換点
  • 標準化前の実運用 が今後の仕様策定に貢献
  • 開発者・事業者 は今からMoQを試してノウハウ蓄積を推奨
  • Javascriptは嫌い でも、MoQの未来には期待

Hackerたちの意見

こんにちは!CloudflareのMoQ開発者です。質問があれば喜んで答えます!賞をありがとう、kixelated。xD

こんにちは、getstream.ioでWebRTCストリーミングの仕事をしています。WebRTCは設定が面倒なんですよね。でも、接続が完了すると低遅延を提供してくれます。接続設定が終わった後のMoQの比較についてどう思いますか?何か利点や問題点はありますか?

こんにちは!いくつか質問があります :) QUICが実際にブラウザで使えるようになるのはどれくらい近いですか?(つまり、ブラウザとインフラの両方がサポートしていて、"ただ動く"状態)QUICはNATの問題をどう回避しますか?WebRTCはフルコーンNATを通過するためにSTUN/TURNが必要ですが、特に後者は運用に多くのインフラが必要なので問題です。

ヘッド・オブ・ラインブロッキングがない:TCPのように、1つのパケットが失われるとその後ろのすべてがブロックされるのとは違って、QUICのストリームは独立しています。1つのストリーム(例えば音声トラック)でパケットが失われても、別のストリーム(例えばメインのビデオトラック)はブロックされません。この点だけでも、RTMPの悩みの種だったスタッタリングを排除します。これらの技術にあまり詳しくないので見逃しているかもしれませんが、音声トラックでパケットが失われた場合、ビデオトラックがブロックされずに再生を続けると、どうやって音声とビデオの同期が取れるのですか?

リレーの負荷分散は範囲外なの?書いてある内容には触れられてない気がするけど、見落としたかな。

こんにちは、質問があるんだけど。あなたのチームは、TCPとQUICの良好なスループットに関して具体的な計画を持ってる?リンク先の論文では、HTTP/2(TCP)からHTTP/3(QUIC)に移行することで、最大9.8%のビデオビットレートの削減が見られるって言ってるよね。もちろん、MoQは少し違うスタックに基づいているから、結果がそのまま当てはまるわけじゃないけど、問題は似てると思う。実はこの話、すごく興味深いんだ。最近、修士論文の一環でMsQuicのAF_XDPデータパスを調査してたから。結局、GSO/GROがより良い選択肢で、QUICはもっとハードウェアオフロードが必要だって結論に至ったよ :p

あなたの最初のアプリ、面白いと思いました。Show HNに提出してみてはどうですか?私は以前、ライブビデオプラットフォームで働いていました。MoQが再び取り組む価値があるほど面白いと感じています。

そうですね、もうすぐやりますが、他のことを直す時間にも使えるかもしれません。

「主要なブラウザがサポートしている限り、"裏側"では良いと思います(caniuseでは見つけられないのですが)」。それに、Microsoft Edge WebView2のようなWebViewエンジンがサポートすれば、開発者はすぐに使えるようになると思います(ラッピングして)。でも、逆に考えると、OBSやYouTubeが実際に役立つようにサポートを始める必要があると思いますが、どうでしょう?

そうですね…MoQはWebRTCのようなオールインワンの「ブラックボックス」から少し離れることを示しています。ブラウザの視点から見ると、重要なのはWebTransport APIです。MoQTをWebTransport APIと組み合わせて使うことで、例えばWebCodecsを使った動画プレイヤーのレンダリングの選択肢が増えます。でも、もう少し遅延を許容できるなら、再生のためにMSEのようなAPIを使ってDRMも利用できるようになります。OBSから配信できるのは、Cloudflareに入る前に取り組んでいたことですが、「ストリーミングフォーマット」層での作業に大きく依存します。そこにはメディアに関する詳細が詰まっています。その層はまだ進化中で、WARPが今のところリーディングスペックです。これがもっと固まってくると、OBSなどに組み込む意味が出てくるでしょう。今日の時点でも、Norsk(https://norsk.video/)を使って、WARPドラフトの初期バージョンに似た基本的なfMP4形式で動画を公開できます。YouTubeに関しては、GoogleにはMoQTに非常に積極的に貢献している人たちがいますが、彼らがYouTubeのような製品にいつ、どのように展開する予定なのかは正確にはわかりません。

https://caniuse.com/webtransport https://caniuse.com/webcodecs 技術的にはWebCodecsは必須じゃないけど、MSEを使って描画することもできる。ただ、その場合は手間がかかって遅延も大きくなる。Safariをサポートするために、WebSocketのフォールバックとWASMでのOPUSエンコーダーに取り組んでる。

関連ありそうなので、CloudflareがホストしているHTTP/3を使ったサイトに訪れるFirefoxユーザー向けの情報です: https://bugzilla.mozilla.org/show_bug.cgi?id=1979683

macOS限定?WindowsのFF 141と142では再現しないよ。

ハッピーアイボールズの問題かも?詳しい人に伝えてみるね、ありがとう。

うーん…ブラウザ内でDNS over HTTPSリゾルバを有効にしてる?私はこれを再現できないけど、1.1.1.1でDoHを使ってるんだ。システムDNSを使うと、ChromeもFirefoxもHTTP/3の使用が一貫しないことが多い気がする。ブラウザがHTTPS DNSレコードを一貫して取得できないことが多いから、システムリゾルバを使うと問題が起きるんだよね。サーバーのHTTP/3サポートは、HTTPS DNSレコードか、前回成功したHTTP/2またはHTTP/1.1接続からのキャッシュされたAlt-Svcヘッダーで広告されなきゃいけないし、ブラウザは新しい接続を開くよりも、既にオープンしている接続を再利用することを好むから、HTTP/3を使うのがすごく難しくなることがあるんだ。(Alt-Svcヘッダーも、特にFirefoxでは一貫してキャッシュされないことがあるよ。)さらに厄介なのは、ブラウザ、特にChromeが接続が頻繁に失敗すると自動的にHTTP/3サポートを無効にすることがあるんだ。大学のWi-Fiをよく使ってたときにこれが起こったんだけど、UDPトラフィックの大きな(でも不安定な)量をブロックしてるみたい。Chromeがこの状態に入ると、HTTP/3の使用を完全にやめちゃって、開発者ツールでも理由がわからないんだ。(通常、開発者ツールのネットワークタブで「プロトコル」列を有効にすると、リストされたプロトコルにカーソルを合わせると、Chromeがどのようにそのプロトコルが最適な選択肢だと判断したかのツールチップが表示されるんだけど、この「強制無効」状態ではそのツールチップが表示されない。)イライラするのは、Chromeがこの状態を特定のネットワークに限定できないみたいで、突然自宅でもHTTP/3が使えなくなったこと。これを解決するには、about:flagsに行って(はい、今はchrome://flagsだって知ってるけど、気にしないで)QUICサポートのオプションを手動で有効にするしかないんだ。デフォルトで「有効」と表示されていても、ブラウザの実際の状態を反映してないことがあるから。Firefoxも同様にHTTP/3を諦めるけど、そのメカニズムはChromeよりも「粘着性」が少ないみたいで、一貫した問題は起きてないよ。さらにデバッグするには、まずEncryptedClientHelloが機能しているかどうかを確認してみて。https://tls-ech.devでテストできるよ。ECHはHTTPS DNSレコードのサポートが必要だから、それが機能していれば、あなたの設定がHTTPSレコードを解析できることを確認できる。次に、FastlyのHTTP/3チェッカーをhttps://http3.isで試してみて。これはAlt-Svcヘッダーだけを使って交渉するから、最初の読み込みは常にHTTP/2になるけど、ページをリフレッシュすれば成功したHTTP/3接続が得られるはず。Cloudflareのテストページhttps://cloudflare-quic.comはHTTPS DNSレコードとAlt-Svcヘッダーの両方を使っているから、最初の試みでHTTP/3接続ができれば、HTTPSレコードを正しく解析できているってことになる。これらのテストの結果を教えてね。Firefoxに問題があるかもしれないけど、私が挙げた多くの問題のせいで、全員に一貫して起こるわけではないと思う。(Cloudflareの人がこれを読んでいたら、https://cloudflare-quic.com/favicon.icoをブロックしている何らかの設定ミスがあることを知っておいてほしい。それに、そのページでの読み込み遅延も少しあるのは、https://web.archive.org/web/20230424015350im_/https://www.cl...から画像を引っ張っているからで、本来は「id_」リンクを使うべきなんだ。そうすれば、インターネットアーカイブのサーバーが何かを再書き換えようとしなくて済むから、通常見られる遅延の原因になることが多いんだよ。(実際、数年前のサーバー移動の失敗時に、Cloudflare Workersとその機能を使ってサイト全体を一時的に復活させたことがあって、id_トリックを知った瞬間にうまくいったよ。)あるいは、そのアセットをhttps://www.cloudflare.com/img/nav/globe-lang-select-dark.sv...に戻してもいいよ。メインサイトでまだ生きてるから、Wayback Machineから引っ張る必要はないしね。)HTTP/3とその奇妙な特性について、過去数年でかなりの時間をかけて実験してきたんだ。素晴らしいプロトコルだけど、実装やデプロイに関しては奇妙で特異な問題がたくさんあるんだよね。

https://moq.dev/publish/ でデモを試したけど、めっちゃスムーズだった!すごく印象的。素晴らしい技術をありがとう!モバイルで https://moq.dev/watch/?name=bbb のビッグバックスバニーのデモを見ると、横に黒いラインがたくさん出るんだ。(不思議なことに、同じWi-FiネットワークなのにPCでは大丈夫。)これはバッファサイズのせいかな?クライアント側で増やせる?それともサーバー側でやるべき?それと、「グローバル」CDNマップに韓国を入れてくれてありがとう!

横の黒いライン?それが何かはわからないけど、ソース動画に合わせて要素をリサイズして、さらにウィンドウに合わせてCSSでリサイズしてるよ。

Android/Chromeでは黒いラインは出ないけど、フルスクリーンにするとアスペクト比を無視される。横に黒いバーを追加する代わりに、動画の上下が完全にカットされちゃう。

すごい、めっちゃ早くストリーミング始まるじゃん! WTF

これってChromeだけなの?AndroidのFirefoxだと「ブラウザサポートなし」って出るんだけど :(

MacBook Air M4で600Mbpsの接続だと、瞬時にすごくいい感じだよ。

ページにはたくさんのRustコードとWASMが書かれてるね。もしかして、君のスマホのCPUがWASMを速く処理できないのかも?僕のSamsung S20では黒い線は全然出ないよ。

OnePlus TenのChromeで、黒い線が頻繁にちらつくんだ。上の方から右下に向かって出てくるのを見ると、リフレッシュのアーティファクトかもしれないな。ローリングシャッター効果みたいな感じだよ。

この息を呑むような投稿には「なんで気にする必要があるの?」ってセクションがあって、Media over QUICがメディアの出版社やエンドユーザーにどう利益をもたらすのか全然説明されてないんだよね。結局、これらの二つがこのやり取りにおいて一番重要な(もしかしたら唯一の)当事者なのに。だから、なんで気にする必要があるの?

ごめん、前のブログ記事を繰り返さないように頑張りすぎたかも。https://moq.dev/blog/replacing-webrtc/ それに、君の言う通り、MoQは主に開発者に利益をもたらすもので、エンドユーザーにはあまり関係ないんだよね。機能をスケールさせたり実装したりするのがすごく楽になるから、間接的な利益があるって感じ。

エンドツーエンド(ガラスからガラスまで)のレイテンシーがかなり良くなったね。主にプロトコルがリクエスト/レスポンスじゃなくなったからだよ。

すごい!いい仕事してるね。これが初のQUIC CDNだって読んで、信じられないと思ったんだけど、もう少し掘り下げてみたらMedia over QUICは独自のものだってわかった。かなりクールだね。

この「ただ発表された」リンクは、何のことかわからない人にはすごくいいよ。https://blog.cloudflare.com/moq/ (私、見逃しちゃった)

ただの別のプロトコルじゃない;新しいデザイン哲学だ。 これにはAIセンサーが反応した…

放送規模でのサブ秒レイテンシー でも、実際のマルチキャストはないんだよね。

このプロジェクト大好きで、kixelatedのブログを時々読んでるよ。GitHubでもフォローしてるし。まずは、kixelatedとCloudflareの素晴らしい仕事におめでとう!ライブストリーミングについて質問があるんだけど、通常ライブストリーミングって何百人、何千人も同時に見るよね。MoQでマルチキャストを実装するアイデアや可能性はあるのかな?前はHTTP/1.1とHTTP/2でTCPが使われてたけど、今はHTTP/3でUDPを使うのは現実的なアイデアだと思う。君の考えを聞きたいな。AkamaiやBBCの人たちもこれに取り組んでたのを知ってるよ。

ありがとう!マルチキャストは必要ないよ!CDNは実質的にマルチキャストを実装していて、L7でキャッシュを使ってるから、ルーターやISPにL3で実装させる必要がないんだ。実際、僕もTwitchで5年間それをやってたよ。理論的には、マルチキャストはCDNのエッジからISPへのトラフィックを減らせるかもしれないけど、年に一度の大規模な放送(例:スーパーボウル)だけだね。多くのCDNは、ISP内にCDNエッジを置くことでこれを回避してる。小規模なイベントは、同じ経路を共有する視聴者が少ないから恩恵を受けないんだ。他にもマルチキャストには混雑制御や暗号化の問題があるけど、解決できないわけじゃない。ただ、マルチキャストの連携的な性質が修正を難しくしてる。マルチキャストはP2Pに最も恩恵をもたらすけど、CDNがこんなに大きくなっちゃったから、普及するとは思えないな。マルチキャストから恩恵を受けるはずのWebRTCも、RTP(マルチキャストを考慮して設計された)を使ってるのに、サポートに興味を示してないみたい。でも、Googleが自社のネットワーク内でMeetにマルチキャストを使ってるって噂は聞いたことがあるから、もしかしたらね?

MOQはフェイルバックの解決や優雅な劣化をどう扱ってるの?それと、zedでフルスクリーンがちゃんとフルスクリーンにならない理由がよくわからないんだけど。