動画処理の概念

動画フレーム

動画とは、一連の画像が高速で連続して表示されるものです。この一連の画像の各々は動画フレームと呼ばれ、各フレームには、それがいつ表示されるべきかを示すタイムスタンプが関連付けられています。

動画フレームの各ピクセルは、一連の数値による色チャンネル値で表されます。非圧縮の場合、4K フレーム1枚（約 800 万ピクセル）のファイルサイズは約 25MB になります。30fps で撮影した場合、非圧縮の 4K 動画 1 時間は 3TB を超える容量となり、保存やストリーミングには現実的ではないほどの大容量となります。

コーデックは、一般的な端末のネットワークやストレージの制約下でも、動画コンテンツを実用的に保存・配信できるように、動画を通常 1 ～ 2 桁の規模で圧縮するために開発されました。

コーデック

コーデック（codec、encode/decode の略）とは、動画データを圧縮・展開するためのアルゴリズムのことです。コーデックは、さまざまな手法を用いてファイルサイズを劇的に縮小します。通常、ファイルサイズは 100 分の 1 以下にまで圧縮されます。ブラウザー内で使用される動画コーデックには、vp9、av1、h264 など多数ありますが、それらはすべて、以下の手法のいずれかを何らかの形で採用しています。

空間圧縮

コーデックは、各フレームから高周波成分の詳細 ― 人間の目にはあまり認識されにくい微細な質感やシャープなエッジ ― を選択的に除去します。

削除される詳細の量は、2 つの要素によって制御されます。1 つは、出力ストリームが使用するデータ量を決定するビットレート、もう 1 つは、エンコードロジックを規定するプロファイルとレベルを指定するコーデック文字列です。ビットレートが高く、より高性能なプロファイルを使用すれば、ファイルサイズが大きくなるという代償を払う代わりに、より多くの詳細を保持することができます。以下は、1080p の動画に対してベースライン vp9 を使用した際の、画質とビットレートのトレードオフを示しています。

時間圧縮

動画の連続するフレームは、通常、視覚的に互いに似通っています。動画コーデックは、各フレームを独立した画像としてエンコードするのではなく、フレーム間の差分を計算し、その差分のみをコンパクトなバイナリー形式でエンコードします。コーデックは通常、動き補償などのさまざまな技術を用いて、フレームの差分をエンコードするために必要なデータ量を削減します。

コーデックは、シーケンスの最初の動画フレームをキーフレームとして保存し、その後のフレームはフレーム間の差分（デルタフレームと呼ばれる）として保存します。

動画は通常、一定間隔でキーフレームを挿入してエンコードされます。特定のデルタフレームを表示するために現在のフレーム全体を構築するには、直前のキーフレームと、現在のデルタフレームに至るまでのすべてのデルタフレームを（順序通りに）デコードする必要があります。 WebCodecs では、EncodedVideoChunk インターフェースに type プロパティがあり、このプロパティには "key" または "delta" の値が設定され、そのチャンクがキーフレームかデルタフレームかを示します。

デルタフレームは、直近のキーフレーム以降のすべてのフレームに依存しているため、デコーダは動画内の任意の地点からデコードを開始することはできず、常にキーフレームから開始する必要があります。これには、実用上 2 つの影響があります。特定のタイムスタンプへのシークを行うには、最も近い直前のキーフレームを見つけ、その地点までのすべてのフレームを順番にデコードする必要があります。また、エラー回復を行うには、デコードを再開する前に、次のキーフレームまでスキップする必要があります。

VideoEncoder を使用してエンコードする場合、エンコーダーのメソッドの keyFrame パラメータを使用することで、どのフレームをキーフレームまたはデルタフレームとして設定するかを指定することができます。

encoder.encode(frame, { keyFrame: true });

エンコードとデコード

コーデックの互換性

コーデックが実用的なものとなるためには、そのコーデックを使って動画をエンコード（生の動画を圧縮されたバイナリーデータに変換する）できるだけでなく、同じコーデックを使ってその動画をデコード（圧縮されたバイナリーデータを元の動画フレームに戻す）できなければなりません。そのため、動画業界では vp9、h264、hevc、av1 といった数種類の標準コーデックが主流となっています。

主に動画コンテンツを作成するアプリケーション（動画編集ツールなど）は、主に動画のエンコードを行うため、通常、動画再生ソフトとの互換性を最大限に高めるために、エンコードに使用する動画コーデックを選択します。

主に動画コンテンツを再生するアプリケーション（例：動画再生ソフト）は、主に動画のデコードを行うため、通常、可能な限り多くのコーデックに対応しようとします。

エンコードとデコードの両方を制御するアプリケーション（例：動画ストリーミングサイト）は、コーデックの選択においてはるかに柔軟性が高く、そのためコストやエンコード速度などの要素に基づいてコーデックを選択することができます。

エンコードはコストが高い

エンコードはデコードに比べて計算負荷が大幅に高く、通常は 1 ～ 2 桁ほど大きくなります。動画会議アプリでは、vp8 のような古いコーデックがよく使用されます。これは、同じビットレートでは画質が低下するものの、vp9 のような新しいコーデックよりも計算負荷が低いためです。

ハードウェアアクセラレーション

ほとんどの民生用機器には、動画のエンコードおよびデコード専用に設計された専用ハードウェアが搭載されています。これらの専用チップをエンコードやデコードに活用することを「ハードウェアアクセラレーション」と呼び、標準的な CPU ベースのエンコードと比較して、エンコード処理を 2 桁高速化することができます。

ハードウェアアクセラレーションが最も一般的なのは H.264 および H.265 のエンコードですが、VP9 や AV1 のハードウェアアクセラレーションによるエンコードはそれほど一般的ではありません。ハードウェアアクセラレーションによるデコードは、主要なコーデックすべてで広く利用可能ですが、AV1 のデコードアクセラレーションは比較的新しい規格であるため、その対応範囲はまだ限定的です。

WebCodecs API の主な利点の一つは、ハードウェアアクセラレーションによるエンコード機能を利用できることであり、これにより、動画編集や高性能ストリーミングといったアプリケーションを一般向け機器でも実用的に利用できるようになります。

コンテナー

コーデックは、生のメディアデータをバイナリー形式の圧縮データに変換すること、およびその逆の変換のみを行うものです。WebM、MP4、MKV などの動画ファイルには、トラック情報や再生時間などのメタデータと、エンコードされたメディアデータの両方が含まれています。

各種類の動画ファイルには、それぞれ独自のコンテナー仕様があります。例えば、WebM 仕様や MP4 仕様などがあり、これらはメタデータやエンコードされたメディアをどのようにフォーマットし、ファイルストリーム内に格納すべきかを規定しています。

特定のコンテナー形式は、実際にはさまざまなコーデックに対応しています。以下に、最も一般的なコンテナー形式と、それらが対応するコーデックを示します。

動画プレーヤーは、動画ファイルを再生するために、コンテナーの仕様に従ってメタデータやエンコードされたチャンクを抽出する（デマルチプレックスと呼ばれる）とともに、エンコードされた動画や音声をデコードする必要があります。

HTMLVideoElement は多重分離とデコードの両方を処理し、主に MP4 および WebM 形式に対応していますが、WebCodecs API はコンテナー形式を扱いません。

WebCodecs で動画を再生するには、ファイルの多重分離（通常は多重分離ライブラリーを使用）を行い、その後、エンコードされたチャンクをデコードする必要があります。

同様に、WebCodecs を使用して動画ファイルを書き出すには、コンテナー仕様にも準拠し、メタデータを記述するとともに、エンコードされたチャンクを出力ファイルストリームの正しい位置に配置する必要があります。これは多重化と呼ばれますが、WebCodecs API ではネイティブに処理されないため、Mediabunny のようなサードパーティ製ライブラリーが必要となります。

多重分離および多重化に関するライブラリーのオプションについては、WebCodecs API の概要ページの多重化と多重分離の節を参照してください。

関連情報

• 動画コーデックガイド
• WebCodecs API
• WebCodecs API の使用
• コーデックの選択