Önbelleğe Alma ve Küçültme
Üretim sürecinde ardışık düzenin sonunda üç konu ele alınır: aynı girdiyi yeniden derlemekten kaçınmak, her istekte derleyici oluşturma maliyetinden kaçınmak ve oluşturulan CSS çıktısını küçültmek. Bu üçü de derleyiciyi çevreleyen PHP tarafı yardımcılarıdır.
Önbelleğe Alma
CSS oluşturma işlemi her çağrıda tüm ardışık düzeni çalıştırır. İstekler arasında değişmeyen içerikler için dosya tabanlı önbellek sonucu diske yazar ve sonraki çağrılarda sunar.
Varsayılan dizin için true veya özel bir dizin için yol dizgesi olmak üzere, cache değerini tw::generate() öğesine iletin:
use TailwindPHP\tw;
// Cache to the default directory: sys_get_temp_dir() . '/tailwindphp'
$css = tw::generate([
'content' => '<div class="flex p-4">Hello</div>',
'cache' => true,
]);
// Cache to a custom directory
$css = tw::generate([
'content' => '<div class="flex p-4">Hello</div>',
'cache' => '/path/to/cache',
]);
// With a time-to-live (seconds)
$css = tw::generate([
'content' => '<div class="flex p-4">Hello</div>',
'cache' => true,
'cacheTtl' => 3600, // expire after 1 hour
]);
Önbellek dizini yoksa otomatik olarak oluşturulur.
Önbellek anahtarı
Anahtar; içerikten, CSS yapılandırmasından ve minify işaretinden türetilir, ardından dosya adına tailwind_<hash>.css olarak hash'lenir. Biçimlendirmede, CSS girdisinde veya küçültmenin açık olup olmadığında yapılan her değişiklik farklı bir anahtar ve dolayısıyla farklı bir dosya oluşturur.
Anahtardaki CSS yapılandırması, satır içi css ile importPaths içinde adı geçen dosyaların içeriklerinden oluşur. İki girdi bu kapsama girmez: bu dosyalardaki iç içe @import aracılığıyla alınan dosyalar ve TailwindPHP sürümü. İç içe bir içe aktarmayı düzenledikten veya paketi yükselttikten sonra önbelleği temizleyin; aksi takdirde eski çıktı sunulmaya devam eder.
Yaşam süresi
cacheTtl saniye cinsinden bir kullanım süresidir. Önbellek isabetinde dosyanın değiştirilme zamanı geçerli zamanla karşılaştırılır; dosya cacheTtl değerinden eskiyse önbellek kaçırması sayılır ve yeniden derlenir. cacheTtl yoksa girdilerin süresi dolmaz; bunları açıkça temizleyin.
Önbelleği temizleme
tw::clearCache() (veya clearCache() işlevi), önbellek dizinindeki tailwind_*.css dosyalarını siler ve silinen dosya sayısını döndürür.
use TailwindPHP\tw;
use function TailwindPHP\clearCache;
$deleted = tw::clearCache(); // default directory
$deleted = tw::clearCache('/path/to/cache'); // custom directory
clearCache('/path/to/cache'); // function form
Derleyici durumu önbelleği
Çıktı önbelleği yalnızca aynı içerik yeniden geldiğinde işe yarar. İçerik her çağrıda değişiyorsa maliyetli kısım derleyicinin kendisini oluşturmaktır: @import "tailwindcss" çözümleme, paketlenmiş kaynakları ayrıştırma ve temayı biriktirme. Bu aşama yalnızca girdi CSS değerine bağlıdır; bu nedenle saklanıp yeniden kullanılabilir.
stateCacheFile değerini tw::compile() (veya new TailwindCompiler($css, $options)) öğesine iletin:
use TailwindPHP\tw;
$compiler = tw::compile($themeCss, [
'stateCacheFile' => __DIR__ . '/cache/tailwind-state.php',
]);
$css = $compiler->generateExact($html, true);
İlk oluşturma sırasında durum, belirtilen yola düz PHP dosyası olarak yazılır ve OPcache bunu istekler arasında paylaşabilir; sonraki oluşturmalarda yeniden ayrıştırmak yerine bu dosya yüklenir. Çıktı, önbellek kullanılmayan derleyicinin çıktısıyla bayt bayt aynıdır.
- Dosya; bir motor parmak izine (TailwindPHP kaynaklarının ve kaynak dosyalarının boyutu ile değiştirilme zamanı), girdi CSS değerinden ve
baseileimportSearchPathsseçeneklerinden türetilen bir anahtara ve girdinin içe aktardığı her dosyanın boyutuna ve değiştirilme zamanına göre doğrulanır. Uyumsuzluk dosyayı yeniden oluşturup yazar; böylece TailwindPHP yükseltmek veya içe aktarılan bir dosyayı düzenlemek elle işlem gerektirmez. - Yolun sahibi sizsiniz: her farklı girdi CSS için web sunucusunun yazabildiği bir dizinde ayrı dosya kullanın. Yazma işlemleri atomiktir (geçici dosya ve
rename()kullanılır). - Özel
importResolverkullanan girdiler önbelleği atlar; çünkü çözümleyicinin davranışı parmak iziyle belirlenemez. - Aynı önbellek, daha alt düzeydeki
compile()dizi API çevresindeTailwindPHP\StateCache\compileCssCached($css, $cacheFile, $options)olarak da kullanılabilir.
tw::generate(), stateCacheFile almaz; her çağrıda yeni bir derleyici oluşturur. Oluşturma maliyeti önemliyse bir derleyici örneği kullanın.
Küçültme
Küçültme, üretim için çıktıyı küçültür. minify işareti, serileştirme sırasında küçültülmüş CSS çıktısını doğrudan üretir; bu hem en hızlı hem de en hassas yoldur. tw::minify() ise dize tabanlı küçültücüyü (src/_tailwindphp/CssMinifier.php) mevcut bir CSS dizesine uygular:
use TailwindPHP\tw;
// Minify during generation (serializer path, preferred)
$css = tw::generate([
'content' => '<div class="flex p-4">Hello</div>',
'minify' => true,
]);
// Or minify an existing string (string-based post-pass)
$css = tw::generate('<div class="flex p-4">Hello</div>');
$minified = tw::minify($css);
İki yol eşdeğer yapı üretir ancak baytları aynı değildir. Serileştirici yolu, dize aşamasının daralttığı alt öğe :not() seçicilerini korur. Bu nedenle oluşturulan çıktı için minify işaretini tercih edin; dize olarak gelen CSS için tw::minify() kullanın.
Yaptığı işler
Her iki yol da aynı boyut küçültme adımlarını uygular:
| Adım | Etkisi |
|---|---|
| Yorumları kaldırma | /* … */ bloklarını kaldırır |
| Boşlukları daraltma | Boşluk dizilerini daraltır ve { } ; : , çevresindeki boşluklarla seçici birleştiricilerinin çevresindeki boşlukları kaldırır |
| Onaltılık renkleri kısaltma | #ffffff → #fff, #aabbcc → #abc |
| Sıfır birimlerini kaldırma | 0px → 0 (0s/0ms zaman değerlerini korur) |
| Font ağırlığını kısaltma | font-weight:normal → 400, font-weight:bold → 700 |
| Boş kuralları kaldırma | Bildirim bloğu boş olan seçicileri kaldırır |
Tasarım gereği yinelenen seçicileri birleştirmez veya kısaltılmış özellikleri bir araya getirmez; ikisi de hata ayıklamayı zorlaştırabilir ve basamaklandırmayı etkileyebilir.
CLI: --minify ve --optimize
CLI, serileştiricinin küçültme yolunu iki işaret üzerinden sunar:
# Optimize and minify (smallest output)
tailwindphp -i ./src/app.css -o ./dist/styles.css --minify # or -m
# Meant to optimize without minifying
tailwindphp -i ./src/app.css -o ./dist/styles.css --optimize
Mevcut sürümde --optimize de küçültme yapar; dolayısıyla iki komut da aynı baytları yazar (#9). lightningcss eşdeğeri dönüşümler her derlemede çalışır; bu nedenle düz çıktı (işaretsiz) zaten optimize edilmiş ve okunabilir biçimdedir.
Diğer herkese açık API arayüzler — tw::generate(), tw::compile(), inceleme yöntemleri ve girdi biçimleri — için API başvuru sayfasına bakın.