優化網站設計(十八):預加載內容


前言

網站設計的優化是一個很大的話題,有一些通用的原則,也有針對不同開發平台的一些建議。這方面的研究一直沒有停止過,我在不同的場合也分享過這樣的話題。

作為通用的原則,雅虎的工程師團隊曾經給出過35個最佳實踐。這個列表請參考  Best Practices for Speeding Up Your Web Sitehttp://developer.yahoo.com/performance/rules.html,同時,他們還發布了一個相應的測試工具Yslow http://developer.yahoo.com/yslow/

我強烈推薦所有的網站開發人員都應該學習這些最佳實踐,並結合自己的實際項目情況進行應用。 接下來的一段時間,我將結合ASP.NET這個開發平台,針對這些原則,通過一個系列文章的形式,做些講解和演繹,以幫助大家更好地理解這些原則,並且更好地使用他們。

准備工作

為了跟隨我進行后續的學習,你需要准備如下的開發環境和工具

  1. Google Chrome 或者firefox ,並且安裝 Yslow這個擴展組件.請注意,這個組件是雅虎提供的,但目前沒有針對IE的版本。
    1. https://chrome.google.com/webstore/detail/yslow/ninejjcohidippngpapiilnmkgllmakh
    2. https://addons.mozilla.org/en-US/firefox/addon/yslow/
    3. 你應該對這些瀏覽器的開發人員工具有所了解,你可以通過按下F12鍵調出這個工具。
  2. Visaul Studio 2010 SP1 或更高版本,推薦使用Visual Studio 2012
    1. http://www.microsoft.com/visualstudio/eng/downloads
  3. 你需要對ASP.NET的開發基本流程和核心技術有相當的了解,本系列文章很難對基礎知識做普及。

本文要討論的話題

這一篇我和大家討論的是第十六條原則:Preload Components (預加載內容)

我在上一篇文章(優化網站設計(十七):延遲或按需加載內容)中談到了如何設計延遲或者按需加載的策略(針對腳本,樣式表,圖片),來實現頁面的快速加載。看起來,本文要討論的原則與上一條原則是相悖的,但其實不然。它們並不沖突,而且是為了實現不同的目標。這條原則只要理解了,要做起來實際上是比較簡單的。

其實預加載這樣的策略,在很多地方都會用到。例如典型的數據庫訪問的情況,會有所謂的“預讀”行為。我可以給大家以SQL Server為例,解釋一下什么叫“預讀(Read Ahead)”,然后以此類比到網頁加載中,我相信大家就很容易理解了。

SQL Server為了提高數據讀取效率,在第一次編譯查詢語句,並緩存執行計划的時候,會嘗試讀取一部分數據到緩存中,這樣的話,如果該查詢語句真的需要執行,因為有部分數據已經緩存起來了,則總的數據讀取量就自然少了,以此可以提高性能。

關於Read Ahead,你可以參考這里的文檔說明:http://msdn.microsoft.com/en-us/library/ms191475(v=SQL.105).aspx

下面這個截圖就是我在執行某個查詢的時候,從執行統計中看到的一些有意思的信息

image

好的,回到我們今天的話題,為什么需要預先加載內容呢?想象一下我們使用搜索引擎的場景吧:

  1. 我們通常會先登錄到搜索引擎的主頁
  2. 搜索引擎的主頁通常是比較簡單的(Google開創了這樣一個設計風格,整個頁面只有一個搜索框)
  3. 所以,主頁加載應該是比較快的(因為東西很少)。而且,從用戶進入主頁,到輸入關鍵字進行查詢,會有一定點時間,期間瀏覽器其實是較為空閑的。
  4. 當我們在搜索框中輸入關鍵字之后,會被轉到結果頁面
  5. 結果頁面的內容通常是比較多的,如果全部要在結果頁面顯示的時候,才加載,可能會比較慢

既然如此,我們能不能將原先要在結果頁面中加載的內容(如腳本,圖片,樣式等),通過某種方式,在用戶請求主頁的時候,就預先加載好。這樣,當用戶真的需要顯示結果頁面的時候,因為已經有了緩存,所以就不需要再加載了。

那么,你知道怎么做了嗎?

 

還有一個可能與此原則相關的做法,我們知道通常ASP.NET的網站第一次加載都較慢,因為它需要進行編譯。為了能優化這些網站的加載速度,我們有一種做法叫做“預熱”,簡單來說,模擬用戶去預先請求每個頁面,讓服務器的編譯盡可能早地發生,這樣用戶再來訪問的時候,就不需要再編譯了。

如果你使用了SharePoint,則可以下載下面的這個腳本

http://gallery.technet.microsoft.com/office/SharePoint-2007-2010-or-d1884b4b

實際上,上面的腳本,還可以再做修改。至少這個思路值得我們借鑒了。

 

同時 ,如果你使用了IIS 7.5,可以通過安裝下面這個組件(Application Initialization Module for IIS 7.5),來提高網站第一次訪問時的性能

http://www.iis.net/downloads/microsoft/application-initialization

 

 

 


 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM