ย่อขนาดโค้ด (Minify)
ลดขนาดไฟล์โค้ดเพื่อให้เว็บโหลดเร็วขึ้น พร้อมบอกว่าประหยัดไปกี่เปอร์เซ็นต์
ผลลัพธ์จะแสดงที่นี่ย่อขนาดในเบราว์เซอร์ของคุณทั้งหมด โค้ดไม่ถูกส่งขึ้นเซิร์ฟเวอร์
เกี่ยวกับเครื่องมือนี้
เครื่องมือ ย่อขนาดโค้ด (Minify) ลดขนาดไฟล์ JavaScript, CSS, HTML, JSON, XML และ SQL เพื่อให้เว็บโหลดเร็วขึ้น พร้อมบอกชัดเจนว่าประหยัดพื้นที่ไปกี่ไบต์และกี่เปอร์เซ็นต์
สิ่งที่ทำให้เครื่องมือนี้ต่างจากตัวลบช่องว่างทั่วไป คือ JavaScript ถูกย่อด้วย terser จริง ๆ ซึ่งเป็นตัวเดียวกับที่ระบบ build ระดับโปรดักชันใช้ มันเปลี่ยนชื่อตัวแปรภายในให้สั้นลงและตัดโค้ดที่ไม่ถูกเรียกใช้ออก ผลลัพธ์จึงเล็กกว่าการลบช่องว่างเฉย ๆ อย่างมีนัยสำคัญ
สำหรับ HTML เครื่องมือนี้ตั้งใจ ระมัดระวังเป็นพิเศษ โดยไม่แตะเนื้อหาใน <pre>, <textarea>, <script> และ <style> เพราะช่องว่างในแท็กเหล่านั้นมีความหมาย การยุบมันทิ้งจะเปลี่ยนสิ่งที่ผู้ใช้เห็นหรือทำให้สคริปต์ทำงานผิด
ขนาดที่แสดงนับเป็น ไบต์แบบ UTF-8 ไม่ใช่จำนวนตัวอักษร เพราะอักษรไทยหนึ่งตัวกินพื้นที่ 3 ไบต์ ตัวเลขที่เห็นจึงตรงกับขนาดไฟล์จริงที่ผู้ใช้ต้องดาวน์โหลด ทั้งหมดทำงานในเบราว์เซอร์ โค้ดไม่ถูกส่งออก
วิธีใช้งาน
- 1วางโค้ดที่ต้องการย่อขนาดลงในช่องป้อนข้อมูล
- 2ระบบจะเดาภาษาให้อัตโนมัติ หรือเลือกเองจากรายการ
- 3ดูขนาดก่อน-หลังและเปอร์เซ็นต์ที่ประหยัดได้ทันที
- 4กดคัดลอกหรือดาวน์โหลดไฟล์ที่ย่อแล้วไปใช้งาน
คำถามที่พบบ่อย
- การย่อ JavaScript ทำอะไรบ้าง
- ไม่ได้ลบแค่ช่องว่าง แต่เปลี่ยนชื่อตัวแปรภายในให้สั้นลงและตัดโค้ดที่ไม่ถูกเรียกใช้ออก จึงลดขนาดได้มากกว่าการลบช่องว่างมาก แต่ควรทดสอบผลลัพธ์ก่อนนำขึ้นใช้งานจริง
- ย่อแล้วเว็บจะพังไหม
- ตัวย่อที่ใช้เป็นตัวเดียวกับที่เครื่องมือ build ระดับโปรดักชันใช้ จึงปลอดภัยกับโค้ดส่วนใหญ่ แต่โค้ดที่พึ่งพาชื่อฟังก์ชันหรือชื่อคลาสตอนทำงาน อาจได้รับผลกระทบ ควรทดสอบเสมอ
- ทำไมเนื้อหาใน pre และ script ถึงไม่ถูกย่อตอนเลือก HTML
- เพราะช่องว่างในแท็กเหล่านั้นมีความหมายจริง การยุบช่องว่างใน pre จะเปลี่ยนสิ่งที่ผู้ใช้เห็นบนหน้าเว็บ ส่วนใน script อาจทำให้โค้ดทำงานผิด เครื่องมือจึงเว้นไว้ตามเดิม
- ขนาดที่แสดงนับเป็นอะไร
- นับเป็นไบต์ตามการเข้ารหัส UTF-8 ไม่ใช่จำนวนตัวอักษร เพราะข้อความภาษาไทยหนึ่งตัวใช้พื้นที่ 3 ไบต์ การนับตัวอักษรจะให้ตัวเลขที่ไม่ตรงกับขนาดไฟล์จริง
- ควร minify ก่อนอัปโหลดขึ้นเว็บเสมอไหม
- ถ้าใช้เครื่องมือ build อยู่แล้ว มันมักย่อให้อัตโนมัติ เครื่องมือนี้เหมาะกับไฟล์เดี่ยว ๆ ที่อัปโหลดตรง เช่น สคริปต์เล็ก ๆ ในหน้าเว็บหรือธีมสำเร็จรูป