🍋
Menu
Web

Minification

Code Minification

Minification คือกระบวนการลดขนาดไฟล์โค้ด (JavaScript, CSS, HTML) โดยการลบอักขระที่ไม่จำเป็นออก เช่น ช่องว่าง บรรทัดใหม่ คอมเมนต์ และการย่อชื่อตัวแปร โดยไม่เปลี่ยนแปลงการทำงานของโค้ด

รายละเอียดทางเทคนิค

เครื่องมือ minification หลัก: Terser (JavaScript — tree shaking, dead code elimination, mangling), cssnano (CSS — shorthand merging, selector merging), html-minifier (HTML) ผลลัพธ์ทั่วไป: ลดขนาด JS 30-60%, CSS 20-40% การรวมกับ Gzip/Brotli compression ให้ผลลดขนาดรวม 70-90% Source maps (.map) ช่วยแมปโค้ดที่ minify กลับไปยังต้นฉบับเพื่อการดีบัก

ตัวอย่าง

```javascript
// Simple CSS minifier
function minifyCSS(css) {
  return css
    .replace(/\/\*[\s\S]*?\*\//g, '')  // remove comments
    .replace(/\s+/g, ' ')                // collapse whitespace
    .replace(/\s*([{};:,])\s*/g, '$1')   // remove around symbols
    .trim();
}
// 1024 bytes → 612 bytes (40% reduction)
```

เครื่องมือที่เกี่ยวข้อง

คำศัพท์ที่เกี่ยวข้อง