Nén và Làm Đẹp CSS - thu gọn hoặc trải ra
Nén và làm đẹp CSS
Công cụ này làm gì
Hai việc trái ngược trên cùng một tệp kiểu. Nén bỏ đi thứ chỉ con người mới cần: chú thích và thụt lề. Làm đẹp trả chúng về, để một tệp bạn tiếp quản đọc được trở lại. Cả hai đều làm việc trên đúng đoạn văn bản bạn đưa vào, và không cái nào đụng tới ý nghĩa của CSS.
Cách dùng
- 1 Dán CSS vào - cả tệp hay chỉ một quy tắc đều được.
- 2 Bấm Nén để thu gọn, hoặc Làm đẹp để trải ra kèm thụt lề.
- 3 Xem số byte rồi sao chép kết quả.
Dấu cách trong bộ chọn không phải để trang trí
".a .b" chọn một .b nằm trong .a; ".a.b" chọn một phần tử mang cả hai lớp. Đó là hai bộ chọn khác nhau, và một trình nén coi dấu cách là thừa sẽ lặng lẽ tô nhầm phần tử. Ở đây dấu cách giữa hai phần của bộ chọn luôn được giữ; chỉ khoảng trắng quanh các toán tử như > và + mới bị bỏ.
calc() cần đúng những dấu cách đó
Trong "calc(100% - 10px)", các dấu cách quanh dấu trừ là bắt buộc theo cú pháp: thiếu chúng, trình duyệt đọc "-10px" thành một độ dài âm, biểu thức trở nên không hợp lệ và cả khai báo bị vứt bỏ. Chẳng có cảnh báo nào - bố cục đơn giản là sai. Công cụ này không bao giờ bỏ khoảng trắng bên trong dấu ngoặc.
Chú thích giấy phép được giữ lại
Chú thích mở đầu bằng /*! mang thông tin bản quyền hoặc giấy phép, và theo thông lệ mọi trình nén đều giữ lại. Xoá nó đi là gỡ bỏ phần ghi công mà một thư viện yêu cầu bạn phát hành kèm. Còn chú thích /* thường là viết cho bạn và đồng đội, nên chúng bị loại.
Nén CSS lời ít hơn gzip
Máy chủ vốn đã nén tệp kiểu khi gửi đi, và gzip rất giỏi với khoảng trắng lặp lại - nên nén thêm bên trên thường chỉ tiết kiệm vài phần trăm chứ không phải một nửa. Hãy làm vì chính tệp đó là thứ lên sản phẩm và bạn muốn nó nhỏ gọn, ổn định, chứ không phải vì trông đợi trang tải nhanh thấy rõ.