PHP ile CSS Kodlarını Sıkıştırma

Merhaba. Sizlere kendi sitemde de kullandığım css kodlarını sıkıştırma yönteminden bahsedeceğim. İlk önce bu sıkıştırma işleminin faydasından bahsedelim. Sıkıştırma sayesinde css dosya boyutunda ciddi derecede azalma görülebilir. Bu da sayfaların yüklenmesinde önemli ölçüde hızlanma sağlanması demektir. Özelikle mobil cihazlar 3G bağlantısı kullandığından yavaş internet bağlantılarına bir nebze olsun çözüm getirir. Örnek olarak css dosyam sıkıştırma yönteminden önce 38 kb idi. Sıkıştırdıktan sonra 23 kb'a düştü.

Peki bu sıkıştırma işlemi nedir? Bu işlem css dosyasında kullanılan yorum satırlarını, satırlar arası boşluğu ve kelimeler arasındaki bir karakterden fazla olan gereksiz boşlukları silme işlemidir.

Sıkıştırma işlemini yaparken css dosyasının orjinal hali üzerinde bir değişiklik yapmayacağız. Sadece php dosyası ile gereksiz karakterleri replace edeceğiz ve css dosyamızı php dosyamıza include edeceğiz. Yani içine aktaracağız. Bunun için style.php adında bir dosya oluşturalım ve içine aşağıdaki kodları yazalım.

<?php header('Content-type: text/css'); //Dosyanın bir css dosyası olduğunu tanımlıyoruz.
function compress($buffer) {
    $buffer = preg_replace('!/\*[^*]*\*+([^/][^*]*\*+)*/!'''$buffer); //Yorum satırlarını kaldırdık.
    $buffer = str_replace(array("\r\n""\r""\n""\t"''''''), ''$buffer); //Gereksiz boşlukları ve satır aralıklarını kaldırdık.
    return $buffer; }
ob_start("compress");

include('style.css'); //Css dosyamızı include ediyoruz.

ob_end_flush(); ?>

Bu işlemden sonra php dosyamız artık bir css dosyası gibi görüntülenecektir. Css dosyamızı şu şekilde çağırabiliriz:

<link rel="stylesheet" href="style.php">

Sonuçta php dosyamızın tipine text/css demiştik. Yani php dosyamız tamamen bir css dosyası gibi davranacaktır. Ama yine de style.php değilde style.css şeklinde dosyanızı çağırmak isterseniz htaccess dosyanızda:

RewriteEngine On
RewriteRule ^style.css$ style.php [NC,L]

şeklinde bir url rewrite işlemi yaparak css dosyanızı şu şekilde çağırabilirsiniz.

<link rel="stylesheet" href="style.css">

Makalemizin sonuna geldik. Sorularınız olursa memnuniyetle cevaplayabilirim.

Mehmet YAYLACI
YORUM FORMU