Spis treści
Czytasz teraz:
Minifikacja kodu CSS i JS – co to jest?
Zamknij
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ą
A tak wygląda przykładowy kod strony po minifikacji
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.