[{"data":1,"prerenderedAt":278},["ShallowReactive",2],{"blog-tag-ja-webcodecs":3},[4],{"id":5,"title":6,"author":7,"body":8,"category":260,"coverImage":261,"description":262,"draft":263,"extension":264,"locale":265,"meta":266,"navigation":267,"noindex":263,"path":268,"publishedAt":269,"seo":270,"slug":271,"stem":272,"tags":273,"updatedAt":269,"__hash__":277},"blog\u002Fblog\u002Fvideo-compress-intro.md","動画をブラウザ内で圧縮する — \u002Ftools\u002Fvideo-compress の思想と使い方","Zerosend Editorial",{"type":9,"value":10,"toc":245},"minimark",[11,15,28,32,35,43,54,57,60,83,87,114,117,121,124,128,139,175,178,182,189,192,198,204,210,216,219,242],[12,13,14],"p",{},"打ち合わせ動画、商品撮影、画面録画、子供の運動会。日常で動画を扱う場面は増える一方で、SNS やメッセンジャーのサイズ制限、メールの添付上限、サーバーのストレージコストという現実的な壁にぶつかります。",[12,16,17,18,27],{},"Zerosend は ",[19,20,22,23,26],"a",{"href":21},"\u002Ftools\u002Fvideo-compress","動画圧縮ツール (",[24,25,21],"code",{},")"," を、この「軽くしたいだけなのに、動画を他人のサーバーに預ける必要はない」という素朴な違和感を起点に作りました。なぜ作ったのか、どう使うのか、裏で何が起きているのかを整理します。",[29,30,31],"h2",{"id":31},"なぜブラウザ内で動画を圧縮するのか",[12,33,34],{},"動画は個人情報そのものです。顔・声・背景・位置情報、ときには画面録画の中にパスワードや顧客名まで写り込みます。これをオンラインの圧縮サービスにアップロードするということは、その内容を一度他人のサーバーに預けることです。",[12,36,37,38,42],{},"多くのサービスは「一定時間で自動削除」を謳いますが、",[39,40,41],"strong",{},"その削除は利用者から検証できません","。削除完了のスクリーンショットを送ってくれるわけでもなく、ログがどこまで残るかも不透明です。未公開の企画映像や社内会議の録画を、無料ツールに放り込むことに抵抗を感じたことがある人は多いはずです。",[12,44,45,46,49,50,53],{},"Zerosend は逆のアプローチを取ります。",[39,47,48],{},"動画ファイルを最初から外に出さない","。処理はすべて、あなたがいま開いているこのブラウザ、ローカル端末の CPU と GPU の中だけで完結します。DevTools の Network タブを開いたまま圧縮を実行すれば、動画そのものがアップロードされていないことを自分の目で確認できます。信用してもらう代わりに、",[39,51,52],{},"検証可能にする"," — これが Zerosend の基本方針です。",[29,55,56],{"id":56},"使い方",[12,58,59],{},"操作はシンプルです。",[61,62,63,71,74,77,80],"ol",{},[64,65,66,70],"li",{},[19,67,68],{"href":21},[24,69,21],{}," を開く",[64,72,73],{},"画面中央のドロップゾーンに動画ファイルをドラッグ&ドロップ、またはクリックして選択 (MP4 \u002F WebM \u002F MOV、最大 500MB)",[64,75,76],{},"圧縮強度 (CRF) と解像度を選ぶ",[64,78,79],{},"「圧縮を開始する」をクリック",[64,81,82],{},"処理が終わると「処理完了。あなたのファイルは外に出ていません。」と表示され、ダウンロードボタンから結果を保存できる",[84,85,86],"h3",{"id":86},"設定の目安",[88,89,90,96,102,108],"ul",{},[64,91,92,95],{},[39,93,94],{},"高画質 (CRF 23)",": 画質維持を最優先。削減率は 10〜30% 程度。保存用のマスター映像向け",[64,97,98,101],{},[39,99,100],{},"標準 (CRF 28)",": 視覚的な劣化は軽微。削減率 40〜70%。ウェブ掲載・SNS 共有に",[64,103,104,107],{},[39,105,106],{},"小さめ (CRF 32)",": 多少ぼやけるが容量優先。チャット添付・LINE・メール向け",[64,109,110,113],{},[39,111,112],{},"最小 (CRF 36)",": 輪郭が甘くなる。品質より「とにかく送れる」が最優先なとき",[12,115,116],{},"解像度は 100 \u002F 75 \u002F 50% から選べます。1080p の素材を 75% にすると、CRF を 1〜2 下げるより確実にサイズが落ちます。",[29,118,120],{"id":119},"仕組み-二段構えのエンジン","仕組み — 二段構えのエンジン",[12,122,123],{},"Zerosend の動画圧縮は、単一のエンジンに依存していません。ブラウザの能力を見て、もっとも速い経路を自動で選びます。",[84,125,127],{"id":126},"_1-webcodecs-高速パス","1. WebCodecs (高速パス)",[12,129,130,131,134,135,138],{},"Chrome \u002F Edge \u002F 最近の Safari には ",[24,132,133],{},"WebCodecs"," API が実装されており、",[39,136,137],{},"GPU 支援の H.264 エンコーダ","をブラウザから直接呼び出せます。Zerosend は対応環境では次のパイプラインで処理します。",[88,140,141,147,153,160,166,169],{},[64,142,143,146],{},[24,144,145],{},"mp4box.js"," で MP4 ファイルを demux",[64,148,149,152],{},[24,150,151],{},"VideoDecoder"," でフレームを復号 (ハードウェアアクセラレーション)",[64,154,155,156,159],{},"必要なら ",[24,157,158],{},"OffscreenCanvas"," でリサイズ",[64,161,162,165],{},[24,163,164],{},"VideoEncoder"," で H.264 に再エンコード (GPU)",[64,167,168],{},"音声はロスレスコピー (AAC のチャンクをそのまま維持)",[64,170,171,174],{},[24,172,173],{},"mp4-muxer"," で MP4 に mux し、Blob として出力",[12,176,177],{},"数百 MB の動画も数十秒で処理できます。処理後の結果カードに「エンジン: webcodecs」と表示されれば、このパスが走っています。",[84,179,181],{"id":180},"_2-ffmpegwasm-フォールバック","2. ffmpeg.wasm (フォールバック)",[12,183,184,185,188],{},"WebCodecs が未対応のブラウザ、HEVC などの特殊なコーデック入力、mp4box が parse できない特殊コンテナのときは、自動的に ",[24,186,187],{},"ffmpeg.wasm"," に切り替わります。完全に CPU で処理するため速度は落ちますが、対応できるフォーマットの幅が段違いに広いのが強みです。ffmpeg-core は Cloudflare R2 から、同一オリジンのパスを経由して 32MB の WASM を取得します。初回のみ時間がかかりますが、2 回目以降はブラウザのキャッシュから復元されます。",[29,190,191],{"id":191},"よくある質問",[12,193,194,197],{},[39,195,196],{},"Q. 処理中にインターネット接続が切れたら？","\nA. 動画本体の送受信は発生しないため、圧縮処理自体は継続します。エンジン (ffmpeg.wasm) が未ロードの状態だと初回ダウンロードで失敗しますが、一度読み込んだあとはオフラインでも動作します。",[12,199,200,203],{},[39,201,202],{},"Q. 結果のファイルはどこに保存されますか？","\nA. ダウンロードボタンを押したときのブラウザの保存先です。サーバーには何も残りません。結果ファイルはタブを閉じるとメモリから消えます。",[12,205,206,209],{},[39,207,208],{},"Q. 画質が思ったより落ちます。","\nA. CRF を下げる (例: 28 → 23)、または解像度の縮小をやめる (50% → 100%) と改善します。素材が 4K なら、100% のまま CRF を下げるより 75% + CRF 25 の方が視覚的なバランスが取れやすいです。",[12,211,212,215],{},[39,213,214],{},"Q. iPhone で撮った MOV も処理できますか？","\nA. はい。HEVC (H.265) の場合は ffmpeg.wasm 側のフォールバックに回るため時間がかかりますが、H.264 にトランスコードされた MP4 として出力されます。",[29,217,218],{"id":218},"関連ツール",[88,220,221,228,235],{},[64,222,223,227],{},[19,224,226],{"href":225},"\u002Ftools\u002Fvideo-to-gif","動画 → GIF"," — SNS の表紙やドキュメント挿入に",[64,229,230,234],{},[19,231,233],{"href":232},"\u002Ftools\u002Fvideo-trim","動画トリミング"," — 必要な区間だけ切り出してから圧縮すると効率的",[64,236,237,241],{},[19,238,240],{"href":239},"\u002Ftools\u002Fvideo-convert","動画形式変換"," — MOV \u002F WebM → MP4 など",[12,243,244],{},"Zerosend は「日常のちょっとした加工を、あなたの端末で完結させる」ことに徹したツール集です。動画の中身があなたの手元から離れないことを、DevTools で自分の目で確かめてから使ってみてください。",{"title":246,"searchDepth":247,"depth":247,"links":248},"",2,[249,250,254,258,259],{"id":31,"depth":247,"text":31},{"id":56,"depth":247,"text":56,"children":251},[252],{"id":86,"depth":253,"text":86},3,{"id":119,"depth":247,"text":120,"children":255},[256,257],{"id":126,"depth":253,"text":127},{"id":180,"depth":253,"text":181},{"id":191,"depth":247,"text":191},{"id":218,"depth":247,"text":218},"tech",null,"Zerosend の動画圧縮ツールは、動画ファイルをサーバーに送らずブラウザ内で再エンコードしてサイズを削減します。WebCodecs で GPU 支援、未対応環境では ffmpeg.wasm にフォールバック。設計思想と使い方、仕組みを Zerosend 編集部が解説します。",false,"md","ja",{},true,"\u002Fblog\u002Fvideo-compress-intro","2026-04-20",{"title":6,"description":262},"video-compress-intro","blog\u002Fvideo-compress-intro",[274,275,133,276],"動画","圧縮","ツール","613Z3mNi94G9pdH05SAOutm_1Lv_QgpilD4PnVSTRWE",1777617519128]