Ten tekst przeczytasz w 1 minutę

Brak komentarzy

Minifikacja kodu CSS i JS – co to jest?

Minifikacja kodu CSS i JS – co to jest? - zdjęcie nr 1

minifikacja kodu

Minifikacja kodu – co to jest?

Minifikacja, to proces, który ma na celu zmniejszenie kodu źródłowego poprzez skasowanie niepotrzebnych znaków.

Po wykonaniu minifikacji, usuwane są z kodu wszystkie:

  • zbędne białe znaki (spacje, entery itp.),
  • komentarze (bloki tekstu objęte /* */ oraz treści znajdujące się w pojedynczych wierszach poprzedzone //),
  • czasami ulegają skróceniu nazwy zmiennych / funkcji.

W wyniku minifikacji udaje się zmniejszyć rozmiar kodu o kilkadziesiąt procent. Zminifikowany kod jest wykonywany w ten sam sposób, jak przed minifikacją, ale z powodu mniejszego rozmiaru strona jest szybciej pobierana i interpretator przeglądarki operuje na mniejszych ilościach danych. W wyniku zabiegu minifikacji, strony szybciej się pobierają i renderują użytkownikom. Proces minifikacji dotyczy przeważnie kodu JS (skryptów JavaScript) i CSS (arkuszy styli) znajdujących się w osobnych plikach.

Ale uwaga!

Wykonanie minifikacji powoduje zmianę kodu źródłowego i może utrudniać jego późniejsze modyfikacje. Zawsze należy skopiować plik przed dokonaniem minifikacji. Nanoszenie poprawek należy wykonywać na skopiowanych plikach, po naniesieniu poprawek należy ponownie zminifikować kod. Najlepszą praktyką jest trzymanie źródłowych plików w odpowiednich katalogach na serwerze obok zminifikowanych plików. W przypadku samodzielnej minifikacji można korzystać z narzędzi online, które działają szybko i są bezpłatne.

Przykładowy wygląd kodu strony przed minifikacją

Minifikacja kodu CSS i JS – co to jest? - zdjęcie nr 4
Minifikacja kodu CSS i JS – co to jest? - zdjęcie nr 5
Minifikacja kodu CSS i JS – co to jest? - zdjęcie nr 6
Minifikacja kodu CSS i JS – co to jest? - zdjęcie nr 7
Minifikacja kodu CSS i JS – co to jest? - zdjęcie nr 8

A tak wygląda przykładowy kod strony po minifikacji

Minifikacja kodu CSS i JS – co to jest? - zdjęcie nr 9

Prawda, że prościej? 🙂 Dla robota Google na pewno! Szybkość działania strony wpływa na pozycjonowanie stron internetowych w wyszukiwarkach – odpowiednia minifikacja kodu jest więc działaniem poprawiającym SEO danego serwisu.

Bądź pierwszym który napisze komentarz.

Wymagany, ale nie będzie opublikowany