韩国videos18高清hd,国产日韩欧美在线,视频一区二区在线播放

引言

　　不是所有人都能夠使用高速 InterNET 連接。即使每個人都能夠使用高速網絡，也會因為各種各樣的原因使您的 Web 應用程序看起來運行緩慢。在這個寬帶速度不斷提高的時代，您應當關注一下頁面加載時間。將珍貴的頁面加載時間縮短幾秒，將更加珍貴的請求和響應時間縮短幾毫秒。您將為訪問者創造一種更好的體驗。
閱讀完本文之后，您將能夠較好地了解網頁加載時間優化的基本知識。您還能夠使用工具和知識更好地識別和判斷加載緩慢的頁面部分和瓶頸。

先決條件

　　在理想情況下，您應該安裝了 Mozilla Firefox。您還應該大體了解 Web 開發。本文涉及的主題并不復雜，但是如果您了解超文本標記語言（Hypertext Markup Language，HTML）、層疊樣式表（Cascading Style Sheet，CSS）以及 ™ 編程語言等主題，那么在學習本文時將更加得心應手。不需要使用集成開發環境（IDE），只需使用您喜愛的編輯器。

　　您必須在瀏覽器中啟用了 JavaScript。另外，要學習與 Firebug 和 YSlow 相關的內容，您需要安裝 Firefox Web 瀏覽器。

假設您沒有寬帶

　　許多人通過某種形式的寬帶連接訪問 InterNET，這些形式可能是 DSL、網線、光纖或其他方法。但是，無法使用這類技術的用戶不得不使用撥號連接。您一定已經忘記撥號上網是什么感覺了，但您可以試著回想一下網頁逐行加載時的情形。

　　幸運的是，這些可憐的人們現在已經能夠獲得一些幫助。您可以通過縮短加載頁面的時間來改善他們的體驗。但是，撥號連接并不是降低加載和響應速度的惟一原因。許多 Web 設計人員錯誤地認為高速 InterNET 連接的到來會使網站性能優化變得沒有必要。這種觀點是不對的。例如，過去使用桌面軟件執行的許多任務現在可以在線執行。在 Web 應用程序中獲得像桌面軟件那樣的高速響應體驗非常困難，因此性能優化非常重要。幸運的是，一些工具和最佳實踐可用于縮短響應和加載時間，提供更加流暢的體驗。

基本工具

　　對于所有與優化相關的任務，您必須使用工具來診斷瓶頸和識別問題。現在在 Web 開發中使用最廣泛的兩個工具是 Firebug 和 YSlow，它們都是開源、免費的 Firefox 插件。

Firebug
　　Firebug（參見參考資料）是最流行的 Firefox 擴展之一，該應用程序能夠使 Web 開發人員的工作更加輕松。它包含許多非常有用的功能，比如：

JavaScript 調試
JavaScript 命令行
監視 JavaScript 性能和跟蹤 XmlHttpRequests
登錄 Firebug 控制臺
跟蹤
檢查 HTML 元素和動態編輯 HTML 代碼
動態編輯 CSS 文檔

YSlow
　　YSlow（參見參考資料）分析網頁，并根據 Yahoo! 起草的高性能網站規則（參見參考），告訴您網頁加載緩慢的原因。YSlow 是一個與 Firebug 集成的 Firefox 插件，因此您需要首先安裝 Firebug，然后才能安裝和使用 YSlow。

常識：牢記設計規則

　　令人驚訝的是簡單的設計規則通常會被忽視，最終產生未經優化的、下載緩慢的網頁。牢記以下規則，頁面的加載速度將會更快。
使用良好的結構

　　可擴展 HTML (XHTML) 具有許多優勢，但是其缺點也很明顯。XHTML 可能使您的頁面更加符合標準，但是它大量使用標記（強制性的 <start> 和 <end> 標記），這意味著瀏覽器要下載更多代碼。所以，事情都有兩面性，嘗試在您的網頁中使用較少的 XHTML 代碼，以減小頁面大小。

　　如果您確實不得不使用 XHTML，試著盡可能對它進行優化。例如，刪除空格并采用嚴格的 XHTML 編碼實踐，提高下載和解析速度。要嚴格執行 XHTML Strict 規則，向文檔中添加以下 doctype 語句：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"      
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

檢查 cookie 使用情況

　　cookie 可能是很小的文件，但是瀏覽器仍然需要下載它們。較大的 cookie 所需的下載時間更長，進而增加了瀏覽器加載網頁的時間。正因為如此，盡可能縮小 cookie 來最小化對瀏覽器響應時間的影響非常重要。

　　此外，設置一個較早的 expire 日期或者根本不設置 expire 日期，會縮短響應時間。

不要包含不必要的 JavaScript 代碼，盡可能將其外部化

　　與 cookie 類似，JavaScript 文件的下載也需要時間，這不可避免地會降低整個頁面的加載速度。因此，明智地使用 JavaScript（僅在真正必要時才使用）并優化腳本的大小和速度。

　　縮短 JavaScript 下載時間的另一種方式是使用外部文件，而不是包含腳本內聯。這種方法也適用于 CSS，因為瀏覽器會緩存外部化的文本，而（在 HTML 頁面自身中）以內聯方式編碼的 CSS 或 JavaScript 每次都會隨 HTML 一起加載。要通過在 HTML 中引用 CSS 和 JavaScript 代碼來外部化它們，可以使用具有以下形式的代碼：

<link href="/stylesheets/myStyle.css" media="all" rel="Stylesheet" type="text/css" />
   <script src="/Javascripts/myJavascript.js" type="text/Javascript"></script>

盡可能延遲腳本加載

　　我在前面提到過，移除完全不需要的 JavaScript 代碼能夠加快加載和處理速度。但是如果代碼已經非常精簡并且必須在頁面中包含 JavaScript 代碼的話，該怎么辦？
在這種情形下，一種提升頁面下載速度的潛在方式是將腳本放在頁面的底部，使頁面加載更迅速。通常，瀏覽器只能（從同一個域）下載不超過兩個并行對象，如果一個對象是一段 JavaScript 代碼，那么在該腳本下載完之前，其他頁面組件的下載將會暫停。如果將 JavaScript 代碼放在頁面底部，（在大多數情況下）它將在最后下載，這時所有其他組件都已下載完。

　　使用 Firebug 擴展跟蹤加載緩慢的文件，我敢打賭您的 JavaScript 文件是下載最慢的文件。壓縮 JavaScript 文件會有所幫助，但是僅僅這樣可能還不夠。您可以使用以下代碼片段延遲 JavaScript 的加載：

var delay = 5;
setTimeout("heavy();", delay * 1000);

使用 PNG 格式的圖像

　　Graphic Interchange Format (GIF) 和 Joint Photographic Experts Group (JPEG) 圖像格式都已過時了：Portable NETwork Graphic (PNG) 是未來流行的格式。當然，您可以說 GIF 和 JPEG 已經消亡，或者 PNG 沒有任何缺陷，但是所有事物都有各自的優缺點，PNG 以最佳的文件大小提供了出色的質量。因此，如果進行選擇的話，應該盡可能使用 PNG 圖像。

保持 Ajax 調用簡短、準確

　　當統稱為 Asynchronous JavaScript + XML (Ajax) 的技術在兩年前出現時，這些技術為處理頁面請求和響應提供了一種革命性方法。然而，撥號用戶可能從來沒機會體驗其真正的優勢，因為在許多情形下，Ajax 需要在瀏覽器與服務器之間大量通信。因此，如果您能夠保持 Ajax 調用簡短和準確，可以避免用戶花費無止盡的時間來等待元素刷新或響應。

進行一次較大的 Ajax 調用并在本地處理客戶機數據

　　如果不能進行簡短的 Ajax 調用，或者如果這些調用不能提供期望的結果，可以考慮一種替代方法：進行一次大的 Ajax 調用來獲取所需的一切內容，然后讓客戶機在本地處理數據。通過這種方式，客戶機只需等待一次（獲取傳入的數據），但是在此之后（當瀏覽器與服務器之間沒有必要通信時），處理速度將更快。當然，還有大量 Ajax 優化技術，本教程無法一一列出。如果想要了解關于 Ajax 的更多信息，請查看參考資料。

在沙箱中測試代碼

　　還有一個經常被遺忘的常用技巧。盡管清醒的 Web 開發人員通常會在啟動應用程序之前對其進行測試，但是有時候測試會使他們不那么重視維護任務，或者新功能添加得太快，并且未經過充分考慮或測試。結果，余下的腳本減緩了應用程序的速度。

　　如果您添加一項新功能，可以首先在沙箱里（完全脫離了應用程序的其余部分）進行測試，查看它作為單個函數的行為。通過這種方式，您可以反復檢查，并分析性能和響應時間，無需考慮 Web 應用程序的其余部分。然后，當新功能的行為符合預期時，可以將其引入到應用程序的其余部分中，運行其他測試，保證功能本身的行為符合預期。

分析站點代碼

　　在許多場景中，自我反省是一個不錯的建議。幸運的是，在開發過程中，我們可以使用工具來幫助反省，并盡可能客觀地進行實踐。像 JSLint（參見參考資源）這樣的工具的價值是無法衡量的，盡管其站點宣稱它 “可能令您備受挫折”，因為它向您提供了所有的潛在代碼缺陷，這些缺陷不但使調試更加困難，而且可能導致更長的響應時間。

使用 JSLint 檢查 JavaScript 代碼中的錯誤或糟糕的編碼實踐

　　您不需要像完美主義者那樣追求完美無缺的 JavaScript 代碼。但是，許多開發人員沒有認真對待代碼分析，通常在開發過程中跳過了這個步驟。不幸的是，錯誤和糟糕的編碼實踐不僅不太專業，而且可能減緩應用程序的速度。當瀏覽器忙于應付錯誤和糟糕的編碼實踐時，加載不僅需要更多時間，還會導致難以調試的錯誤。

　　因此，如果想要獲得良好的代碼，可以考慮使用代碼分析工具。有許多不同的工具可供使用，但是最適合 JavaScript 語言的工具非 JavaScript Lint 莫屬，它也叫做 JSLint（參見參考資料）。也可以使用 Firebug，但是 JSLint 更加正式，它包含在 YSlow 中。

檢查孤立的文件和丟失的圖像

　　檢查孤立的文件和丟失的圖像是一種明智之舉。大部分 Web 開發人員都會檢查錯誤的文件引用，但是這里仍然需要說明一下。丟失的文件容易引起各種問題，因為它們會導致 “The image/page cannot be displayed” 之類的錯誤消息。但是在網頁速度優化方面，它們具有更大的缺陷：當瀏覽器尋找丟失的或孤立的文件時，它會消耗資源，這不可避免地會導致頁面處理速度變慢。因此，請檢查孤立或丟失的文件，包括拼寫錯誤的文件名。

使用 YSlow 分析網頁

　　YSlow 是一個相對較小但非常有用的 Firefox 擴展。當啟動 YSlow 時，該擴展在瀏覽器的下半部分中打開，如下所示。