Shoeisha Technology Media

CodeZine(コードジン)

記事種別から探す

[PHPプロ!] =Fiftyfoureleven.com= PHPを使ってCSSを圧縮転送し、読み込みを高速化させる手法

  • LINEで送る
  • このエントリーをはてなブックマークに追加
2007/04/03 12:09

Web開発に関するブログを綴っているFiftyfoureleven.comにて、CSSファイルを圧縮し、転送速度を高速化させる手法が紹介されています。PHPを使うことで、Apacheのモジュールを使った圧縮転送が制限されている場合でも有効です。

 Web開発に関するブログを綴っているFiftyfoureleven.comにて、CSSファイルを圧縮し、転送速度を高速化させる手法が紹介されています。PHPを使うことで、Apacheのモジュールを使った圧縮転送が制限されている場合でも有効です。

 CSSファイルは、スタイル定義が増えるにつれ、サイズが大きくなってしまいます。CSSファイルをGZIP形式で圧縮して転送することで、元ファイルの70~80%ほどのサイズになり、効率的に転送することができます。

 圧縮する方法には2通りあり、どちらも同じ効果を得られます。まず紹介する方法は、CSSファイルの一番上に簡単なPHPコードを記述して、CSSファイルの拡張子を.phpに変更します。もう1つの方法は、CSSディレクトリに2つのファイルを設置して、自動的に圧縮を行う方法です。

 まず、以下のファイルを作成します。たとえば、このファイルをgzip-css.phpという名前で保存します。

<?php 
ob_start ("ob_gzhandler");
header("Content-type: text/css; charset: UTF-8");
header("Cache-Control: must-revalidate");
$offset = 60 * 60 ;
$ExpStr = "Expires: " . 
gmdate("D, d M Y H:i:s",
time() + $offset) . " GMT";
header($ExpStr);
?>

 1つ目の方法は、このPHPファイルの下にCSSファイルを記述することです。そうすることで、ファイルは自動的にGZIP形式で圧縮され、ブラウザに送信されます。

 2つ目の方法は、より洗練された手法です。まず、gzip-css.phpをCSSファイルがあるディレクトリに保存します。

 次に、同じディレクトリに.htaccessファイルを作成し、以下のように記述します。

AddHandler application/x-httpd-php .css
php_value auto_prepend_file gzip-css.php
php_flag zlib.output_compression On

 この方法を使うと、mod_deflateなどのApacheモジュールが使えない場合でも、ブラウザに転送する前にファイルを圧縮することができます。圧縮されて転送されていない場合は、ぜひこの方法を試してみてはいかがでしょうか。(PHPプロ!

関連リンク

関連ニュース

転載元

 PHPプロ!:最新のPHPニュース

  • LINEで送る
  • このエントリーをはてなブックマークに追加
All contents copyright © 2006-2017 Shoeisha Co., Ltd. All rights reserved. ver.1.5