高效能web網站優化原則11——避免重定向
阿新 • • 發佈:2019-02-19
重定向(redirect)將使用者從一個URL路由到另一個URL。
重定向的型別:當web伺服器向瀏覽器返回一個重定向時,響應中就會包含一個3xx的狀態碼,表示使用者代理必須進一步操作才能完成請求,下面是幾種狀態碼:
• 300 Multiple Choices (based on Content-Type)
• 301 Moved Permanently
• 302 Moved Temporarily (a.k.a. Found)
• 303 See Other (clarification of 302)
• 304 Not Modified
• 305 Use Proxy
• 306 (no longer used)
• 307 Temporary Redirect (clarification of 302)
304並不是真的重定向,它用來響應GET請求,避免已經存在於快取中的資料再次被下載。306已被棄用
301和302用的最多,303和307是在HTTP規範1.1中新增的,用來澄清對302的使用,但幾乎沒人使用303和307,絕大部分還在使用302.下面是一個301的例子:
HTTP/1.1 301 Moved Permanently
Location: http://www.baidu.com
Content-Type: text/html
瀏覽器自動將使用者重定向到Location指定的url。301和302響應不會被緩衝,除非有Express或cache-contrl頭。還有其他方法可以自動將使用者重定向到其他url,例如:
<meta http-equiv="refresh" content="0; url=http://stevesouders.com/newuri">
用js指令碼也可以使用者只需重定向,例如將document.location=www.sohu.com即可。最好的技術是使用標準的3xx狀態碼,這主要是為了確保後退按鈕能正常工作。參見w3c的文章Use standard redirects: don’t break the back button!” at http://www.w3.org/QA/Tips/reback.
重定向會降低網站效能
重定向延遲了整個html文件的下載,在html文件下載完成之前,頁面不會呈現任何內容,也不會下載任何元件。在使用者和html文件之間重定向延遲了頁面中的所有元件及內容
重定向之外的其他選擇
重定向是解決很多問題的簡單方式,但最好使用其他不會減慢頁面載入速度的解決方案。
缺失結尾的/
有一種重定向最為浪費發生的也很頻繁,但web開發者通常都沒有意識到它(我從來也沒有意識到,╮(╯_╰)╭),發生在url的結尾必須出現/而沒有出現時。訪問http://www.aaa.com/example時會導致一個301的響應,包含了一個到http://www.aaa.com/example/的重定向,唯一的區別就是結尾多了一個/,當確實結尾/時傳送重定向的理由是——它允許自動索引且能獲得與當前目錄相關的url(例如logo。gif),然後很多流行的web頁面並不依賴自動索引,而是依賴特定的url和處理器。
連線網站
將使用者從舊的url轉移到新的url的最簡單方式就是重定向,重定向是使用定義良好的API——URL來整合兩個程式碼基礎的一種方式。其他形式還包括基於一些條件來引導使用者,用重定向來連線兩個網站很簡單且只需要很少的程式碼量。
雖然重定向降低了開發的複雜性,但這也損害的使用者的體驗。整合兩個後端程式碼還有其他的選擇,但比起簡單的重定向需要更多的開發工作,不過這樣非但不會損害使用者體驗,還能使之改善。如果兩個後端處於同一個伺服器上,則他們的程式碼自己就能連結,如通過介面方式直接呼叫。
重定向的型別:當web伺服器向瀏覽器返回一個重定向時,響應中就會包含一個3xx的狀態碼,表示使用者代理必須進一步操作才能完成請求,下面是幾種狀態碼:
• 300 Multiple Choices (based on Content-Type)
• 301 Moved Permanently
• 302 Moved Temporarily (a.k.a. Found)
• 303 See Other (clarification of 302)
• 304 Not Modified
• 305 Use Proxy
• 306 (no longer used)
• 307 Temporary Redirect (clarification of 302)
304並不是真的重定向,它用來響應GET請求,避免已經存在於快取中的資料再次被下載。306已被棄用
301和302用的最多,303和307是在HTTP規範1.1中新增的,用來澄清對302的使用,但幾乎沒人使用303和307,絕大部分還在使用302.下面是一個301的例子:
HTTP/1.1 301 Moved Permanently
Location: http://www.baidu.com
Content-Type: text/html
瀏覽器自動將使用者重定向到Location指定的url。301和302響應不會被緩衝,除非有Express或cache-contrl頭。還有其他方法可以自動將使用者重定向到其他url,例如:
<meta http-equiv="refresh" content="0; url=http://stevesouders.com/newuri">
用js指令碼也可以使用者只需重定向,例如將document.location=www.sohu.com即可。最好的技術是使用標準的3xx狀態碼,這主要是為了確保後退按鈕能正常工作。參見w3c的文章Use standard redirects: don’t break the back button!” at http://www.w3.org/QA/Tips/reback.
重定向會降低網站效能
重定向延遲了整個html文件的下載,在html文件下載完成之前,頁面不會呈現任何內容,也不會下載任何元件。在使用者和html文件之間重定向延遲了頁面中的所有元件及內容
重定向之外的其他選擇
重定向是解決很多問題的簡單方式,但最好使用其他不會減慢頁面載入速度的解決方案。
缺失結尾的/
有一種重定向最為浪費發生的也很頻繁,但web開發者通常都沒有意識到它(我從來也沒有意識到,╮(╯_╰)╭),發生在url的結尾必須出現/而沒有出現時。訪問http://www.aaa.com/example時會導致一個301的響應,包含了一個到http://www.aaa.com/example/的重定向,唯一的區別就是結尾多了一個/,當確實結尾/時傳送重定向的理由是——它允許自動索引且能獲得與當前目錄相關的url(例如logo。gif),然後很多流行的web頁面並不依賴自動索引,而是依賴特定的url和處理器。
連線網站
將使用者從舊的url轉移到新的url的最簡單方式就是重定向,重定向是使用定義良好的API——URL來整合兩個程式碼基礎的一種方式。其他形式還包括基於一些條件來引導使用者,用重定向來連線兩個網站很簡單且只需要很少的程式碼量。
雖然重定向降低了開發的複雜性,但這也損害的使用者的體驗。整合兩個後端程式碼還有其他的選擇,但比起簡單的重定向需要更多的開發工作,不過這樣非但不會損害使用者體驗,還能使之改善。如果兩個後端處於同一個伺服器上,則他們的程式碼自己就能連結,如通過介面方式直接呼叫。