使用 Microsoft Ajax Minifier 壓縮 JavaScript 減少傳輸量與提升載入速度

為何需要 JS 壓縮

Web 2.0 時代，AJAX 大量使用導致頁面引用多個 JS 檔、體積龐大。首次載入時未快取，直接影響使用者體驗。壓縮可移除空白、註解、縮短變數名稱，大幅減小檔案。

三大優化組合拳

1. IIS 壓縮 (Gzip/Deflate)： 壓縮靜態/動態內容，流量可降至 30%。
2. Doloto 腳本延遲載入： 僅下載首屏必要代碼，其餘按需取得。
3. Ajax Minifier 靜態壓縮： 編譯階段產出最小化運行時版本，本文重點介紹。

Ajax Minifier 四層壓縮等級

建議： 直接使用 -hyper (Level 3) 獲得最佳平衡。

命令列模式實戰

安裝

下載 Microsoft Ajax Library Preview 6 並安裝，隨附 AjaxMin.exe。

基本指令

# Level 2 (Normal Crunching)
AjaxMin input.js -o output.min.js

# Level 3 (Hyper Crunching) + 分析輸出
AjaxMin -hyper -echo input.js -o output.min.js

實測結果

MSBuild 整合：建置自動壓縮

1. 安裝後，$(MSBuildExtensionsPath)\Microsoft\MicrosoftAjax\AjaxMin.tasks 可用。
2. 在專案檔 .csproj 的 </Project> 前加入：

<Import Project="$(MSBuildExtensionsPath)\Microsoft\MicrosoftAjax\AjaxMin.tasks" />
<Target Name="AfterBuild">
  <ItemGroup>
    <JS Include="**\*.js" Exclude="**\*.min.js;Scripts\*.js" />
  </ItemGroup>
  <AjaxMin SourceFiles="@(JS)" SourceExtensionPattern="\.js$" TargetExtension=".min.js" />
</Target>

3. 重新載入專案（選「正常載入」），建置專案。
4. 輸出目錄將出現 *.min.js，不自動加入專案（設計時用原檔，執行時用 min 版）。

結語

Ajax Minifier 簡單易用、整合 MSBuild 零侵入，配合 IIS 壓縮與 Doloto，能全方位優化前端效能。強烈建議納入專案建置流程。