Chromeが特定サイトだけ巨大化して見えるときの意外な原因

Posted at 2025-11-05

はじめに

ある日、大学の公式サイトを開いたら、なぜかUIが巨大化して崩れているのに気づきました。ズームも100%、拡張機能も影響していない。シークレットモードでも同じ。別のプロファイルでは正常位表示される。。

この記事では、「特定サイトだけ拡大して表示される」謎のChromeバグを調べ、修復した記録をまとめます。

対象サイトはこちら：

発生時の様子はこんな感じでした

再起動しても直りませんでした。

最初はよくある原因を順に疑いました。

「プロファイル依存の問題」だとわかりました。

次に「どのプロファイルが壊れているのか」を特定するために
アドレスバーに以下を入力しました。

chrome://version

ここで表示される「プロフィールパス」に注目します。

/Users/TaiyoYamada/Library/Application Support/Google/Chrome/Default

どうやら、メインの Default プロファイルに問題があるようです。

調べていくうちに、同様の症例を発見しました。

「特定サイトだけレイアウトが崩れるのは、GPUCache や Code Cache の破損が原因の可能性あり」

これらは、Chromeが高速化のために作る内部キャッシュです。

キャッシュ名	内容
GPUCache	CSSのアニメーションやfilter, transformなどのGPUシェーダーをキャッシュ
Code Cache	JavaScript / Wasm のコンパイル済みコードをキャッシュ

これが壊れると、特定のCSSレイヤーだけ拡大される・座標が狂うといった症状が起きるらしい。

⌘ + Q でChromeを終了。
念のためアクティビティモニタで残っていないか確認します。

Finderのメニュー → 「移動」→「フォルダへ移動...」
以下を貼り付けて「移動」をクリック

~/Library/Application Support/Google/Chrome/Default

GPUCache
Code Cache
Cache
Local Storage

※私の環境では GPUCache と Local Storage しか存在しませんでした。
バージョンによって違うみたいです。

なんと…… 一発で直りました。
大学のサイトが、まるで何事もなかったかのように正常なUIに。

調べたところ、このサイトは以下のようにGPU依存がやや強い構成でした。

これらの要素は、ChromeがGPUレイヤーを作成して描画します。
そのため、GPUCacheに壊れたシェーダーが残っていると誤描画が起きやすい。

つまり：

他のサイトではCPU描画だったから問題なかったが、
このサイトはGPU描画が多いので壊れたキャッシュが直撃した。

HTML → Layout → Skia → GPUCommandBuffer → ShaderDiskCache(GPUCache)
                  ↘︎ V8 JIT → Code Cache

GPUCache: GPU用シェーダープログラムをキャッシュ
Code Cache: JSエンジン(V8)の最適化済みコードをキャッシュ
→ どちらも壊れると「レイアウトずれ」「描画サイズ誤差」「奇妙なズーム」が発生する。

Chrome DevToolsで確認できます

このサイトでは、かなりの要素がGPUレイヤー（緑や紫）で描画されているのが分かります。