Google Closure Tools

Google Closure Tools เป็นเครื่องมือสำหรับช่วยในการ optimize JavaScript ให้สามารถ download และ run ได้รวดเร็วขึ้น เราสามารถใช้งานผ่านทางหน้า Web Page ที่ Google เตรียมไว้ให้ หรือจะ download command line tool ลงมาใช้งานที่เครื่องของเราก็ได้ครับ สำหรับวันนี้อยากจะมาแนะนำการใช้งานผ่าน Online Tool กันก่อน วิธีการใช้งานก็ไม่ยากครับ ก็เพียงแค่เข้าไปที่ http://closure-compiler.appspot.com/home แล้วเราก็จะเจอกับหน้าจอการใช้งานที่แบ่งออกเป็น 2 ฝั่ง ฝั่งซ้ายจะเป็น JavaScript ของเราที่ยังไม่ได้ทำการ optimized ซึ่งในส่วนนี้ เราสามารถกำหนด option ต่างก่อนการ optimize ได้ เมื่อเสร็จเรียบร้อย ก็กดปุ่ม compile ซึ่ง ผลลัพธ์จากการ compile ก็จะไปแสดงที่หน้าจอฝั่งขวา ซึ่งจะมีขนาดก่อน optimize กับหลัง optimize ให้ดูเปรียบเทียบกัน นอกจากนั้น ถ้าหาก code ของเรามีปัญหา ก็จะแสดงให้เราเห็นใน Warning กับ Error Message อีกด้วย

Paste JavaScript ของเราเข้าไปที่หน้าจอด้านซ้ายมือ

เมื่อกดปุ่ม Compile ผลลัพธ์ก็จะมาแสดงให้เห็นที่หน้าจอฝั่งขวามือ

แหล่งที่มา: https://developers.google.com/closure/compiler/

Free CSS Compressor and CSS Compression Tool

หน้าจอแสดงการใช้งาน CSS Compressor

การลดขนาด file ก่อน deploy ขึ้น server นั้น เป็นสิ่งที่ควรทำ เพราะนอกจากจะช่วยประหยัดค่า Bandwidth แล้ว ยังช่วยให้ Web Page สามารถ load ได้เร็วขึ้นอีกด้วย กระบวนการการลดขนาดของ File เรามักเรียกกันว่า compress หรือบางครั้งเราเรียกว่า minify สำหรับวันนี้ อยากจะมาแนะนำเครื่องมือสำหรับช่วยลดขนาดของ CSS ซึ่งสามารถใช้งานผ่านหน้า Web ได้โดยตรง มี profile ของการ compress หลายแบบให้เลือก โดยเราสารถเลือกแบบ compress เต็มที่ หรือจะให้ balance ระหว่าง compression rate กับ readability ก็สามารถทำได้ สำหรับ Options อื่นๆที่มีให้ใช้งาน ก็อย่างเช่น merge selectors with the same properties, compress color สำหรับใครที่สนใจก็ลองเข้าไปใช้งานได้ที่นี่ครับ http://www.minifycss.com/css-compressor/

แหล่งที่มา: http://www.minifycss.com/css-compressor/