コンテナとコーデック、作業ごとに必要なデコーダー
動画ファイルは、別々に圧縮されたトラックを入れたコンテナ（MP4、MOV、WebM、MKV）です。通常は映像トラック1本（H.264、HEVC、VP9、AV1など）と音声トラック1本（AAC、Opus、MP3、PCMなど）が入っています。ファイルを開くのはコンテナを読むだけで、デコードにはコーデックごとのデコーダーが必要です。ブラウザはそれをWebCodecsで提供しますが、MDNによればブラウザや端末がWebCodecsの定めるコーデックの一部しか対応しないこともあります。
5つの作業は必要なものが違います。GIFと静止フレームは映像トラックをデコードします。音声の書き出しは音声トラックだけをデコードして映像は捨てるので、映像コーデックに非対応でも動きます。精密カットと圧縮は両方のトラックをデコードして再エンコードします。高速カットは圧縮済みのパケットをデコードせずにコピーするので、そのコーデックを受け入れるコンテナさえあれば済みます。
結果は可能ならメモリにためず、ブラウザ専用の保存領域（OPFS）の一時ファイルに書き込みます。結果を消すと削除され、7日たつと整理されます。WebCodecsがない場合はリアルタイムで録画する互換モードになり、動画10分、音声は元ファイル20分まで、GIFは20秒・8fps・480pxという上限があります。
- コンテナ
- トラックとそのタイミングを入れるファイル形式。MP4、MOV、WebM、MKV、WAVなど。
- コーデック
- 1本のトラックの圧縮方式。映像はH.264・HEVC・VP9・AV1、音声はAAC・Opus・MP3・PCMなど。
- デマックス・マックス
- コンテナをトラックに分けること、トラックを新しいコンテナに書き込むこと。
- WebCodecs
- Webページが端末の音声・映像のデコーダーとエンコーダーを使えるようにするブラウザーAPI。
例：iPhoneの動画1本で5つの作業
カメラ設定High Efficiencyで撮った1920 × 1080のMOV（HEVC映像、AAC音声）を、HEVCデコーダーのないブラウザで開いた場合：
開く コンテナ QuickTime、映像 hevc 1920 × 1080、音声 aac → 開ける
音声 映像トラックは捨て、AACだけデコード → MP3は成功
カット・高速 パケットをMP4にコピー、デコードなし → コピー経路なのでHEVCデコーダー不要
GIF、フレーム デコードしたHEVCのフレームが必要 → デコーダーのエラーで停止
圧縮 デコードしたHEVCのフレームが必要 → デコーダーのエラーで停止
HEVCをデコードできるブラウザで同じファイル → 5つとも実行できる
つまり「非対応」はたいてい「この環境ではこのコーデックに非対応」という意味です。ファイルのコーデックを調べる方法と、H.264で撮影する方法はMOVをGIFにするガイドにあります。
作業ごとに読むものと書くもの
| 作業 | 読むもの | デコーダーが必要なコーデック | 結果 |
|---|
| GIF | 映像トラックだけ | 映像コーデック | GIF、1フレーム最大256色 |
|---|
| 音声 | 音声トラックだけ | 音声コーデック | MP3（128–320 kbit/s）または16ビットWAV |
|---|
| 圧縮 | 映像と音声 | 両方のコーデック | H.264のMP4、またはVP9・VP8・AV1のWebM |
|---|
| カット・精密 | 映像と音声 | 両方のコーデック | 再エンコードしたMP4またはWebM |
|---|
| カット・高速 | 圧縮済みパケット | なし（コピー） | 元のコーデックのままのMP4またはWebM |
|---|
| フレーム | 映像の1フレーム | 映像コーデック | 元の解像度のPNG・JPG・WebP |
|---|
結果の確認
- 開くとファイルの行に解像度・長さ・容量が表示されます。「音声のみ」なら扱える映像トラックがありません。
- 実行後、結果の欄に前後の容量と、動画なら出力解像度が出ます。ダウンロード前に「結果」タブで再生してください。
- 「結果」と「元の動画」のタブを切り替えて、同じ瞬間を見比べます。
トラブルシューティング
| 症状 | 考えられる原因 | 確認方法 | 対処 |
|---|
| ファイルがまったく開かない | 読み込み側が知らないコンテナか、ファイルの破損 | 別のプレーヤーで再生し、ffprobeで形式を確認 | 作ったアプリからMP4（H.264・AAC）で書き出し直す |
|---|
| 開けるが、GIF・フレーム・圧縮がデコーダーのエラーで止まる | ブラウザにこの映像コーデックのデコーダーがない（主にHEVCやProRes） | ffprobeでコーデックを見るか、別のブラウザで同じファイルを試す | デコードできるブラウザを使うかH.264で撮影。映像をデコードしない音声書き出しと高速カットは可能 |
|---|
| 互換モードの案内が出る | このブラウザにWebCodecsがなく、以前のリアルタイム方式を使う | オプションの下の案内 | 最新のChrome・Edge・Firefoxを使う。互換モードではタブを表示したままにする |
|---|
| 音声の作業しか実行できない | ファイルに映像トラックがない | ファイルの行に音声のみと出る | 正常です。音声を変換するか、動画ファイルを開いてください |
|---|
| 結果が元より大きい | よく圧縮された元の動画を、より高い画質で再エンコードした | 結果の欄に増加率が出る | 小さめの画質・解像度の上限・目標容量を使い、切り出すだけなら高速カット |
|---|
ほかの方法
| 方法 | こんなときに向いています |
|---|
| パソコンのFFmpeg | 一括処理、スクリプト、ブラウザがデコードできないコーデック（ProRes、多くのサラウンド形式）が必要なとき。プレビューはなく、コマンドラインだけです。 |
|---|
| 作業ごとのページ：動画をGIFに、動画をMP3に、切り出し、圧縮、フレーム | 同じエンジンで、1つの作業の設定があらかじめ選ばれたページです。 |
|---|
この方法の限界
- コーデック対応はブラウザが決めます。HEVC・ProRes・サラウンド音声のデコーダーをここで追加することはありません。
- 一度に1ファイル、主な映像と音声のトラック1本ずつだけを扱います。追加の音声トラックと字幕は外れます。
バージョンと出典
tests/media-browser.mjsで、Chromium 153とFirefox 155を使い、音声付き6秒・1920 × 1080のMP4テスト信号で確認しました。高速・精密カットが長さと音声を保ち、MP3・WAV・GIF・フレームの作業が指定どおりの結果を出し、出力はFFprobeとPillowで別途デコードし直して検査しています。任意の実行で、500MBを超える1時間のファイルの最後の1分も切り出します。コーデック対応はブラウザと端末によって異なります。
参照した公式ドキュメント
メディア編集
動画の切り出しやフレーム・GIF・音声の抽出をブラウザで。範囲と出力設定を確認して保存できます。利用可能な形式は端末のコーデック対応によります。
使い方
- 元ファイルを開く
- 処理方式と設定を選ぶ
- 実行して結果を確認し保存
対応形式
MP4 / WebM / MOV / MP3 / WAV / OGG / M4A → MP4 / WebM / GIF / PNG / WAV / MP3 — 読み込み・書き出しはブラウザの対応状況によります。
このツールでできること
ファイルを範囲読み込みし、高速キーフレームカットまたはWebCodecs精密処理を行います。対応確認後にMP4・WebMを保存し、音声・GIF設定と元解像度フレーム抽出を提供します。
処理方式と検証状況
advanced · Mediabunny / WebCodecs / OPFS. 品質検証中です。Pro・Flagship水準はまだ実証されていません。
書き出す前に
高速カットは範囲内のキーフレームに短縮します。精密モードは再エンコードし、コーデック対応は環境次第です。可能なら端末の一時保存を使います。互換録画の短時間制限は残ります。
よくある質問
対応サイズは何で決まりますか？
端末のメモリ・保存容量・コーデック対応によります。テスト例はすべてのファイルの動作保証ではありません。
ファイルはアップロードされますか？
このツールで開いたファイルはアップロードせず端末で処理します。コミュニティの投稿に明示的に添付する画像は別途アップロードされます。一部のエンジンやモデルは外部から取得するため、IPアドレスなどの接続情報は配信元に伝わります。
作業は自動保存されますか？
いいえ。画像と編集状態はこのタブに保持され、メディア出力は端末の一時保存を利用する場合があります。言語を変えても作業は残りますが、再読み込み、タブを閉じる操作、別のページへの移動で失われることがあります。