พัฒนาเว็บ
JS Minify / Beautify
บีบอัด JavaScript สำหรับ production หรือจัดรูปแบบโค้ดที่บีบอัดแล้วให้อ่านง่าย
ใหญ่เกินไปสำหรับการแสดงตัวอย่าง
ใหญ่เกินไปสำหรับการแสดงตัวอย่าง
Minifying JavaScript strips whitespace, comments, and line breaks, and often shortens local variable names — none of that changes how the code runs, but it noticeably shrinks the file for a faster load.
How to use it
- Minify: paste JavaScript code and the tool compresses it while keeping its behavior identical.
- Beautify: paste minified code with no indentation to get a readable version for analysis or debugging.
- Beautifying is especially useful for picking apart a third-party minified script when no source map is available.
Common uses
- Quickly minifying a small script without setting up a full build tool.
- Beautifying minified code from a third-party library to understand what it does.
- Inspecting a suspicious or unclear minified script before trusting it to run.
Things to keep in mind
Minification isn't obfuscation — variables get renamed to shrink size, not to hide logic; serious obfuscation needs dedicated specialized tools.
Minified code in production without a source map is hard to debug — the line numbers in error messages won't match the original file.
บทความเกี่ยวกับเครื่องมือนี้: การมินิฟาย JavaScript: ความแตกต่างระหว่างการมินิฟายกับการอ๊อบฟัสเคต
คำถามที่พบบ่อย
ตัวย่อขนาดใช้เครื่องมืออะไรอยู่เบื้องหลัง?
ใช้ terser ซึ่งเป็นตัวย่อขนาดและบีบอัด JavaScript ที่ใช้กันอย่างแพร่หลายและเข้าใจไวยากรณ์สมัยใหม่ด้วย
ทำไม JavaScript ที่ย่อขนาดแล้วถึงดีบักยากกว่า?
Terser ย่อชื่อตัวแปรและฟังก์ชัน และลบช่องว่างกับคอมเมนต์ออก และเนื่องจากเครื่องมือนี้ไม่สร้าง source map เครื่องมือนักพัฒนาของเบราว์เซอร์จึงไม่สามารถแมปโค้ดที่ย่อแล้วกลับไปยังบรรทัดต้นฉบับที่อ่านง่ายได้
การย่อขนาดจะทำให้โค้ดของฉันพังหรือไม่?
สำหรับ JavaScript ที่ถูกต้องตามไวยากรณ์ การย่อขนาดจะรักษาพฤติกรรมไว้ หากมีข้อผิดพลาดทางไวยากรณ์ เครื่องมือจะรายงานบรรทัดและคอลัมน์เพื่อให้คุณแก้ไขก่อนย่อขนาด — ทุกอย่างทำงานในเครื่องโดยไม่อัปโหลดโค้ดของคุณ
Tree shaking ต่างจากการมินิฟายอย่างไร?
Tree shaking ลบโค้ดที่ไม่ได้ถูกใช้งานที่ไหนเลยออกจากบันเดิล โดยวิเคราะห์กราฟความสัมพันธ์ของโมดูลระหว่างการบิลด์ ในขณะที่การมินิฟายเพียงย่อรูปแบบข้อความของโค้ดที่มีอยู่แล้วเท่านั้น มันไม่ลบฟังก์ชันใด ๆ ที่ถูกเรียกใช้งานจริง
ปลอดภัยหรือไม่ที่จะใช้ JavaScript ที่มินิฟายแล้วใน production โดยไม่ทดสอบเพิ่มเติม?
ปลอดภัย การมินิฟายเป็นการแปลงเชิงไวยากรณ์ล้วน ๆ ที่รักษาพฤติกรรมของโปรแกรมให้เหมือนเดิมทุกประการ ความแตกต่างของพฤติกรรมใด ๆ หลังการมินิฟายบ่งชี้ถึงบั๊กในตัวมินิฟายเอง ไม่ใช่การเปลี่ยนแปลงตรรกะโดยตั้งใจ