HTML, CSS és JavaScript tömörítése az automatikus optimalizálás beépülő moduljának használatával

A Google és más keresőmotorok értékét adják webhelyének, ha ilyen gyorsan betöltődik. Mivel a nézők egyikében sem sok olyan beteg van, aki sokáig vár, hogy megnézze tartalmát, és csak 1,5 másodperc van arra, hogy felhívja a figyelmüket. Ha webhelyének megnyitása hosszú ideig tart, általában elveszíti a nézőit. Tehát ez elengedhetetlen a webhely felgyorsításához. Számos módon optimalizálhatja webhelyét. De az egyik legfontosabb része az Finomítsa a HTML, CSS és a JavaScriptet.


Ha valaha is tesztettél egy sebességtesztet Google PageSpeed vagy GTmetrix, valószínűleg látja ezt a lehetőséget.

Minden webhely tölti be a sok fájlt, amely HTML, CSS és JavaScriptet tartalmaz. És a legtöbb fájl sok helyet foglal el, megjegyzéseket, blokkhatárolókat stb. Tehát lényegesen több időbe telik a megfelelő betöltés..

Ez a téma minőségétől is függ. Például egy prémium téma minőség mindig jobb, mint egy ingyenes téma. A prémium témákat a jól képzett fejlesztők jól kódolják és készítik. De az összes téma nem azonos, és eltérő típusú funkciókkal rendelkeznek. Szóval, írta kicsinyítése Ezekkel a HTML, CSS és JavaScript fájlokkal stratégiailag növelheti webhelyének sebességét, és boldoggá teheti a látogatókat.

Mi az a Minify és miért előnyös??

minification egy programozási nyelv, amely eltávolítja az összes felesleges karaktert a forráskódból a funkcionalitás megváltoztatása nélkül. Ezek a felesleges karakterek általában „szóköz karakterek, új sor karakterek, Hozzászólások, és blokkolja a határolókat ”. 

A darálás előtt és a aprítás után

A kód olvashatóságának növelésére használják, de a végrehajtásához nem szükséges. Ily módon csökkenti az interneten átvitt kód mennyiségét, és megtakarítja a sávszélességet. Szóval HTML, CSS és JavaScript tömörítése, könnyen eltávolíthatja a felesleges karaktereket a webhelyről, és jelentősen növekedés a webhely sebessége. 

Hogyan csökkenthető a HTML, CSS és a JavaScript

Kétféle módon csökkentheti a HTML-t, a CSS-t & JavaScript. Vagy megteheti a témakód szerkesztésével, vagy használhat egy WordPress plugint is Autoptimize. Ebben a cikkben megmutatjuk a mindkét folyamatot Hogyan csökkenthető a HTML, CSS és a JavaScript.

A probléma pontos HTML, CSS vagy JavaScript fájljának ismeretéhez ellenőriznie kell azt minden olyan webhelysebesség-teszt eszközön, mint például Google PageSpeed ​​eszköz vagy GTmetrix. Mivel nem minden fájl tartalmazza az ilyen típusú felesleges karaktereket.

A webhely eredményének ellenőrzése után megkapja. Az alábbiakban látható egy kép a webhelyemről, amely figyelembe veszi a CSS javítása és JavaScript.

Css, JavaScript tömörítése

Ez a téma minőségétől függ. Tehát nem kell aggódnia, ha látod, hogy mindkettő Minify, és jobb, ha prémium témát szerez.

Van néhány online eszköz, amellyel HTML, CSS és JavaScript kódot szűkíthet. 

Mielőtt bármilyen változtatást végrehajtana, készítsen biztonsági másolatot a fájlról.

# 1 Minify Code:

Minify Code eszköz

Minify Code egy Mindent egyben eszköz. Csökkenti a JavaScript, CSS és HTML kódokat. A HTML, CSS vagy a JavaScript kód másolásához és beillesztéséhez ide kell hoznia. Ezután kattintson a gombra kisebbít Választási lehetőség. Ez az eszköz automatikusan finomítja a kódot. Ezután másolja a tömörített kódot a fájlba.

A CSS és a JavaScript kódot, például a HTML kódot is szűkítheti ezzel az eszközzel.

# 2 Willpeavy:

Willpeavy

A Willpeavy egy újabb nagyszerű eszköz Finomítsa a HTML-t kódokat. Ez az eszköz ugyanúgy működik, mint a tömörített kód. Minimálja a HTML-t és a jelölésében szereplő CSS-t vagy JS-t. Ennek az eszköznek a használatához el kell másolnia a kódját ide, és kattintson a Minify elemre.

Kicsinyítés az Autoptimize plugin használatával

Autoptimize

Ha nem ismeri az ilyen kódolást, akkor jobb, ha egy plugint használ, és ajánlott kezdőknek. Tehát itt jön a A bővítmény automatikus optimalizálása mert WordPress felhasználók.

Az összes szkriptet és stíluskódot automatikusan optimalizálja, és kisebbre teszi azokat, amelyek ilyen gyorsan betöltődnek. Minimalizálja az összes HTML-t, CSS-t & Maga a Javascript kód, és ezáltal az oldal valóban könnyű. A Minification használatával ez a bővítmény fejléc lejártát és stílusokat helyez át az oldal fejére, és szkripteket áthelyezhet az láblécbe.

Az Ajánlási beállítások automatikus optimalizálása

Könnyedén megteheti az összes dolgot a plugin beállításaival. A plugin aktiválása után lépjen a következőbe: Beállítások> Autoptimize.  Kattintson a „Speciális beállítások megjelenítése” gombra.

Ban,-ben HTML szakaszban jelölje be az „HTML-kód optimalizálása” és a „HTML-megjegyzések megőrzése” elemet a gyorsabb teljesítmény érdekében.

Automatikusan optimalizálja a HTML beállításokat

Ban,-ben JavaScript szakaszban engedélyezze az „JavaScript-kód optimalizálása” lehetőséget. Engedélyezheti a „Force JavaScript in” funkciót a JS korai betöltéséhez és a JS hibák esélyének csökkentéséhez. Abban az esetben, ha a JS megszakítja a szkripteket, akkor engedélyezheti az „Add-try-catch csomagolás hozzáadása” lehetőséget..
A JavaScript-beállítások automatikus optimalizálása

Ban ben CSS szakaszban engedélyezze az „A CSS-kód optimalizálása”, az „Összefoglaló a beépített CSS-t is” lehetőséget. Engedélyezheti az „Inline and Defer CSS” funkciót is, ha a CSS tömörítve van. Próbálja ki ezt az eszközt a CSS tömörítéséhez, és illessze be a mezőbe.

A CSS beállításainak automatikus optimalizálása

Adja meg CDN URL a „CDN Base URL” mezőben. Például: ‘//cdn.example.com/’.

És végül engedélyezze az „Összesített szkript / css mentése statikus fájlként” lehetőséget. De ügyeljen arra, hogy a webszervere megfelelően kezelje a tömörítést és a lejáratot.

A CDN opcióinak automatikus optimalizálása

A kód aprítása után ne felejtse el újra ellenőrizni a webhely sebességét. Ezután hasonlítsa össze a múlt eredményekkel. Ha webhelye problémát okoz, vagy nem jelenik meg megfelelően, akkor megpróbálhatja törölni a gyorsítótár

Következtetés

HTML, CSS tömörítése és JS jótékony hatással van az Ön webhelyére. Eltávolítja a kód felesleges karaktereit, és így azok kisebbek lesznek, amelyek böngészőbarátak. Így javíthatja webhelye betöltési sebességét.

Ha ez az oktatóanyag segíti a HTML, CSS és a JavaScript minimalizálását, kérjük, ossza meg ezt a cikket Facebook, Twitter, Google+.

kapcsolódó cikkek,

  • Hogyan javíthatjuk a böngésző gyorsítótárazását a WordPress-en
  • Hogyan lehet optimalizálni a WordPress adatbázist a WP-Sweep használatával?
  • 7 legjobb képoptimalizáló a WordPress 2017-hez
  • Hogyan könnyű engedélyezni a Gzip-tömörítést a WordPress alkalmazásban a gyorsabb betöltés érdekében
Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map