CSS の最適化
クライアントに効率的に配信するには、Visualforce ページ内で CSS を最適化します。また、最適化された CSS では、キャッシュが改善され、読み込み時間が短くなります。
Visualforce ページ内で CSS を改善する方法は、次のとおりです。
- スタイルシートを外部化します。インライン CSS コードを Visualforce ページから削除して個別の CSS ファイルに配置します。この処理により、初回の HTTP 要求数は増えますが、個々のページサイズは小さくなります。ブラウザーがスタイルシートをキャッシュした後、全体的な要求サイズが減少します。
- すべての CSS ファイルを 1 つのファイルにまとめると、HTTP 要求数が少なくなります。
- コメントと余分な空白を削除します。結果のファイルを圧縮してダウンロード時間を短縮します。
- CSS ファイルに静的リソースを使用します。スタイルシートに静的リソースを用いると、キャッシュや、Salesforce に組み込まれたコンテンツ配信ネットワーク (CDN) を有効に活用することができます。
- Salesforce の CSS ファイルを使用しないページについては、<apex:page> タグの showHeaders 属性と standardStylesheets 属性を false に設定します。この処理により、標準の Salesforce の CSS ファイルが、生��されるページヘッダーから除外されます。