Trình nén & Làm đẹp HTML

Nén HTML cho sản phẩm thực tế hoặc làm đẹp để dễ đọc (Xử lý 100% phía khách hàng)

🔒 100% Xử lý cục bộDữ liệu bạn nhập được xử lý hoàn toàn trong trình duyệt. Không có dữ liệu nào được tải lên máy chủ.

Kích thước thụt lề:

Giữ chú thích

HTML đầu vào

Kích thước đầu vào: 0 bytes

HTML đầu ra

Kích thước đầu ra: 0 bytes

Tài liệu Công cụ Nén và Định dạng HTML

Công cụ này là gì?

Nén HTML loại bỏ các ký tự không ảnh hưởng đến rendering: khoảng trắng giữa thẻ, comments HTML (), thẻ đóng tùy chọn (HTML5: </li>/<td>/<p>), giá trị thuộc tính boolean (disabled=“disabled” → disabled). <pre>/<textarea>/<script>/<style> được bảo toàn.

Tính năng chính

Xóa khoảng trắng và comments: thu gọn khoảng trắng giữa thẻ khối; xóa ; giữ nguyên <pre>/<code>/<textarea>.
Xóa thẻ đóng tùy chọn (HTML5): bỏ qua </li>/<p>/<tr>/<td> nơi HTML5 cho phép mà không thay đổi DOM.
Nén thuộc tính boolean: selected=“selected” → selected theo HTML5.
Công cụ định dạng có thể cấu hình: thụt lề 2/4 khoảng trắng hoặc tab, phân biệt khối/nội tuyến, bảo toàn <pre>/<code>.
Chuẩn hóa dấu ngoặc kép thuộc tính: xóa khi giá trị không có khoảng trắng hay ký tự đặc biệt.
Hiển thị thay đổi kích thước: byte gốc, byte nén và tỷ lệ nén.

Trường hợp sử dụng phổ biến

Tối ưu SSR: nén HTML đầu ra từ PHP/Django/Rails trước khi gửi browser; giảm 10-30%.
Hậu xử lý trình tạo site tĩnh: Jekyll/Hugo/Eleventy/Next.js; kết hợp Brotli 85-95% tổng giảm.
Debug HTML đã nén: định dạng view-source hoặc API response để kiểm tra cấu trúc.
Kiểm tra template: định dạng lại HTML từ CMS để xem xét ARIA và cấu trúc tiêu đề.

Các điều chỉnh làm đẹp

Tái tạo thụt lề từ HTML phẳng. Xử lý phân biệt khối/nội tuyến, bảo toàn nguyên văn <pre>/<code>.

Thụt lề có thể cấu hình: 2/4 khoảng trắng hoặc tab
Phần tử khối bắt đầu trên dòng mới; nội tuyến trên cùng dòng
Bảo toàn nguyên văn nội dung <pre>/<code>/<textarea>
Chuẩn hóa dấu ngoặc kép đôi trên tất cả thuộc tính

Các điều chỉnh nén

Các lượt có thể kiểm soát: thu gọn khoảng trắng, xóa comments, thẻ tùy chọn, boolean, dấu ngoặc kép.

Khoảng trắng giữa thẻ thu gọn, xóa tại các ranh giới khối
Comments HTML xóa (giữ IE conditional tùy chọn)
Thẻ đóng HTML5 tùy chọn bỏ qua khi spec-safe
Thuộc tính boolean dạng đơn
Dấu ngoặc kép thuộc tính xóa khi không có ký tự đặc biệt

Tác động dự kiến đến kích thước tệp

Giảm 10-30% cho nội dung chuẩn. 20-40% cho markup dày. Brotli thêm: 85-95% giảm tổng.

Làm đẹp

Dễ đọc

Nén

Nhỏ hơn 10-40%

Công Cụ Liên Quan

Nén & Làm Đẹp CSS

Nén hoặc làm đẹp mã CSS, loại bỏ khoảng trắng và chú thích để tối ưu kích thước tệp, hoặc định dạng mã để dễ đọc

Nén & Làm Đẹp JavaScript

Nén hoặc làm đẹp mã JavaScript, loại bỏ khoảng trắng và chú thích để tối ưu kích thước tệp, hoặc định dạng mã để dễ đọc

Bộ Mã Hóa/Giải Mã HTML

Chuyển đổi ký tự đặc biệt thành thực thể HTML với định dạng tên, thập phân và thập lục phân để ngăn chặn tấn công XSS

Trình Định Dạng XML

Định dạng và xác thực dữ liệu XML với làm nổi bật cú pháp

Trình Định Dạng JSON

Định dạng và xác thực dữ liệu JSON để cải thiện khả năng đọc và gỡ lỗi

Kiểm Tra Văn Bản Khác Biệt

So sánh sự khác biệt giữa hai văn bản hoặc tệp với chế độ xem nổi bật song song