Välimuistitus ja minimointi

Kolme tuotantoon liittyvää tehtävää ovat putken loppupäässä: saman syötteen uudelleenkääntämisen välttäminen, kääntäjän rakentamisen välttäminen jokaisella pyynnöllä ja luodun CSS-tulosteen koon pienentäminen. Kaikki kolme ovat kääntäjän ympärillä toimivia PHP-puolen apuratkaisuja.

Välimuisti

CSS-tulosteen luominen suorittaa koko putken jokaisella kutsulla. Jos sisältö ei muutu pyyntöjen välillä, tiedostopohjainen välimuisti tallentaa tuloksen levylle ja tarjoaa sen seuraavilla kutsuilla.

Välitä cache funktiolle tw::generate() — true oletushakemistoa varten tai polkumerkkijono mukautettua hakemistoa varten:

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
]);

Välimuistihakemisto luodaan automaattisesti, jos sitä ei ole olemassa.

Välimuistiavain

Avain muodostetaan sisällöstä, CSS-asetuksista ja minify-lipusta, ja siitä lasketaan tiedostonimeen tailwind_<hash>.css-tiiviste. Mikä tahansa muutos merkinnöissä, CSS-syötteessä tai minimoinnin tilassa tuottaa eri avaimen ja siten eri tiedoston.

Avaimen CSS-asetukset koostuvat sisäisestä css-osasta ja kohteessa importPaths nimettyjen tiedostojen sisällöstä. Kaksi asiaa ei sisälly avaimeen: näistä tiedostoista sisäkkäisellä @import-määrityksellä ladatut tiedostot ja TailwindPHP-versio. Tyhjennä välimuisti sisäkkäisen tuonnin muokkaamisen tai paketin päivittämisen jälkeen, tai vanhaa tulostetta tarjotaan edelleen.

Voimassaoloaika

cacheTtl määrittää voimassaoloajan sekunteina. Välimuistiosuman yhteydessä tiedoston muokkausaikaa verrataan nykyiseen aikaan. Jos tiedosto on vanhempi kuin cacheTtl, tulos käsitellään välimuistihutilauk­sena ja käännetään uudelleen. Jos cacheTtl-arvoa ei anneta, merkinnät eivät vanhene — tyhjennä ne erikseen.

Välimuistin tyhjentäminen

tw::clearCache() (tai clearCache()-funktio) poistaa tailwind_*.css-tiedostot välimuistihakemistosta ja palauttaa poistettujen tiedostojen määrän.

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

Kääntäjän tilavälimuisti

Tulostevälimuistosta on hyötyä vain, kun sama sisältö tulee uudelleen. Jos sisältö vaihtuu jokaisella kutsulla, kallis vaihe on itse kääntäjän rakentaminen: @import "tailwindcss"-riippuvuuksien ratkaiseminen, paketoitujen resurssien jäsentäminen ja teeman kokoaminen. Tämä vaihe riippuu vain syötteen CSS-arvosta, joten sen voi tallentaa ja käyttää uudelleen.

Välitä stateCacheFile funktiolle tw::compile() (tai new TailwindCompiler($css, $options)):

use TailwindPHP\tw;

$compiler = tw::compile($themeCss, [
    'stateCacheFile' => __DIR__ . '/cache/tailwind-state.php',
]);

$css = $compiler->generateExact($html, true);

Ensimmäisellä alustuskerralla tila kirjoitetaan kyseiseen polkuun tavallisena PHP-tiedostona, jonka OPcache voi jakaa pyyntöjen välillä. Myöhemmillä kerroilla se ladataan jäsentämisen sijaan. Tulos on tavukohtaisesti sama kuin välimuistittomalla kääntäjällä.

• Tiedosto tarkistetaan moottorin tunnisteen (TailwindPHP-lähdekoodin ja resurssien koko ja mtime), syötteen CSS-arvosta sekä base- ja importSearchPaths-valinnoista johdetun avaimen ja kaikkien syötteeseen tuotujen tiedostojen koon ja mtime-arvon perusteella. Jos jokin ei täsmää, tiedosto rakennetaan uudelleen ja kirjoitetaan uudestaan. Siksi TailwindPHP-päivitys tai tuodun tiedoston muokkaus ei vaadi manuaalisia toimia.
• Vastaat itse polusta: käytä erillistä tiedostoa kullekin syötteen CSS-arvolle hakemistossa, johon verkkopalvelin voi kirjoittaa. Kirjoitukset ovat atomisia (väliaikaistiedosto sekä rename()).
• Mukautettua importResolver-ratkaisijaa käyttävät syötteet ohittavat välimuistin, koska ratkaisijan toimintaa ei voi tunnistaa.
• Sama välimuisti on käytettävissä alemman tason compile()-taulukon ympärillä olevassa API-rakenteessa muodossa TailwindPHP\StateCache\compileCssCached($css, $cacheFile, $options).

tw::generate() ei ota vastaan stateCacheFile-arvoa, vaan rakentaa uuden kääntäjän jokaisella kutsulla. Käytä kääntäjäinstanssia, jos alustuskustannuksella on merkitystä.

Pienennys

Minimointi pienentää tuotostiedoston kokoa tuotantokäyttöä varten. minify-lippu tuottaa minimoidun CSS-tulosteen suoraan sarjallistuksen aikana, joten se on sekä nopein että tarkin tapa. tw::minify() suorittaa merkkijonopohjaisen minimoijan (src/_tailwindphp/CssMinifier.php) valmiille CSS-merkkijonolle:

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);

Molemmat tavat tuottavat rakenteeltaan vastaavan tuloksen, mutta tavut eivät ole samoja. Sarjallistustapa säilyttää jälkeläisten :not()-valitsimet, jotka merkkijonovaihe yhdistää. Suosi siis luotua tulostetta varten minify-lippua ja käytä tw::minify()-toimintoa merkkijonona saapuvalle CSS-sisällölle.

Mitä se tekee

Molemmat tavat tekevät samat kokopienennykset:

Suunnitteluratkaisun vuoksi päällekkäisiä valitsimia ei yhdistetä eikä lyhytominaisuuksia yhdistetä kokonaisuuksiksi — molemmat vaikeuttaisivat virheenetsintää ja voivat vaikuttaa kaskadiin.

CLI: --minify vai --optimize

CLI tarjoaa sarjallistuksen minimointipolun kahden lipun kautta:

# 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

Nykyisessä versiossa myös --optimize minimoi, joten molemmat komennot kirjoittavat samat tavut (#9). lightningcss-vastaavat muunnokset suoritetaan jokaisessa koonnissa kummassakin tapauksessa, joten tavallinen tuloste (ilman lippua) on jo optimoitu ja luettava.

Katso muiden julkisten API-ominaisuuksien — tw::generate(), tw::compile(), tarkastusmenetelmien ja syötemuotojen — kuvaukset API-viitteestä.