Minifikuje CSS, usuwając komentarze i zbędne odstępy oraz scalając powtórzone reguły — albo odwrotnie, formatuje go z powrotem po jednej deklaracji w wierszu. Oba kierunki korzystają z prawdziwych parserów (csso i js-beautify), więc tekst wyglądający jak komentarz wewnątrz łańcucha content:, odstępy w calc() i identyfikatory data: pozostają nienaruszone.
Minifikacja a formatowanie
Minifikacja usuwa komentarze i zbędne białe znaki oraz bezpiecznie scala zduplikowane reguły, tworząc możliwie najmniejszy CSS — przydatne przy zmniejszaniu arkusza stylów przed wdrożeniem. Formatowanie robi coś przeciwnego: ponownie dodaje wcięcia, z jedną deklaracją w wierszu, dzięki czemu zminifikowany lub nieuporządkowany plik znów staje się czytelny. Obie opcje korzystają z prawdziwych parserów CSS (csso i js-beautify), więc trudne treści, takie jak tekst wyglądający jak komentarz wewnątrz łańcucha content:, spacje w calc() czy identyfikatory URI data:, są zachowywane, a nie psute przez naiwne zamienianie tekstu.
Jak korzystać z Minifikatora CSS
- Wklej — wklej CSS, który chcesz zminifikować lub sformatować, do górnego pola.
- Wybierz wcięcie — wybierz 2 spacje, 4 spacje lub tabulator (dotyczy tylko wyniku formatowania i nie wpływa na minifikację).
- Uruchom — naciśnij przycisk „Minifikuj” lub „Formatuj”, a przetwarzanie odbędzie się natychmiast w Twojej przeglądarce.
- Kopiuj — sprawdź odczyt zmniejszonego rozmiaru i przyciskiem „Kopiuj” umieść wynik w schowku.
Czy minifikacja może zmienić style?
Nie. To narzędzie nie zamienia tekstu na ślepo, lecz za pomocą prawdziwego parsera CSS (csso) rozumie arkusz stylów jako drzewo składniowe, a następnie bezpiecznie go optymalizuje. Dzięki temu tekst wyglądający jak komentarz wewnątrz content:, istotne spacje w calc(), identyfikatory URI data: czy prefiksy producentów są zachowywane w niezmienionej postaci, więc wynik renderowania pozostaje taki sam.
O ile zmniejszy się rozmiar?
Zależy to od materiału wyjściowego, ale czytelny dla człowieka CSS z licznymi komentarzami i wcięciami zwykle kurczy się o mniej więcej 30–60%. W przypadku pliku już zminifikowanego różnica jest niewielka. Po konwersji odczyt rozmiaru od razu pokazuje, ile bajtów i jaki procent udało się zaoszczędzić względem oryginału. Gdy do transmisji na serwer dojdzie jeszcze kompresja gzip lub brotli, faktyczna ilość przesyłanych danych zmniejsza się jeszcze bardziej.
Kiedy używać formatowania (beautify)?
Formatowanie przydaje się, gdy musisz odczytać lub zmodyfikować CSS skompresowany do jednej linii albo plik z chaotycznymi wcięciami. Rozkłada każdą deklarację do osobnego wiersza ze spójnym wcięciem, co ułatwia debugowanie wdrożonego arkusza stylów czy zrozumienie cudzego kodu. Przy ponownym wdrożeniu wystarczy wrócić do wersji zminifikowanej przyciskiem „Minifikuj”.
Czy mój CSS jest gdzieś przesyłany?
Nie. Zarówno minifikator, jak i formater działają w całości w Twojej przeglądarce, korzystając z samodzielnie hostowanych bibliotek — Twój CSS nigdy nie jest wysyłany ani przechowywany na żadnym serwerze. Po konwersji odczyt rozmiaru pokazuje, ile bajtów zaoszczędziła minifikacja, a przycisk Kopiuj umieszcza wynik bezpośrednio w schowku.