Jak to działa
Miniyfikator usuwa /* komentarze */, zwija ciągi białych znaków do pojedynczej spacji i usuwa spacje wokół strukturalnych znaków interpunkcyjnych, takich jak { } : ; , > i upuszcza ostatni średnik przed nawiasem zamykającym. Nie zmienia nazw selektorów, nie łączy reguł ani nie zmienia kolejności kaskady.
- Konserwatywny minifikator: nie usuwa nieużywanych reguł ani nie zapisuje wartości na nowo. Zawsze później ponownie przetestuj arkusz stylów.
Dlaczego to ma znaczenie
Każdy kilobajt kodu CSS blokującego renderowanie opóźnia pierwsze malowanie. Minifikacja to najtańsza możliwa wygrana po usunięciu nieużywanych reguł, a narzędziu, które dotyka tylko prawdopodobnie zbędnych znaków, można zaufać na etapie kompilacji bez ponownego definiowania arkusza stylów.
Sprawdzony przykład
Reguła zapisana jako .card { kolor: czerwony; dopełnienie: 10px 20px; } staje się .card{color:red;padding:10px 20px}, oszczędzając kilkadziesiąt bajtów na regułę i znacznie więcej w prawdziwym arkuszu stylów.
Typowe błędy
- Usuwanie spacji wokół + i - wewnątrz funkcji calc(), czego wymaga specyfikacja.
- Minimalizowanie SCSS lub LESS zamiast skompilowanego CSS.
- Pominięcie kontroli wizualnej po zminimalizowaniu.
Praktyczne wskazówki
Zachowaj niezminifikowane źródło w kontroli wersji i zminimalizuj jako wynik kompilacji. Jeśli używasz właściwości niestandardowych z rezerwami, porównaj style obliczone w DevTools przed i po — kaskada zostaje zachowana, ale pojedyncza utracona spacja może zmienić sposób analizowania wartości.
Jak z niego korzystać
- Otwórz narzędzie. Wszystko działa w zakładce przeglądarki.
- Wklej lub wpisz wprowadzone dane, a następnie wybierz żądaną czynność.
- Sprawdź wynik i skopiuj go jednym kliknięciem.
Często zadawane pytania
Czy usuwa nieużywane reguły CSS?
Nie. Usuwa komentarze i zbędne białe znaki. Wykrywanie nieużywanych reguł wymaga audytu całej strony.
Dlaczego funkcja calc() przestała działać po zminimalizowaniu?
Spacje wokół + i - wewnątrz funkcji calc() są wymagane przez specyfikację CSS. Przetestuj ponownie arkusz stylów po zminimalizowaniu.
Czy może zminimalizować SCSS lub LESS?
Nie. Oczekuje zwykłego CSS; preprocesory mają własne etapy kompilacji.
Czy to narzędzie jest naprawdę darmowe?
Tak. Nie ma konta, nie ma paywalla i nie ma limitu użytkowania. Aplikacja Tools została ufundowana przez stojące za nią studio aumenso.
Czy wszystko, co wprowadzę, zostanie przesłane?
Nie. Narzędzie działa w zakładce przeglądarki; to, co wpiszesz, nigdy nie jest do nas wysyłane ani przechowywane.