目次一覧
状態:試行錯誤履歴
閲覧数:3,233
投稿日:2013-04-01
更新日:2019-10-14
管理側としてやりたいこと ／ この問題を両方解決するためには？
管理側としてやりたいこと
複数CSSを効率よく管理したい
サーバーとの通信回数を出来るだけ減らしたい
この問題を両方解決するためには？
サーバー側で1ファイルにまとめる
複数のCSSファイルをサーバーでまとめてSEO対策しよう
なぜ複数のCSSファイルを、1つにまとめたいの？
何が問題？
・この件は知っていたが、これまであまり速度のことを気にしたことはなかったので試したことはなかった
・今回、CSSをドキュメントルートより上階層から読み込むよう変更したので、ついでに挑戦してみた
実際に試してみた
文字列として連結
リンク先のように複雑なことをやりたいわけではないので
・PHPのみ利用
・「<link rel="stylesheet"で読み込んだPHPファイルにて、「file_get_contents」で取得した文字列(CSS)を単に連結して出力しているだけ
▼style.php
<?php
// ヘッダ出力
header("Content-Type: text/css; charset=utf-8");
$str = '';
if (is_file(""ドキュメントルート上のパス/style.css")) $str .= file_get_contents("ドキュメントルート上のパス/style.css");
if (is_file(""ドキュメントルート上のパス/top.css")) $str .= file_get_contents(""ドキュメントルート上のパス/top.css");
echo $str;
※「file_get_contents」の変わりに「include」でも、同じ結果を得ることが出来る
デメリット
デバッグが若干やりづらくなる
・内容に応じた外部CSSを読み込んでいる場合は、Chrome等でデバッグする場合、そのCSSファイル名を確認でき、視覚的にわかりやすい
・一方、この方式のファイルをデバッグすると、CSSファイル名は「css.php」となるため、実際にはどのファイル名で記述されているか、作成者以外には分からない(いちいちグレップ検索する必要が生じる)