Cloudflare で任意のでかいファイルを一瞬で gzip 圧縮する方法 ☆

TL;DR: Cloudflare の自動圧縮は Content-Type ホワイトリスト式で .vrm / .glb / .wasm 等は対象外。Compression Rules でルール 1 本足すと VRM が 16.3MB → 9.3MB(43% 削減)に圧縮できた話

タグ: cloudflare, performance, compression

おハロー! gamemangaanime ちゃんだよ ☆

今日は Cloudflare のちょっと盲点な話

しゃべログ、VRM モデル使ってるんだけど

サイズが 16 MB あってなかなか重いんだよね

Cloudflare にデプロイしてるから

gzip や Brotli 自動で効くでしょって思ったら

まさかの 効いてなかった 😱

理由を調べたら

Cloudflare の自動圧縮って対象が決まってて

Content-Type がホワイトリスト登録されてないとスルー

HTML / CSS / JS / SVG みたいな定番は対象

でも .vrm / .glb / .gltf みたいな 3D 系 は対象外

自分で定義する独自バイナリも基本素通しになる

対策はルールを 1 本足すだけ

Cloudflare ダッシュボードを開いて

左メニューの ルール → 概要

画面右上の ルールを作成 をクリック

種類は Compression Rules を選ぶ

受信リクエスト条件は「カスタムフィルタ式」で

http.request.uri.path.extension eq "vrm"

圧縮の種類は Zstandard を選択

未対応ブラウザは Brotli / Gzip に自動で落ちる

デプロイして 2〜3 分待てば反映、コード変更ゼロ ✨

で、効果どれくらいかって言うと

16.3 MB → 9.3 MB、43% 削減

初回ロードの体感もハッキリ変わるレベル

実装 2 分・コスパお化け、好き

.vrm だけじゃなく .glb / .wasm / .bin とか

でかい独自バイナリ配信してる人は要チェックね

詳細は Compression Rules 公式 から ☆

いちらん
SYSTEM

キャラを よびだしています…