Minimalizacja plików HTML, CSS, JS

Szybkość wczytywania strony internetowej odgrywa ogromną rolę w jej pozycjonowaniu i przede wszystkim w odbiorze. Użytkownik przeglądający stronę internetową chce mieć wszystko na „już”. I nie ma się co dziwić. Aby sprostać jego oczekiwaniom, konieczna jest optymalizacja strony internetowej. Jednym ze sposobów jest minimalizacja plików html, css i js.

Czym jest minimalizacja (minifikacja)?

Minifikacja to nic innego jak usunięcie nadmiarowych znaków znajdujących się w kodzie interpretowanym przez komputer. Takimi znakami są spacje, tabulatory czy znaki nowych linii. Znaki te nie wpływają na debugowanie (wykonanie) kodu, a służą jedynie do zwiększenia czytelności.

Usunięcie nadmiarowych znaków powoduje zmniejszenie rozmiaru pliku, co prowadzi do jego szybszego wczytania. Przeglądarka internetowa jest w stanie szybciej załadować żądaną stronę.

W celu lepszego zobrazowania procesu minimalizacji poniżej znajduje się fragment kodu CSS przed minimalizacją:

h1 {
 text-align: center;
 color: red;
}

h2 {
 text-align: center;
 color: blue;
}

p {
 text-align: left;
 color: red;
}

I po minimalizacji:

h1{text-align:center;color:red}h2{text-align:center;color:blue}p{text-align:left;color:red}

Wszystkie znaki niewpływające na działanie kodu zostały usunięte. Tym samym rozmiar pliku został zmniejszony.

 

Skala robi różnicę

Zaoszczędzenie kilku kilobajtów nie wpłynie na szybkość wczytywania witryny. Jeśli natomiast mamy stronę, której kod CSS ma 2000 linii i kilka plików JS, to różnica będzie zadowalająca.

Minimalizacja, bez względu na skalę, powinna być wykonywana podczas wdrażania strony – nie zaszkodzi, a może tylko pomóc.

 

Czy mogę sam minimalizować pliki?

Oczywiście.

Istnieje wiele gotowych narzędzi, np.: https://www.minifier.org/. Dodatkowo edytory dla programistów często posiadają wbudowany mechanizm minifikacji, co pozwala przed wgraniem pliku na serwer odpowiednio go skompilować.

 

Jeśli chcesz się dowiedzieć ile zaoszczędzisz, minimalizując pliki swojej strony, napisz do mnie. Doradzę, pomogę, wdrożę.