web性能優化

1.減少外部HTTP請求

網頁加載的時間與http請求密不可分,而外部資源的加載的速度則與主機服務提供商服務器架構和分佈地點有關。我們可以通過檢查自己的網站上多餘的圖片、css、JavaScript和一些組件,然後對應的去逐個完善,就可以減少一些http請求。

2.按需加載資源

資源(特別是圖片)的按需加載或者說惰性加載,可以有助於你的web應用在整體上獲得更好的性能。對於使用大量圖片的頁面來說惰性加載有着顯著的三個好處。

  1. 減少向服務器發出的併發請求數量(這就使得頁面的其他部分獲得更快的加載時間)
  2. 減少瀏覽器的內存使用率(更少的圖片,更少的內存)
  3. 減少服務器端的負載

大體上的理念就是隻在必要的時候纔去加載圖片資源(如視頻),比如在第一次被顯示的時候,或者是在將要顯示的石斛對其進行加載。由於這種方式跟你建站的方式密切相關,惰性加載的解決防範通常需要藉助其他庫的插件或者擴展來實現。

3. 使用預獲取

顧名思義預獲取就是在真正有需要去請求之前就獲取一些必要的數據和資源,以提升用戶的瀏覽體驗。預獲取主要有三大方式:

  1. 鏈接預先獲取
  2. DNS預先獲取
  3. 預先渲染

根據你想要使用的預先獲取形式,你只需在網站 HTML 中的鏈接屬性上增加 rel=“prefetch”,rel=“dns-prefetch”,或者 rel=“prerender” 標記。

4.壓縮HTML、CSS和JavaScript

在編寫代碼時候會有一些多餘的空格,這會佔用字節,使用一些壓縮工具可以有效解決這個問題。值得注意的是,壓縮後的文件,其可讀性就會變差,後期想維護就會變得困難了。

5. 使用CDN

CDN(內容分發網絡)部署在各大運營商機房,當用戶通過瀏覽器請求資源時可以直接反饋給用戶,極大的減輕了服務器數據中心的壓力。本質上CDN也是一種緩存,如果你的所在地距離某個CDN節點很近,那麼網站響應的速度提升也是非常明顯的。另外CDN所緩存的資源主要爲靜態資源,如靜態頁面、圖片、css和js文件等。CDN加速對於一些遍佈範圍較大的網站來說效果最爲明顯,使用的話像阿里雲CDN產品,其節點多達280多個,覆蓋運營商也比較全面。

6.Ajax請求方式

POST的請求,是不可以在客戶端緩存的,每次請求都需要發送給服務器進行處理,每次都會返回狀態碼200。(可以在服務器端對數據進行緩存,以便提高處理速度)

GET的請求,是可以(而且默認)在客戶端進行緩存的,除非指定了不同的地址,否則同一個地址的AJAX請求,不會重複在服務器執行,而是返回304。所以在進行Ajax請求的時候,可以選擇儘量使用get方法,這樣可以使用客戶端的緩存,提高請求速度。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章