Pereiti prie turinio

Spartinimas talpykloje ir minifikavimas

Trys produkcinės aplinkos užduotys kyla konvejerio pakraštyje: išvengti tos pačios įvesties kompiliavimo iš naujo, išvengti kompiliatoriaus kūrimo kiekvienos užklausos metu ir sumažinti sugeneruoto CSS dydį. Visoms trims užduotims atlikti naudojamos PHP pusės pagalbinės funkcijos, veikiančios aplink kompiliatorių.

Spartinančioji talpykla

CSS generavimas kiekvieną kartą vykdo visą konvejerį. Jei turinys tarp užklausų nesikeičia, failais paremta talpykla įrašo rezultatą į diską ir pateikia jį per kitas užklausas.

Perduokite cache funkcijai tw::generate() – true numatytajam katalogui arba kelio eilutę pasirinktiniam katalogui:

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

Jei talpyklos katalogo nėra, jis sukuriamas automatiškai.

Talpyklos raktas

Raktas išvedamas iš turinio, CSS konfigūracijos ir minify vėliavėlės – tai sujungiama į maišos reikšmę failo pavadinimui tailwind_<hash>.css. Pakeitus žymėjimą, CSS įvestį arba minifikavimo būseną, gaunamas kitas raktas, taigi ir kitas failas.

Rakto CSS konfigūraciją sudaro tiesioginis css ir failų, nurodytų importPaths, turinys. Į ją neįtraukiami du dalykai: failai, įtraukti įdėtiniu @import šiuose failuose, ir TailwindPHP versija. Išvalykite talpyklą pakeitę įdėtinį importą arba atnaujinę paketą, nes priešingu atveju bus toliau pateikiama sena išvestis.

Galiojimo laikas

cacheTtl yra naudojimo trukmė sekundėmis. Pataikius į podėlį, failo modifikavimo laikas lyginamas su dabartiniu laiku; jei failas senesnis nei cacheTtl, jis laikomas praleistu, o failas kompiliuojamas iš naujo. Jei cacheTtl nenurodytas, įrašai niekada nebegalioja — išvalykite juos aiškiai.

Podėlio išvalymas

tw::clearCache() (arba funkcija clearCache()) pašalina tailwind_*.css failus iš podėlio katalogo ir grąžina ištrintų failų skaičių.

PHP
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

Kompiliatoriaus būsenos podėlis

Išvesties podėlis padeda tik tada, kai turinys kartojasi. Kai turinys keičiasi su kiekvienu iškvietimu, daugiausia kainuoja sukurti patį kompiliatorių: išspręsti @import "tailwindcss", išnagrinėti supakuotus išteklius ir sukaupti temą. Šis etapas priklauso tik nuo įvesties CSS, todėl jį galima išsaugoti ir naudoti pakartotinai.

Perduokite stateCacheFile funkcijai tw::compile() (arba new TailwindCompiler($css, $options)):

PHP
use TailwindPHP\tw;

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

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

Pirmą kartą sukūrus kompiliatorių, būsena įrašoma nurodytu keliu kaip paprastas PHP failas, kurį OPcache gali bendrinti tarp užklausų; vėliau jis įkeliamas, užuot analizavus iš naujo. Išvestis bitais sutampa su kompiliatoriumi be podėlio.

  • Failas tikrinamas pagal variklio kontrolinį atspaudą (TailwindPHP išeities failų ir išteklių dydį bei modifikavimo laiką), raktą, gautą iš įvesties CSS ir parinkčių base bei importSearchPaths, taip pat kiekvieno įvestyje importuoto failo dydį ir modifikavimo laiką. Jei duomenys nesutampa, failas sukuriamas iš naujo ir perrašomas, todėl atnaujinus TailwindPHP ar redagavus importuotą failą nereikia jokių rankinių veiksmų.
  • Kelią pasirenkate jūs: naudokite po vieną failą kiekvienam skirtingam įvesties CSS, kataloge, į kurį gali rašyti žiniatinklio serveris. Įrašymas vyksta atomiškai (laikinas failas ir rename()).
  • Įvestys, kuriose naudojamas pasirinktinis importResolver, apeina podėlį, nes sprendiklio veikimo negalima patikrinti pagal kontrolinį atspaudą.
  • Tą patį podėlį galima naudoti ir su žemesnio lygio compile() masyvo API kaip TailwindPHP\StateCache\compileCssCached($css, $cacheFile, $options).

tw::generate() nepriima stateCacheFile; kiekvieno iškvietimo metu sukuriamas naujas kompiliatorius. Kai svarbi kūrimo kaina, naudokite kompiliatoriaus egzempliorių.

Mažinimas

Minifikavimas sumažina išvestį, skirtą produkcinei aplinkai. Vėliavėlė minify tiesiogiai generuoja minifikuotą CSS serializavimo metu, todėl tai greičiausias ir tiksliausias būdas; tw::minify() vykdo eilutėmis pagrįstą minifikatorių (src/_tailwindphp/CssMinifier.php) su jau esama CSS eilute:

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

Abu būdai sukuria lygiavertę struktūrą, tačiau baitai nėra identiški. Serializavimo būdas išsaugo žemesniųjų elementų :not() selektorius, kuriuos eilučių apdorojimo būdas sujungia, todėl generuojamai išvesčiai rinkitės vėliavėlę minify, o CSS, gaunamam kaip eilutė, naudokite tw::minify().

Ką jis daro

Abu būdai taiko tą patį dydžio mažinimo veiksmų rinkinį:

Veiksmas Poveikis
Pašalinti komentarus Pašalinami /* … */ blokai
Sutraukti tarpus Sutraukiamos tarpų sekos ir šalinami tarpai aplink { } ; : , bei selektorių kombinatorius
Sutrumpinti šešioliktaines spalvas #ffffff → #fff, #aabbcc → #abc
Pašalinti nulio vienetus 0px → 0 (išsaugomos 0s/0ms laiko reikšmės)
Sutrumpinti šrifto storį font-weight:normal → 400, font-weight:bold → 700
Pašalinti tuščias taisykles Pašalinami selektoriai su tuščiais deklaracijų blokais

Pagal numatytąją elgseną nesujungiami pasikartojantys selektoriai ir trumpieji rašymo variantai — tai apsunkintų derinimą ir galėtų paveikti kaskadą.

CLI: --minify ir --optimize

CLI per dvi vėliavėles atveria serializatoriaus minifikavimo būdą:

Shell
# 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

Dabartinėje versijoje --optimize taip pat minifikuoja, todėl abi komandos įrašo tuos pačius baitus (#9). „lightningcss“ atitikmenys transformavimai vykdomi kiekvieno kūrimo metu, todėl paprasta išvestis (be vėliavėlės) jau yra optimizuota ir įskaitoma.

Likusią viešąją API dalį — tw::generate(), tw::compile(), tikrinimo metodus ir įvesties formatus — rasite API nuorodoje.