Về công cụ này
Code có khi đến ở dạng đã nén từ một bundle, có khi lộn xộn từ một lần dán nhanh, và bạn cần điều ngược lại. Bộ định dạng này làm cả hai: làm đẹp để giãn và thụt lề HTML, CSS hay JavaScript cho dễ đọc, hoặc nén để rút gọn khi phát hành. JavaScript được nén bằng Terser và CSS bằng CSSO — chính những công cụ dày dạn dùng trong pipeline build thật.
Mọi thứ chạy cục bộ trong trình duyệt nên cả code độc quyền cũng ở lại máy bạn. Chọn ngôn ngữ, chọn làm đẹp hoặc nén, rồi copy kết quả.
Câu hỏi thường gặp
Sự khác biệt giữa làm đẹp (beautify) và rút gọn (minify) là gì?
Làm đẹp thêm thụt lề và xuống dòng để code dễ đọc; rút gọn loại bỏ khoảng trắng, chú thích và rút ngắn tên biến để file nhỏ nhất có thể khi đưa lên production. Dùng làm đẹp khi đang phát triển và rút gọn trước khi triển khai.
Rút gọn có làm thay đổi cách code hoạt động không?
Về nguyên tắc là không — công cụ rút gọn chỉ viết lại phần cú pháp đã được chứng minh là tương đương (đổi tên biến cục bộ, loại bỏ code chết, v.v.). Nếu kết quả rút gọn hoạt động khác đi, thường là do code gốc phụ thuộc vào những đặc điểm nhạy cảm với khoảng trắng, hoặc trình phân tích của công cụ rút gọn đã phát hiện một lỗi thật sự.
Code của tôi có bị tải lên đâu không?
Không. Cả định dạng và rút gọn đều chạy hoàn toàn trong trình duyệt của bạn, dùng các thư viện JavaScript (js-beautify, Terser, csso) được tải một lần và thực thi cục bộ. Code của bạn không bao giờ rời khỏi trang này.
Công cụ định dạng này hỗ trợ những ngôn ngữ nào?
JavaScript, CSS và HTML. Rút gọn JS dùng Terser, rút gọn CSS dùng csso, còn rút gọn HTML là một xử lý tự viết, nhẹ, vẫn giữ nguyên nội dung bên trong các thẻ <pre>, <script> và <style>.
Vì sao tôi nhận được lỗi cú pháp thay vì kết quả đã định dạng?
Công cụ định dạng phân tích code của bạn trước khi làm đẹp hoặc rút gọn, nên một lỗi cú pháp thật sự (dấu ngoặc không khớp, dấu phẩy thừa) sẽ được báo kèm số dòng, thay vì âm thầm tạo ra kết quả bị hỏng.