Chào các bạn đã đến với design 5s chúng tôi, bài viết này xin xin hướng dẫn các bạn cách cở bản để nén html,css,js của trang web bạn. Vậy nén code để làm gì và có tốt không chúng có những ưu nhược điểm như thế nào? thì mình mời các bạn cùng đọc ngay bài viết sau đây luôn nhé.
Hình Minh Họa |
1/ Giúp Website Bạn Tải Trang Nhanh Hơn Đáng Kể: Việc nén lại code sẽ giúp code gọn lại bỏ bớt xuống dòng từ đó giúp trình duyệt đọc code nhanh hơn sẽ giảm đáng kể việc tải trang, từ đó sẽ giúp web bạn tải mượt hơn giảm sự lag giật không đáng có. Các bạn có thể thấy những bạn hay để link ngoài trỏ js css về website mình mà không đặt trong cấu trúc html của website họ thường nén code lại để đạt tối đa cho việc tải trang ở tài nguyên bên thứ 3.
2/ Làm Gọn Source Code Website Bạn: Việc nén code sẽ giúp cấu trúc html và các thành phần như js, css trở nên đẹp và gọn hơn bao giờ hết khi view-source sẽ thấy được điều dó.
3/ Làm Gọn Code Sẽ Khó Chỉnh Sửa Hơn: Tuy nói đi và cũng phải nói lại việc nén code cũng sẽ gặp khá nhiều khó khăn trong việc chỉnh sửa lại sau khi nén code, nếu bạn rành code thì vẫn có thể chỉnh sửa lại code trong khi đang nén luôn vẫn được nếu bạn là người không chuyên code thì phải tiến hành thêm 1 bước nữa là giải nén code ra khi mỗi lần chỉnh sửa bạn nhé.
HƯỚNG DẪN NÉN HTML, CSS, JS
Để nén code html thì đầu tiên các bạn copy đoạn html cần nén (nhớ copy đầy đủ cấu trúc thẻ đóng html nhé, nếu html có kèm css và js bạn phải loại chúng riêng ra).
Để nén css thì bạn copy từng nhóm css ra nhớ bỏ 2 thẻ <style></style> khi nén bạn nhé.
Để nén js thì bạn bỏ cặp thẻ <script></script> khi đưa vào tiện ích nén code phần nén code js thì tiện ích khác với nén css và html bạn hãy dùng tiện ích này js minify
Bước 1: Truy cập tiện ích nén code html, css sau html minifier để tiến hành thực hiện việc nén code html và css và js thì dùng tiện ích js minify
Bước 2: Bỏ html vào tiện ích và nén lại, lưu ý nén từng nhóm html là tốt nhất đừng ham nén cùng lúc cả trang web có thể khi hoạt động web sẽ có vài lỗi đấy nhé.
Bước 3: Sau khi nén xong bạn tiến hành thay lại đoạn code mà bạn vừa lấy ra nén và lưu theme lại chạy web xem thử và thưởng thức.
LỜI KẾT
Như vậy bài viết này mình đã hướng dẫn cũng như chia sẻ các bạn cách nén code và công cụ nén code tốt nhất mà do bên mình phát triển và vận hành nếu thấy hay đừng quên share ủng hộ mình nhé.