Bu yazımda sizlere CSS ve JS dosyalarını küçültme (Minify) optimize etme diğer bir adı ile nasıl sıkıştırabiliriz onun anlatımını ve konu ile ilgili bir aracın tanıtımını yapacağım.
Ne işe yarar neden dosyamızı küçültmemiz gerekli?
Günümüzde artık internet hızımız arttı dosyanın boyutu pekte önem taşımıyor diye düşünebilirsiniz ancak öyle değil, js ve css dosyamızda bu işlemi uyguladığımızda hem sitemiz daha hızlı yüklenecek hem de dosyaları barındıran sunucuya uygulanan trafik düşecektir dosyalarda 5kb'lık bir kazancımız ve aylık 2000 ziyaretçi alan bir sitemiz olsa aylık 10mb'ta yakin bir tasaruf olacaktır dosya büyüklüğü ve ziyaretçi sayısına göre çok daha yukarılara da çıkabilir.
Online Minify aracı.
Bahsedilen Minify aracımız, kodlarınızı yapıştırın (Ctrl+V) JS veya CSS seçimi kendi yapar ancak fare ile yapıştırma durumunda elle seçmeniz gerek, sonrasında Küçült butonuna tıklayın.
Küçültme sonrası yapılacaklar
Küçültme sonrası kodları ana dosyanızda değiştirmeyin ana dosyanızı ilerde yapacağınız değişiklikler için saklayın yeni bir dosya oluşturup ona kaydedin.
- ana js dosyamız scripts.js optimize edilmiş dosyamız scripts.min.js
- ana css dosyamız css.css optimize edilmiş dosyamız css.min.css
şeklinde olsun ana dosyanızda değişiklik yaptığınızda tekrar küçültme yaparak aynı işlemler uygulanır.
Site yayına verilirken yapılacak olan bir diğer işlem de index dosyamızda bu dosyaları dahil etmektir.
CSS dosyalarınızı
<link rel="stylesheet" href=stylesheet/css.min.css">
JS dosyalarınızı
<script type="text/javascript" src="js/scripts.min.js"></script>KopyalaKısaca localde çalışmalarımızı yaparken ana dosyaları yayına açılacağımız zaman optimize edilmiş dosyaları kullanmalıyız.
Minify aracı hakkında.
Bu araç CSS ve JavaScript dosyalarından. Boşluğu kaldırır, yorumları kaldırır, dosyaları birleştirir (@import ifadeleri ve CSS dosyalarındaki küçük varlıklar dahil) ve birkaç genel programlama düzenini optimize eder, kısaltır.
Araç bana ait değil bu yüzden ana dosyanızdaki kodları saklamadan kullanmayın sorumluluk kabul etmem.
Bu online aracı telif hakkı Matthias Mullie ait olan
https://github.com/matthiasmullie/minify adresindeki (Lisanslı) yazılım dosyaları kullanılarak hazırlandı.
Kodlamaya devam kalın sağlıcakla.
