ลดขนาดเครื่องมือที่สามารถทำงานได้ผ่านเทอร์มินัล


35

ฉันกำลังมองหาเครื่องมือหรือวิธีการลดขนาด (คล้ายกับการบีบอัดรหัสของฉันและคำถามเกี่ยวกับ Stack) ทั้งหมดของรหัสในของฉัน.xml, .css, .htmlและ.jsไฟล์ผ่านขั้วของ Ubuntu ในที่สุดฉันก็จะทุบตีสคริปต์กระบวนการ แต่ในขณะนี้ฉันต้องการที่จะหาสิ่งที่จะทดสอบ มีเครื่องมือที่ฉันสามารถใช้ในการบีบอัดรูปแบบไฟล์เหล่านี้ทั้งหมดผ่านทางเทอร์มินัลหรือไม่?


2
คุณได้ลองสิ่งที่ชอบtar -czvf compressed.tar.gz *.xml *.css *.html *.php?
roadmr

1
ฉันกำลังมองหาที่จะบีบอัดรหัสของตัวเอง บางอย่างเช่น CSS Minify
DᴀʀᴛʜVᴀᴅᴇʀ

1
แล้วผมก็คิดว่าคุณไม่ได้ขอการบีบอัด โดยการบีบอัดไฟล์ปกติ (ไม่ใช่สื่อเช่นเพลง / วิดีโอ) เราส่วนใหญ่พิจารณาการบีบอัดแบบไม่สูญเสียข้อมูลเท่านั้น แต่คุณกำลังมองหาวิธีที่จะลดช่องว่าง (ซึ่งคุณทำข้อมูลนี้หาย) และเนื่องจากการลดขนาดเป็นการสูญเสียคุณจึงไม่สามารถขยายขนาดได้ (เพราะไม่สามารถย้อนกลับได้) สำหรับฉันสิ่งนี้ทำให้ "ไม่ชัดเจนในสิ่งที่คุณขอ"
gertvdijk

คำตอบ:


43

นี่ไม่ใช่ตัวเลือกที่ดีที่สุดแต่อาจเป็นวิธีที่ง่ายที่สุด YUI คิดว่าคอมเพรสเซอร์นี้เป็นตัวบีบอัดที่ดีที่สุดสำหรับ Javascript และ CSS ซึ่งมีการปรับปรุง 20-40% จากตัวแปลงอื่น ๆ

มันถูกแทนที่โดยโครงการใหม่เช่น Uglify.JS (ซึ่ง Grunt อาจจะแนะนำ) แต่ก็ยังเป็นเรื่องง่ายที่จะเริ่มต้นใช้งานใน Ubuntu

sudo apt-get install yui-compressor

แค่นั้นแหละ. ตอนนี้คุณสามารถเรียกใช้yui-compressor myfile.jsและมันจะทำมายากลของมันไม่ได้เป็นอย่างดีหรือสะดวกเช่นเดียวกับการติดตั้ง Node / Grunt / Uglify + YUI ที่ถูกต้อง


15
ไม่ใช่ทุกคนที่ใช้ js หรือ css กำลังใช้งาน node.js หรือทำโปรเจ็กต์ node.js มันเป็นอีกหนึ่งกรอบการเรียนรู้และกำหนดค่าหากคุณต้องการใช้เสียงฮึดฮัด ใช่เสี้ยงฮึดฮัดแสดงความเท่ห์ แต่วันนี้เรามีเพียงพอที่จะเรียนรู้ก่อนที่เราจะสามารถเริ่มเขียนโค้ดได้ ดังนั้นโหนด / เสียงฮึดฮัดไม่สะดวกเสมอ :) ฉันจะลองทำตามคำแนะนำของคุณกับ yui-compressor
Bill Rosmus

2
@BillR จัดเรียงของฉันเห็นด้วยกับความเชื่อมั่น แต่ในขณะที่ฉันไม่ได้มีโครงการ Node.js ใด ๆ ผมยังคงใช้สิ่งที่ชอบและ lessc uglify.js เพราะพวกเขาเป็นเครื่องมือที่ดีที่สุดสำหรับงาน ฉันไม่ได้ใช้ Grunt เพราะฉันแทนที่มันด้วยเครื่องมือของตัวเอง แต่สำหรับงานจริงฉันจะไม่เดินด้วยตัวเองเพียงเพื่อหลีกเลี่ยง Node หากคุณต้องการที่จะอยู่ในอุตสาหกรรมคุณจะต้องปฏิบัติตามแนวทางปฏิบัติที่ดีที่สุด
Oli

คุณกำลังตั้งสมมติฐานว่าการใช้โหนดเป็นแนวปฏิบัติที่เหมาะสมที่สุด บางทีในโลกของคุณซึ่งไม่ใช่โลกของทุกคน
Bill Rosmus

2
คุณมีฉันอยู่ห้าปีแล้ว แต่ฉันไม่รู้ว่าประเด็นของคุณคือ ... คุณยังใช้ HTML4 แบบสแตติกกับบิตของ "DHTML" และสคริปต์ CGI perl หรือไม่? ยังใช้ ASP อยู่ใช่ไหม หรือคุณเปลี่ยนสิ่งต่าง ๆ เป็นเทคโนโลยีที่ดีกว่าทำให้ตัวเองพร้อมใช้งาน เรามีสองจุดแยกกันที่เกิดขึ้นในเรื่องนี้; มันเริ่มโง่เล็กน้อย ฉันไม่สนใจว่าคุณไม่ชอบการฝึกอบรมซ้ำ แต่ฉันสนใจว่าคุณกำลังทำสิ่งนั้นด้วยการใช้more-cssแพคเกจ NPM เพื่อลดขนาด CSS ของคุณซึ่งเป็นการรบกวนมากกว่าการใช้ yui-compressor มันไม่ใช่ มันเป็นเพียงคำสั่งอื่นที่ทำสิ่งเดียวกันได้ดีกว่า
Oli

1
โปรดทราบว่าด้วยการติดตั้งนี้คุณจะติดตั้ง openjkd สิ่งที่บางคนไม่ต้องการในระบบ
จริงๆ

12

คุณสามารถย่อขนาด js ได้อย่างง่ายดายด้วยโหนดและuglify-jsจากบรรทัดคำสั่ง:

  • ติดตั้ง uglify-js ด้วย npm install uglify-js -g

  • เรียกใช้มัน uglifyjs app-test.js > app-test.min.js


สำหรับ CSS ฉันขอแนะนำให้ทำความสะอาด CSS (อาจจะเป็น minifier มีเสถียรภาพมากที่สุดใน CSS NPM)
การใช้งานตัวอย่างเช่น:

cleancss -o public-min.css public.css

เท่าที่ html เกี่ยวข้องมักจะ minification ไม่คุ้มค่ากับเวลาที่คุณลงทุนในการตั้งค่า แต่ฉันได้ลองhtml-minifierและเป็นเครื่องมือที่ยอดเยี่ยม

สิ่งที่คุณทำเพียงแค่แน่ใจว่าคุณ gzip สิ่งที่คุณให้บริการ


1
uglify สามารถติดตั้งโดยตรงกับsudo apt-get install node-uglify
Gery

โปรดทราบว่า uglify-js นั้นมีไว้สำหรับ Javascript เท่านั้นและไม่ใช่สำหรับ css หรือไฟล์อื่น ๆ
Jose Gómez

2
@Gery หากคุณต้องการติดตั้งuglifyพร้อมกับaptคุณยังต้องติดตั้งnode-legacyดังนั้นเรียกใช้sudo apt install node-uglify node-legacy
mxdsp

โปรดทราบว่าcleancssขณะนี้เครื่องมือ CLI อยู่ในclean-css-cliแพ็คเกจแล้ว
jbg

7

ใช้minify - ซึ่งแตกต่างจากคำแนะนำอื่น ๆ เครื่องมือนี้ลดขนาดไฟล์ได้มากขึ้น:

CSS     text/css
HTM     text/html
HTML    text/html
JS      text/javascript
JSON    application/json
SVG     image/svg+xml
XML     text/xml

มันทำงานได้แย่มากเมื่อใช้ javascript
Federico

2

ไม่มีเหตุผลที่จะลดขนาดไฟล์ php (ยกเว้นคุณมีพื้นที่ดิสก์ที่ จำกัด มากและต้องการใช้งานทุกบิต)

หากคุณสามารถเพิ่มเป้าหมายได้ (คุณต้องการทำอะไรให้สำเร็จและเพราะอะไร) บางคนอาจแสดงให้คุณเห็นวิธีที่ดีกว่า

ไฟล์ JS และ CSS ถูกทำให้เล็กลงในรันไทม์และแคชในเว็บโปรเจ็กต์ส่วนใหญ่ มีการลดขนาด ( https://github.com/mrclay/minify ) ซึ่งเป็น php "library" ซึ่งสามารถทำสิ่งนี้ได้อย่างแน่นอน (สามารถดำเนินการได้ด้วย php จากเทอร์มินัล)

แต่โปรดจำไว้ว่าไฟล์จาวาสคริปต์ขนาดใหญ่หนึ่งไฟล์ไม่จำเป็นต้องโหลดเร็วกว่าไฟล์ขนาดเล็ก 5 ไฟล์ หากคุณต้องการเหตุผลและแนวทางแก้ไขสำหรับข้อความนี้ให้ดูที่http://headjs.com/

อาจเป็นแหล่งที่มากับคุณ ...


1

ฉันจะแนะนำให้ใช้Grunt.js มันเป็นเครื่องมืออัตโนมัติที่มี minifiers ให้ใช้เป็นปลั๊กอินและสามารถเรียกใช้ในเทอร์มินัลของคุณผ่าน Node.js คุณไม่จำเป็นต้องลดขนาด PHP เนื่องจากโค้ดจะทำงานที่ฝั่งเซิร์ฟเวอร์และส่งออก HTML เท่านั้นไปยังไคลเอนต์

คุณสามารถค้นหาปลั๊กอินที่มีอยู่ได้ที่นี่


2
ระวังให้ดีว่าการเลือก Grunt หมายถึงช่วงการเรียนรู้
Rick-777

1

ฉันได้มีผลดีกับการปิดคอมไพเลอร์

Closure Compiler เป็นเครื่องมือสำหรับการดาวน์โหลด JavaScript และทำงานได้เร็วขึ้น แทนที่จะรวบรวมจากภาษาต้นฉบับเป็นรหัสเครื่องจะรวบรวมจาก JavaScript เป็น JavaScript ที่ดีกว่า มันแยกวิเคราะห์ JavaScript ของคุณวิเคราะห์ลบรหัสที่ตายแล้วและเขียนใหม่และลดสิ่งที่เหลืออยู่ นอกจากนี้ยังตรวจสอบไวยากรณ์การอ้างอิงตัวแปรและประเภทและเตือนเกี่ยวกับข้อผิดพลาดทั่วไปของ JavaScript

มันพัฒนาโดย Google และเขียนใน Java มันเป็นแพคเกจสำหรับระบบที่ใช้ Debian closure-compilerและติดตั้งได้ง่ายในระบบ Ubuntu เนื่องจากไม่ได้ใช้ GUI จึงต้องการdefault-jre-headlessแพ็คเกจที่มีน้ำหนักเบากว่า

มันช้ากว่าที่ YUI compressor แต่ขนาดไฟล์ที่ได้จะเล็กกว่าเล็กน้อย มันยังพิมพ์ข้อความเตือนที่เป็นประโยชน์คล้ายกับคอมไพเลอร์สำหรับภาษาการเขียนโปรแกรมอื่น ๆ

เอกสาร: เริ่มต้นใช้งาน

การใช้งาน:

closure-compiler --js input.js --js_output_file output.js

การปิดเป็นสิ่งที่ดีมากหากคุณเริ่มโครงการด้วยและขยายวัตถุของคุณเป็นไฟล์แยก ฯลฯ แต่สำหรับโครงการที่มีอยู่มันค่อนข้างแย่
Alexis Wilke

-1

อีกตัวเลือกหนึ่งคือใช้npxคำสั่งจาก Node.js npxรันคำสั่งของแพ็คเกจ Node.js โดยไม่ต้องติดตั้งอย่างชัดเจน

# Minify JS
npx -p uglify-js uglifyjs -o app.min.js app.js common.js

# Minify CSS
npx clean-css-cli -o style.min.css css/bootstrap.css style.css

# Minify HTML
npx html-minifier index-2.html -o index.html --remove-comments --collapse-whitespace

# XML
npx pretty-data-cli --type xml --minify input.xml > input.min.xml
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.