Minifier e abbellimento CSS

CSS Minifier & Beautifier è uno strumento di foglio di stile bidirezionale: comprime i CSS rimuovendo tutto ciò che il browser non ha bisogno: commenti, spazi bianchi, punti e virgola ridondanti, colori esadecimali a forma lunga e unità su valori zero - e può invertire il processo, espandendo un pacchetto di produzione a riga singola in regole leggibili e correttamente rientrate. Ogni byte che spogli da un foglio di stile che blocca il rendering è un byte che il browser scarica e analizza prima, che alimenta direttamente le metriche del Web Vitals come la prima vernice contentata e la più grande vernice contenta.

Il minifier è deliberatamente conservativo. È pienamente consapevole dei valori letterali di stringa, dei valori URL() e delle espressioni calc(), quindi non rimuove mai lo spazio bianco da cui calc (100% - 20px) dipende, non riscrive mai il testo simile a un colore all'interno di una stringa di contenuto e non tocca mai la spaziatura che distingue div :hover from div:hover. Sui tipici fogli di stile scritti a mano ci si può aspettare una riduzione del 25-40% prima di Gzip; combinato con Gzip o Brotli sul filo, la minificazione rade ancora una fetta significativa perché la compressione funziona meglio su input ripetitivi e senza commenti.

Tutto funziona al 100% dal lato client nel tuo browser. Il tuo CSS non viene mai caricato, registrato o archiviato su nessun server, il che significa che puoi incollare in sicurezza il codice di sistema di progettazione proprietario, gli stili di prodotto inediti o il lavoro del client. Funziona anche offline una volta caricata la pagina, utile quando hai bisogno di un passaggio minimifico rapido senza cablare una pipeline completa di PostCSS o Esbuild.

La minimizzazione qui è responsabile della sintassi piuttosto che un insieme di regole di ricerca e sostituzione, che è ciò che rende sicuro l'esecuzione su fogli di stile di produzione: gli spazi bianchi all'interno delle stringhe, i valori URL() e i selettori di attributi vengono lasciati da soli, poiché la sua rimozione cambierebbe ciò che corrisponde al CSS. I commenti che iniziano con un punto esclamativo vengono conservati, che è la convenzione per le intestazioni della licenza che devono sopravvivere a una build.