RevealTheme logo

Minifikator CSS

Usuń komentarze, białe znaki i zbędne znaki z CSS, aby zmniejszyć rozmiar pliku.

Jak korzystać z tego narzędzia

  1. 1

    Paste your CSS — a single rule, a component stylesheet, or an entire file.

  2. 2

    The minified result and the byte savings appear instantly below the input.

  3. 3

    Copy the minified output, or compare the before/after byte count to see the reduction.

Czym jest minifikator CSS?

Zminifikowany CSS ładuje się szybciej: każdy bajt ma znaczenie na krytycznej ścieżce renderowania. Minifikacja usuwa komentarze, zwija białe znaki i upraszcza składnię (na przykład 'color: #ffffff' staje się 'color:#fff'). W przypadku witryn produkcyjnych użyj minifikatora działającego na etapie kompilacji, takiego jak cssnano; to narzędzie służy do doraźnych fragmentów CSS.

Typowe przypadki użycia

  • Shrink a critical-CSS snippet you're inlining into the <head> to remove a render-blocking request.

  • Compress CSS for an HTML email or newsletter, where every kilobyte counts and there's no build pipeline.

  • Paste CSS into a CMS or page-builder field that doesn't minify automatically (WordPress 'Additional CSS', Shopify theme settings).

  • Check how much weight a third-party stylesheet adds before deciding whether to self-host it.

  • Clean up CSS copied from DevTools, which arrives with computed-style comments and inconsistent spacing.

  • Produce a one-line version of a rule to paste into a chat, ticket, or code-review comment.

Najczęściej zadawane pytania

Czy minifikacja zepsuje mój CSS?
Nie: minifikacja zachowuje semantykę. Jeśli Twój CSS się zepsuje, oznacza to, że źródło zawierało błędy składni, które przeglądarka tolerowała, a minifikator nie.
Jakiej redukcji rozmiaru mogę się spodziewać?
Od 20% do 40% w typowym, ręcznie pisanym CSS. Mniej w już skompresowanym CSS z frameworków.

Powiązane narzędzia