データURIのブラウザ制限と互換性
ブラウザ間のデータURIサイズ制限の完全リファレンス。IE 32KB制限、モダンブラウザの最大値、モバイルブラウザサポート、互換性テスト戦略。
Compatibility
詳細な説明
ブラウザサポートとサイズ制限
データURIはWebの初期から支持されていますが、サイズ制限やエッジケースはブラウザとバージョンによって異なります。
ブラウザサイズ制限
| ブラウザ | 最大データURIサイズ |
|---|---|
| Chrome 120+ | 約512 MB（利用可能メモリに依存） |
| Firefox 120+ | 約256 MB（メモリに依存） |
| Safari 17+ | 約128 MB |
| Edge (Chromium) | Chromeと同等 |
| IE 8 | 32 KB |
| IE 9-11 | 約4 GB（実質制限なし） |
| iOS Safari | 約128 MB |
| Android Chrome | デスクトップChromeと同等 |
IE 8の32 KB制限
Internet Explorer 8は、データURIに厳格な32 KB制限を課した最後の主要ブラウザでした。IE 8の使用率は事実上ゼロですが、一部の企業環境や政府システムでは依然として必要な場合があります。
推奨最大サイズ
| コンテキスト | 推奨最大 |
|---|---|
| HTML img src | 10 KB（元ファイル） |
| CSS background-image | 4 KB（元ファイル） |
| CSS @font-face | 20 KB（元ファイル） |
| JavaScript文字列 | 10 KB（元ファイル） |
| メールHTML | 5 KB（元ファイル） |
テスト戦略
- サポートする最古のブラウザでテスト
- ローエンドデバイスでパフォーマンス影響を測定
- ビルドツールが大きなデータURIを正しく処理することを確認
- CDN/プロキシレイヤーがデータURIを除去または切り詰めないことを確認
ユースケース
コンポーネントライブラリのドキュメントを作成しており、プロジェクトのブラウザサポートマトリックスに基づいてデータURIとしてインライン化すべき最大ファイルサイズを指定する必要がある場合。