ウェブ運用実戦 二〇二六
二〇二六 オープンクロー:
マックでストーリーブック静的出力のサイズゲート
二〇二六・三・二八
フロント/リリース
九分
静的ドロップ肥大を閾値で止める手順です。リモートマックでストーリーブック静的出力のみ走査し、オープンクロー通知と継続的インテグレーション直列まで整理。スモーク・スクリプト差分・ライトハウス。ブログ・ヘルプ・購入。
01 三つの負担
一、巨大画像やフォントがレビューをすり抜けコストと初回表示を悪化。二、走査を倉庫全体に広げると依存キャッシュが混ざり閾値が無意味に。三、静的段だけ成功し公開前試験が空振りすると本番直前に表面化。
02 対照
リナックスは速度、マックはデスクトップ寄り検証と分担。同一コマンドで両方から叩けるよう環境変数を揃えます。
| 観点 | リナックス継続的インテグレーション | リモートマック巡検 |
|---|---|---|
| 主目的 | 毎コミット高速 | 公開直前の容量監査 |
| 注意 | フォント差 | 共有機キャッシュ混在 |
| 接続 | 先頭ゲート | 後段または並列一本 |
03 閾値表
数値は都度更新。単体は圧縮後、合計は出力ルート全体。
| 対象 | 警告 | 失敗 | 備考 |
|---|---|---|---|
| 出力合計 | 四十メガ超 | 八十メガ超 | 増分で見直し |
| 単一画像 | 六百キロ超 | 一・二メガ超 | 二倍率webp |
| 単一フォント | 四百キロ超 | 九百キロ超 | サブセット |
| 地図系 | 合計五メガ超 | 合計十二メガ超 | 非ホストなら除外 |
04 六歩
一、版とロックで導入し版をログへ。二、ビルドは単一スクリプト、出力先を環境変数化。三、出力ディレクトリのみ走査し地図は別閾値。四、合計と単体最大を比較し上位一覧を残す。五、オープンクローへ要約とパス。六、流水線は静的解析・単体の後段で失敗させ他ゲートと直列。
export O=storybook-static pnpm install --frozen-lockfile pnpm run build-storybook -- --output-dir "$O" node scripts/scan-static-assets.mjs --root "$O"
05 運用メモ三つ
計測
同一コミットと圧縮設定で基準を週次更新し差分のみ見る。
成果物は識別子付きで退避し比較は安定版二点。通知に枝と短い識別子を必ず入れる。
06 エラーとログ
メモリ不足は末尾ログとヒープ変数。出力不一致は設定と走査環境変数のズレ。巨大画像は上位表のパスを圧縮へ。権限は共有マックの所有者と書込可否。
07 質問
走査ルートは?
静的出力のみ。依存キャッシュ混在は偽陽性。
地図は本番閾値に?
非ホストなら別閾値か除外。セキュリティと合意。
マックでビルドする意味は?
デスクトップ寄り整合とサファリ近傍ゲートと併用。リナックスと分担。