在第一部分和第二部分中我們分別介紹了改善網站性能中頁面內容和服務器的幾條守則，除此之外，JavaScript和CSS也是我們頁面中經常用到的內容，對它們的優化也提高網站性能的重要方面：
CSS：
JavaScript
在研究Yahoo!的性能表現時，我們發現把樣式表放到文檔的<head />內部似乎會加快頁面的下載速度。這是因為把樣式表放到<head />內會使頁面有步驟的加載顯示。
注重性能的前端服務器往往希望頁面有秩序地加載。同時，我們也希望浏覽器把已經接收到內容盡可能顯示出來。這對於擁有較多內容的頁面和網速較慢的用戶來說特別重要。向用戶返回可視化的反饋，比如進程指針，已經有了較好的研究並形成了正式文檔。在我們的研究中HTML頁面就是進程指針。當浏覽器有序地加載文件頭、導航欄、頂部的logo等對於等待頁面加載的用戶來說都可以作為可視化的反饋。這從整體上改善了用戶體驗。點擊這裡查看網頁制作教程頻道內容
把樣式表放在文檔底部的問題是在包括Internet Explorer在內的很多浏覽器中這會中止內容的有序呈現。浏覽器中止呈現是為了避免樣式改變引起的頁面元素重繪。用戶不得不面對一個空白頁面。
HTML規范清楚指出樣式表要放包含在頁面的<head />區域內：“和<a />不同，<link />只能出現在文檔的<head />區域內，盡管它可以多次使用它”。無論是引起白屏還是出現沒有樣式化的內容都不值得去嘗試。最好的方案就是按照HTML規范在文檔<head />內加載你的樣式表。 CSS表達式是動態設置CSS屬性的強大（但危險）方法。Internet Explorer從第5個版本開始支持CSS表達式。下面的例子中，使用CSS表達式可以實現隔一個小時切換一次背景顏色：
background-color: expression( (new Date()).getHours()%2 ? "#B8D4FF" : "#F08A00" );
如上所示，expression中使用了JavaScript表達式。CSS屬性根據JavaScript表達式的計算結果來設置。expression方法在其它浏覽器中不起作用，因此在跨浏覽器的設計中單獨針對Internet Explorer設置時會比較有用。
表達式的問題就在於它的計算頻率要比我們想象的多。不僅僅是在頁面顯示和縮放時，就是在頁面滾動、乃至移動鼠標時都會要重新計算一次。給CSS表達式增加一個計數器可以跟蹤表達式的計算頻率。在頁面中隨便移動鼠標都可以輕松達到10000次以上的計算量。
一個減少CSS表達式計算次數的方法就是使用一次性的表達式，它在第一次運行時將結果賦給指定的樣式屬性，並用這個屬性來代替CSS表達式。如果樣式屬性必須在頁面周期內動態地改變，使用事件句柄來代替CSS表達式是一個可行辦法。如果必須使用CSS表達式，一定要記住它們要計算成千上萬次並且可能會對你頁面的性能產生影響。
很多性能規則都是關於如何處理外部文件的。但是，在你采取這些措施前你可能會問到一個更基本的問題：JavaScript和CSS是應該放在外部文件中呢還是把它們放在頁面本身之內呢？
在實際應用中使用外部文件可以提高頁面速度，因為JavaScript和CSS文件都能在浏覽器中產生緩存。內置在HTML文檔中的JavaScript和CSS則會在每次請求中隨HTML文檔重新下載。這雖然減少了HTTP請求的次數，卻增加了HTML文檔的大小。從另一方面來說，如果外部文件中的JavaScript和CSS被浏覽器緩存，在沒有增加HTTP請求次數的同時可以減少HTML文檔的大小。
關鍵問題是，外部JavaScript和CSS文件緩存的頻率和請求HTML文檔的次數有關。雖然有一定的難度，但是仍然有一些指標可以一測量它。如果一個會話中用戶會浏覽你網站中的多個頁面，並且這些頁面中會重復使用相同的腳本和樣式表，緩存外部文件就會帶來更大的益處。
許多網站沒有功能建立這些指標。對於這些網站來說，最好的堅決方法就是把JavaScript和CSS作為外部文件引用。比較適合使用內置代碼的例外就是網站的主頁，如Yahoo!主頁和My Yahoo!。主頁在一次會話中擁有較少（可能只有一次）的浏覽量，你可以發現內置JavaScript和CSS對於終端用戶來說會加快響應時 間。點擊這裡查看網頁制作教程頻道內容
&n
123下一頁