前言
網站設計的優化是一個很大的話題,有一些通用的原則,也有針對不同開發平台的一些建議。這方面的研究一直沒有停止過，我在不同的場合也分享過這樣的話題。
作為通用的原則，雅虎的工程師團隊曾經給出過35個最佳實踐。這個列表請參考
Best Practices for Speeding Up Your Web Site http://developer.yahoo.com/performance/rules.html
同時，他們還發布了一個相應的測試工具Yslow http://developer.yahoo.com/yslow/
我強烈推薦所有的網站開發人員都應該學習這些最佳實踐，並結合自己的實際項目情況進行應用。
接下來的一段時間，我將結合ASP.NET這個開發平台，針對這些原則，通過一個系列文章的形式，做些講解和演繹，以幫助大家更好地理解這些原則，並且更好地使用他們。
准備工作
為了跟隨我進行后續的學習，你需要准備如下的開發環境和工具
- Google Chrome 或者firefox ，並且安裝 Yslow這個擴展組件.請注意，這個組件是雅虎提供的，但目前沒有針對IE的版本。
- https://chrome.google.com/webstore/detail/yslow/ninejjcohidippngpapiilnmkgllmakh
- https://addons.mozilla.org/en-US/firefox/addon/yslow/
- 你應該對這些瀏覽器的開發人員工具有所了解，你可以通過按下F12鍵調出這個工具。
- Visaul Studio 2010 SP1 或更高版本，推薦使用Visual Studio 2012
- 你需要對ASP.NET的開發基本流程和核心技術有相當的了解，本系列文章很難對基礎知識做普及。
本文要談討論的話題
這篇文章，我將來和大家探討CDN的問題，這是第二條原則，相關概念可以參考這里 http://developer.yahoo.com/performance/rules.html#cdn
我將從幾個方面來介紹這個話題：
1.什么是CDN?
CDN的全稱是Content Delivery Network，中文直譯過來是：內容交付網絡。它的主要意思是，將某些內容進行交付的網絡。對於網站開發而言，我們所講的內容通常指的是內容文件（例如javascript，css，圖片等等），也就是說，這里所說的CDN的意思是指，建立（或者使用）一個更加有利於交付這些內容交付的網絡。
2.為什么需要CDN?
我們必須承認，在很早的時候，是沒有CDN的概念和需求的。那時候我們網站所需要的javascript等文件，就是放在我們的網站目錄中，其實這也是一種內容交付的方式，而且往往還是比較高效的。但直到有一天，我們做了各種各樣的網站，我們就會發現另外一個問題：就是針對同一個javascript文件，瀏覽器可能會緩存多個版本，例如下面這個截圖所示
之所以會這樣做，是因為瀏覽器是根據域(Domain)來緩存內容資源的，只要域不一樣，那么它就需要重復下載這些資源，而且使用同樣的方式將它們緩存起來。
但是，這會帶來一些小的問題：重復地下載，緩存這些同樣的腳本文件是需要占用帶寬和本地緩存文件空間的。
於是，人們想出來一個解決方法：既然瀏覽器是根據域來區分這些內容資源的，那么是否可以將這些內容都放在統一的一個域里面呢？這樣就算是我們有很多網站，我們都可以使用同樣的地址引用這些內容資源，那么就不會產生重復下載和緩存的問題了。
3.如何使用CDN
很多問題，關鍵在於想到了，只要想到了，接下去怎么做其實不難。就好比我們現在討論的這個CDN的問題。
我們可以繼續以博客園的主頁為例來進行分析
發展到今天，我們知道博客園是有很多站點的，例如www.cnblogs.com, news.cnblogs.com , q.cnblogs.com 等等。他們應該或多或少都會用到jquery這個通用庫。那么博客園是怎么做到底呢？
從上圖中我發現，他們做了一個所謂的公用的子站點：common.cnblogs.com ，里面存放了他們使用的jquery最終的版本。
實際上這就是一個最直接也是最簡單的使用CDN的做法：如果你有很多站點，他們之間可以共享某些內容（例如javascript，css，image等），那么與其每個站點放一份，就不如將他們統一地存在在一個地方，這樣就可以減少下載的次數和緩存的體積了。
這樣做還有一個好處就是：由於主流瀏覽器對於同一個域所允許保持的連接數都是有限制的（可參考 http://www.impng.com/web-dev/browser-max-parallel-connections.html 的介紹），HTTP 1.1協議甚至明確地建議將這個連接數限制為2（Clients that use persistent connections SHOULD limit the number of simultaneous connections that they maintain to a given server. A single-user client SHOULD NOT maintain more than 2 connections with any server or proxy. A proxy SHOULD use up to 2*N connections to another server or proxy, where N is the number of simultaneously active users. These guidelines are intended to improve HTTP response times and avoid congestion）。那么，我們采用CDN的做法來將某些內容放在不同的域里面，從一定意義上可以增加下載的並行度。關於這個原則，也可以參考 http://developer.yahoo.com/performance/rules.html#split
除了上述的做法（自己單獨建一個站點來保存這些內容資源），如果你是做一個互聯網應用，那么還可以享受到一些業界知名的廠商所提供的CDN服務，他們將很多最常用的javascript庫，放在了統一的位置（通常他們的服務器是很快的），可以供全世界的網站開發人員免費使用，這樣做的好處是擴大了共享的范圍，例如如果你要訪問cnblogs.com ，它使用jquery的庫，也許你在訪問microsoft.com的時候就下載過了，所以連第一次都無需下載。
這些提供CDN服務的廠商有：
微軟的CDN服務
http://www.asp.net/ajaxlibrary/cdn.ashx
Google的CDN服務
https://developers.google.com/speed/libraries/devguide
選擇誰的服務，完全取決你自己的喜好。事實上，他們的用法也很接近，例如
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.0.0.min.js" type="text/javascript"></script>
另外，我在上一篇文章中提到了為了減少請求數，我們可以采用Bundle的形式將多個文件進行打包合並，如果遇到我們希望對某個文件使用CDN的情況，應該如何改進呢？請參考下面的代碼
config.UseCdn = true; config.Add(new ScriptBundle("~/jquery", "http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.0.0.min.js").Include("~/scripts/jquery-2.0.0.min.js"));
需要注意的是，只有當web.config文件中，將compilation的debug設置為false,才會使用CDN, 否則將使用本地的文件。這也是為什么我們需要定義兩個路徑的原因。
<compilation debug="false" targetFramework="4.5"/>
看起來不錯，不是嗎？但是CDN的使用，也有一些額外需要考慮到負面作用。
4.使用CDN的負面作用
使用CDN，尤其是使用第三方的CDN，需要考慮網絡的可到達性。這些內容既然是Host在別人的服務器上面，那么從一定意義上說，並非很可控。例如，因為眾所周知的原因，我上面沒有使用Google提供的CDN地址。
另外，使用CDN因為會涉及到多個域，那么將違背下面兩條原則：
Minimize HTTP Requests （這個我在上一篇文章詳細介紹過）
http://developer.yahoo.com/performance/rules.html#num_http
Reduce DNS Lookups （后續再介紹）
http://developer.yahoo.com/performance/rules.html#dns_lookups
很驚奇嗎？為什么這些原則（同時也號稱為最佳實踐）會自相矛盾呢？其實一點都不奇怪，世界本來就是辯證統一的。這些矛盾是客觀存在的，我們要做的是，綜合他們的利弊，進行權衡。你說呢