Google Closure Compiler壓縮器將Javascript最佳化廋身

梅問題-Google Closure Compiler壓縮器將Javascript最佳化廋身
  當今天把網頁製作好上線時,都會將網頁中的css、js壓縮過,再放到正式的環境中,而以javascript來說,最常使用的壓縮器,就是Yahoo所推出的YUI,除了Yahoo YUI壓縮器外,Google也有一套Javascript的壓縮器Closure Compiler,除了可將Javascript進行壓縮外,還會進行優化與檢測程式中,是否有出錯或問題,並協助改善程式碼,減少bug的發生,而Closure Tools除了有線上版外,也可安裝在自己的主機中,現在就一塊來看看,Google這個Closure Tools的壓縮器。

Closure Compiler Service UI
網站名稱:Closure Compiler Service UI
連結網址:http://closure-compiler.appspot.com/

Step1
進入頁面後,有二種方式可將javascript載入,上方是透過線上方式,下方是直接將javascript貼入。
梅問題-Google Closure Compiler壓縮器將Javascript最佳化廋身
Step2
輸入好後,再按Complier鈕。
梅問題-Google Closure Compiler壓縮器將Javascript最佳化廋身
Step3
壓縮後的碼會在右邊,同時在上方可看到,整個少了一半。
梅問題-Google Closure Compiler壓縮器將Javascript最佳化廋身
Step4
並且可點上方的頁籤,看是否有錯誤或警告,沒問題的話,就可按上方的default.js,將壓縮好的檔案下載回來。
梅問題-Google Closure Compiler壓縮器將Javascript最佳化廋身
Step5
當壓縮後,從本來的8KB立馬變成4KB啦!足足小一倍,同時也能正常的運作。
梅問題-Google Closure Compiler壓縮器將Javascript最佳化廋身

相關文章

「Retina.js」網頁圖片支援Retina螢幕,並自動切換高解影像

「Retina.js」網頁圖片支援Retina螢幕,並自動切換高解影像

jQuery取得各裝置視窗實際顯示的寬度、高度

jQuery取得各裝置視窗實際顯示的寬度、高度

「Lazy Load CSS」非同步載入CSS,當網頁使用雲端字型更順暢

「Lazy Load CSS」非同步載入CSS,當網頁使用雲端字型更順暢

jQeury外掛「scroll-scope」鎖定DIV區塊滾動範圍

jQeury外掛「scroll-scope」鎖定DIV區塊滾動範圍

jQuery教學-RWD自適應導覽列多層級下拉選單

jQuery教學-RWD自適應導覽列多層級下拉選單





回應本篇 »

(姓名)*必填
(信箱)*必填
(網站)

※PS: 因梅干時間有限,教學網中所分享的主題繁多(所遇狀況也很多),可能無法一一回答各位,不便之處還請見諒。
※PS: 本教學網不提供「破解檔」、「註冊機」或「註冊碼」等資訊,請勿利用留言索取檔案。