Developer Công cụ đã được cập nhật 1 tuần trước

HTML Minify

HTML Minify removes comments, indentation and needless whitespace from an HTML document, then returns a smaller file you can copy or download. Paste markup or fetch a public URL; processing happens on the server, so a copy of the code makes the round trip.

HTML Minify Remove Spaces Fast Output Clean Code

Sử dụng HTML Minify

Dán URL trực tiếp của tệp mã để tải nội dung của tệp đó vào trình soạn thảo.

Kết quả

Xong
Liên kết công cụ
Đã sao chép vào khay nhớ tạm.
Hãy giúp cải thiện công cụ này
118
Thời gian sử dụng
103
Tổng số người dùng
5+ năm
Đã phục vụ
Được rà soát lần cuối vào 2 tuần trước. Số liệu sử dụng được cập nhật trong các đợt kiểm toán định kỳ. (Bắt đầu báo cáo từ 21 Feb 2022)
Báo cáo sự không khớp

Đọc nội dung

Tìm hiểu cách thức hoạt động của công cụ này và khi nào nên sử dụng nó.

What this page is for

Every HTML file carries bytes the browser does not need: comments left by the template author, tabs and line breaks added for readability, repeated spaces between tags, and occasionally quotation marks around attributes that do not require them. Minification strips that overhead. The page accepts up to 200,000 characters per run, processes the document with a server-side HTML minifier, and returns the compact source in the output editor.

It is a source-to-source tool. You give it HTML and it gives back HTML. Nothing is rendered, screenshotted or executed during processing, and the result is not published anywhere by the tool.

What the minifier removes

  • Ordinary HTML comments, including long block comments used to mark sections.
  • Line breaks, tabs and indentation between elements.
  • Repeated spaces inside tags and between attributes.
  • Optional closing slashes on void elements where the parser allows them.
  • Some quotation marks around simple attribute values.
  • Whitespace inside inline style blocks where the CSS rules can be compacted safely.

The optional html, head and body tags are deliberately kept. Some minifiers remove them because browsers infer them, but that makes the file harder to read and can surprise a downstream tool that expects a complete document.

What it does not do

Minification is not compression. It does not gzip or brotli the response, and it does not touch images, fonts, video or linked JavaScript files. It does not bundle, tree-shake, cache-bust or rewrite URLs. It also does not validate your markup: an unclosed div stays unclosed, and a duplicated id stays duplicated.

If you need transfer compression, that belongs in the web server or CDN. If you need a smaller payload, combine minification with compression; the two solve different parts of the problem.

Where whitespace is not free

Most whitespace between block elements is meaningless, but whitespace inside inline content can be visible. A space between two links, a gap around a strong tag, or a line break inside a paragraph may render as a space. A minifier that collapses it can join words that were meant to be separate.

Protected regions need care too. Text inside pre and textarea is displayed literally, so changing its indentation changes what the user sees. Minifiers usually treat these elements specially, but you should still compare the rendered page, not just the source. The same applies to contenteditable regions and to templates that JavaScript reads as strings.

Inline CSS and JavaScript

When a style or script block sits inside the document, the minifier may compact its contents as part of the HTML pass. A short inline script that relies on a line comment ending at a newline can behave differently if that newline disappears. A template string containing HTML-like text can also be disturbed by an aggressive whitespace rule.

The safe routine is to minify, open the page in a browser, and check the console. If an inline script breaks, move it to an external file and minify that file separately with the JavaScript tool.

Fetching a page from a URL

The URL tab asks the server to download a public page and place its source in the editor. The fetch is capped at 200,000 characters. It retrieves the raw response, not the DOM after JavaScript runs, so a page that builds its content in the browser will look empty.

Login walls, bot protection, rate limits, self-signed certificates and URLs that return a file download can all fail. When the fetch fails, the error message from the server is shown above the URL field. Paste the source manually if you already have it.

Step by step

  1. Open the Manual Code tab and paste your HTML, or use the URL tab to load a public page.
  2. Leave the language on HTML and the mode on Minify. The page is pre-set for this task.
  3. Press Process Code. The output editor fills with the compact document.
  4. Compare the input and output character badges. A small reduction is normal for already-tidy markup.
  5. Copy the result or download it as minify-output.html.
  6. Open the downloaded file in a browser and check layout, inline scripts and forms before shipping.

How much smaller will it be

The saving depends entirely on how the file was written. A hand-formatted template full of comments and indentation can lose a noticeable share of its bytes. A file already generated by a framework may lose very little, because the framework never added the whitespace in the first place.

Do not treat a percentage as a target. Treat the output as correct only after the page renders and behaves the same as the original.

HTML email and older clients

Email HTML is a special case. Outlook and some webmail clients use rendering engines that are more sensitive to whitespace, conditional comments and table layout than a modern browser. Conditional comments are sometimes used to target Outlook, and removing them can change the email in that client.

If you minify an email template, keep the original, test in the clients you care about, and consider leaving comments in place. The page does not offer a keep-comments switch, so a separate build step may be safer for email.

Server-side templates

Blade, Twig, Django and similar templates contain tags that look like text to an HTML parser. Minifying a template before it is rendered can collapse whitespace around those tags, and in rare cases it can alter the template syntax itself. Minify the rendered HTML, not the template source, unless you have tested the specific template engine.

Checking the result

Diff the output against the input with a text comparison tool. Look for changed text nodes, missing comments you expected to keep, and attribute quoting changes. Then load the page and test the parts that usually break: inline handlers, forms, embedded widgets and anything inside pre.

Common errors

An empty output usually means the input was empty or the request exceeded the character cap. A server error with a parser message usually means the markup is malformed in a way the library cannot recover from; fix the nesting and try again. If only part of the page appears, check whether the source contains a frame, a shadow root or content generated at runtime, because none of those are part of the raw HTML.

Limits and privacy

One document per run, 200,000 characters maximum, HTML only in this page's default mode. The code is sent to the server for processing and returned in the response; it is not stored by the tool. Very large documents should be split or minified in a local build pipeline.

Frequently Asked Questions

Câu hỏi thường gặp

Các câu trả lời ngắn gọn cho những thắc mắc mà người dùng thường đặt ra trước khi tin tưởng vào kết quả.

It can affect inline scripts that depend on newlines or line comments. External scripts are untouched. Check the browser console after minifying.

Ordinary comments are removed. Conditional comments used for old email clients may also be removed, so do not use this page on an email template you have not tested.

No. Minification removes bytes from the source; gzip compresses the transfer. They can be used together and solve different problems.

It is safer to render the template first and minify the resulting HTML. Minifying the template source can disturb its tags and whitespace.

The source was probably already compact. Generated markup often has little indentation or commenting to remove.

The code is sent to the server for processing and returned in the response. The tool does not keep it after the request.

Yes. This minifier is configured to keep optional structural tags instead of stripping them.

Bình luận (0)

Dành cho các cuộc thảo luận của người dùng, các trường hợp ngoại lệ và các mẹo bổ sung.
Để lại bình luận
Bình luận của bạn sẽ được hiển thị công khai sau khi gửi.
Chưa có bình luận nào. Hãy là người đầu tiên bình luận!
Hãy cho chúng tôi biết!
Báo cáo sự cố liên quan đến công cụ này

Hãy mô tả vấn đề mà bạn gặp phải để chúng tôi có thể tìm hiểu và cải thiện công cụ này.

Điều gì hữu ích nhất
Vui lòng cung cấp thông tin về dữ liệu đầu vào, kết quả mong đợi, kết quả thực tế, trình duyệt/thiết bị và ảnh chụp màn hình (nếu có thể).
Nút chụp màn hình sẽ chụp lại trang web trong trình duyệt và đính kèm hình ảnh được tạo ra vào biểu mẫu này.
Ảnh chụp màn hình toàn trang
Được ghi lại trên trình duyệt của bạn bằng newisty.
Chưa có ảnh chụp màn hình nào được chụp.
Công cụ Báo cáo