A css tömörítése a letöltési idő csökkentéséhez, css

Ha a webhely CSS-t használ. A kiszolgálónak minden alkalommal, amikor egy erőforrást kérek, át kell adnia a böngészőbe. És ez befolyásolja a letöltési sebességet. Minél összetettebb és kiterjedtebb a stílusfájlok, annál hosszabb ideig várják a látogató, amíg a webhely teljesen be van töltve. A CSS tömörítés használatával csökkentheti a kód méretét és javíthatja a webhely teljesítményét.

CSS optimalizálási funkciók

Ebben a cikkben néhány olyan trükköt adunk, amelyet a CSS és a JS tömörítéséhez használhat.
  1. Kerülje a túlzott használata a beépített CSS stílus (kínálnak HTML), ha az nem tartozik a csúcsra. Ugyanez vonatkozik a stíluscímkékre is (különálló CSS-tulajdonságok, amelyek eltérnek a megállapított szabványoktól);
  2. Kombináljon több CSS fájlt egy PHP szkriptbe. Így az ügyfélnek csak a PHP fájlt kell hívnia, ahelyett, hogy minden stílusfájlhoz HTTP kérést küldene;
  3. A tömörítési CSS magában foglalja a rövidített tulajdonságok használatát, ha lehetséges:

a teljes űrlap helyett:

A css tömörítése a letöltési idő csökkentéséhez, css

Compression CSS: online és offline eszközök

Ilyen alkalmazások a következők:

Másolni a CSS kódot a területen „Input CSS” és kattintson a „Kicsinyítse” gombot, hogy elindítsa a folyamatot. Amint látni fogja az eredményt a mező „csökkentett kimenetet”, amely lehet másolni kézzel vagy letölthető. CSS Minifier csökkenti kód eltávolításával sortörés és szóköz, az utolsó a listán pontosvesszővel. Az eszköz könnyen átalakíthatja az RGB kódot a HEX tömörített verziójává.

Ez a szolgáltatás a CSS online tömörítéséhez némileg eltér az előzőtől, mivel több lehetőséget kínál a kódok tömörítésére. Helyezze be a CSS-t a "CSS forráskódbemenet" mezőbe. Ezután válassza ki a tömörítési arányt. A "Speciális beállítások megjelenítése" részben kiválaszthatja a minimális beállítások jelölőnégyzetét. Például színes színek összezavarása, az utolsó pontosvessző törlése stb. Kattintson a "Compress" gombra a CSS tömörítésének elindításához. Ezenkívül az eszköz információt ad a bemeneti és kimeneti fájlok méretéről, valamint a minimalizálás százalékáról.

Ingyenes CSS Toolbox

Ingyenes program webfejlesztőknek. Számos eszközt tartalmaz, és képes végrehajtani a CSS kód formázását és ellenőrzését. A "Formázási beállítások" lapon válassza ki a CSS opciókat. amelyet az "Újraformázás most" gombra kattintva optimalizálni és elkezdeni a tömörítést. Az ingyenes CSS Toolbox gond nélkül eltávolítja a vesszőket és a végpontokat vesszővel, minimalizálja a színkódokat. Ez a program minden operációs rendszeren működik, kezdve a Windows XP és újabb verziókkal.

A rendszerindítási idő csökkentése a CSS optimalizálás miatt

A kiszolgáló terhelése nő a CSS fájlok méretének növekedésével. Ha a webhely megnyitása ügyfél (böngésző) segítségével történik, akkor minden CSS-adatot meg kell kérni és át kell adni. Ezért erősen ajánlott a CSS és a JS online tömörítése. A fent felsorolt ​​eszközök segítenek ezzel. A teljes optimalizálás azonban nem végezhető el a szolgáltatások és alkalmazások segítségével. Ezt a feladatot függetlenül kell elvégezni.

A Saitostroenie projekt barátságos csapata az A-tól Z-ig készített CSS tömörítést a konzisztens betöltési időkhöz.

Kapcsolódó cikkek