構建高性能 ASP.NET 站點之二：優化 HTTP 請求（前端）

頁面載入時間分佈

HTML 骨架僅佔 10%-20% 載入時間，大多數時間花在下載圖片、腳本、Flash 等靜態資源。

範例頁面分析

<!DOCTYPE html ...>
<html>
<head>
  <title>小洋,燕洋天</title>
  <script type="text/javascript" src="../demo.js"></script>
</head>
<body>
  <div>
    <img src="../images/1.gif" /> ... <img src="https://yanyangtian.cnblogs.com/image/8.gif" />
  </div>
</body></html>

瀏覽器先下載 HTML，解析後發現 10 張圖片與 1 支 JS，依序發起請求。若資源來自不同域名（如 yanyangtian.cnblogs.com），受瀏覽器同域併發連線數限制（舊版 IE 為 2），下載會排隊，嚴重拖慢載入。

優化方向預告

• 減少 HTTP 請求數（合併檔案、CSS Sprites）
• 靜態資源放置 CDN / 不同子域名突破併發限制
• JS 放底部或異步載入避免阻塞渲染
• 啟用壓縮傳輸（Gzip/Deflate）
• 設定快取標頭（Expires, Cache-Control）

下篇將逐一展開實作技巧。