GiftOfSpeed 線上網站速度檢測與合併壓縮js&css檔

梅問題-GiftOfSpeed線上網站測速與js/css檔案優化
  現在製作網頁的技術愈來愈多元,同時CSS不斷的進化,因此每當將網頁設計完畢後,要上線時都會將js、css檔案加以壓縮,而一旦有一堆js或css就得逐一逐一的壓縮,除了麻煩外,再來就是也會增加IO存取的次數,所以當有專案的朋友,就會將所有的js或css,合併與壓縮成一隻,不但效能更好讀取快,若沒用專案系統的朋友,要怎麼將多隻js、css整併成一隻呢?現在不妨可透過GiftOfSpeed這個網站,除了提供網站測速外,線上還提供網站優化的工具,因此身為網設的你也趕快看看囉!

GiftOfSpeed:
網站名稱:GiftOfSpeed
網站連結:http://www.giftofspeed.com/

Step1
進入官網後,輸入網址後,可針對網站來進行載入速度測試。
梅問題-GiftOfSpeed線上網站測速與js/css檔案優化
Step2
接著點上方的TOOLS,接著下方就會出現各式各樣的網站優化工具,而裡面有一個工具,梅干個人覺得很棒的是,可以將多個js檔合併並壓縮成一隻,這時點左下的Javascript Compressor
梅問題-GiftOfSpeed線上網站測速與js/css檔案優化
Step3
選擇檔案鈕,再將要合併的js給加進來。
梅問題-GiftOfSpeed線上網站測速與js/css檔案優化
Step4
都選擇完畢後,再點Compress鈕。
梅問題-GiftOfSpeed線上網站測速與js/css檔案優化
Step5
這時就會將多個js合併起來並壓縮,前後共減少了39%。
梅問題-GiftOfSpeed線上網站測速與js/css檔案優化
Step6
這時再用瀏覽器來檢測一下,當合併起來後,網站的開啟速度比先前更快了一些。
梅問題-GiftOfSpeed線上網站測速與js/css檔案優化

相關文章

免寫程式!HTML5新屬性自動檢核表單與欄位格式是否填寫正確

免寫程式!HTML5新屬性自動檢核表單與欄位格式是否填寫正確

Bootstrap教學-Bootstrap導覽列選單加入網格讓選單圖文並茂

Bootstrap教學-Bootstrap導覽列選單加入網格讓選單圖文並茂

將Google地圖嵌入網頁,滾動滑鼠第三鍵鎖定不縮放

將Google地圖嵌入網頁,滾動滑鼠第三鍵鎖定不縮放

CSS教學-CSS選擇器套用樣式的優先權順序

CSS教學-CSS選擇器套用樣式的優先權順序

Bootstrap教學-NavBar導覽列選單在手機版下,選單由側邊開啟

Bootstrap教學-NavBar導覽列選單在手機版下,選單由側邊開啟





回應本篇 »

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

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

共 1 梅留言

  • 第1梅
    ming 說道:

    真是太棒了! 感謝提供這麼棒的工具

    回應:
    呵!!不用客氣,也趕快把專案中的檔案合併一下吧

近期講座

近期講座

更多講座