我們通常聽說網站的性能有問題。要優化它,所有的后端開發人員都要加班來優化代碼。所以前端程序員無事可做,有沒有優化的地方?今天,我們來談談前端程序員的優化點。三個主要方面
1、 瀏覽器訪問優化
HTTP協議是一種無狀態的應用層協議,意味著每個HTTP請求都需要建立一個通信鏈路進行數據傳輸,而在服務器端,每個HTTP都需要啟動一個獨立的線程進行處理。這些通信和服務成本非常昂貴,減少HTTP請求的數量可以有效地提高訪問性能。
減少HTTP請求的主要方法是合并CSS、JavaScript和圖片。將每次訪問所需的瀏覽器-JavaScript和CSS合并到一個文件中,這樣瀏覽器只需要一個請求。圖片也可以合并。多張圖片可以合并為一張。如果每張圖片都有不同的超鏈接,則可以使用CSS偏移量響應鼠標單擊操作并構造不同的url。
網站前端優化網站性能的方法分析
對于一個網站來說,CSS、JavaScript、logo、icon等靜態資源文件的更新頻率相對較低,幾乎每個HTTP請求都需要這些文件。如果將這些文件緩存在瀏覽器中,則可以大大提高性能。通過在HTTP頭中設置cache control和expires的屬性,可以設置瀏覽器緩存。緩存時間可以是幾天甚至幾個月。
服務器端的文件壓縮和瀏覽器端的文件解壓縮可以有效地減少通信傳輸的數據量。文本文件的壓縮效率可以達到80%以上,因此對HTML、CSS和JavaScript文件啟用gzip壓縮可以取得更好的效果。
CSS放在頁面的頂部,JS放在頁面的底部。下載完所有CSS后,瀏覽器將呈現整個頁面,因此優化的方法是將CSS放在頁面頂部,這樣瀏覽器就可以盡快下載CSS。相反,JavaScript在瀏覽器加載JavaScript后立即執行,這可能會阻塞整個頁面,導致頁面顯示緩慢。因此,JavaScript放在頁面的底部。但是如果頁面解析需要JavaScript,那么將它放在底部是不合適的
2、 使用CDN加速
CDN(content distribution network,內容分發網絡)的本質仍然是一個緩存,數據被緩存在離用戶近的地方,以便用戶能夠以快的速度獲取數據。
由于CDN部署在網絡運營商的機房,網絡運營商也是終用戶的網絡服務提供商,因此用戶請求路由到達CDN服務器。當CDN中有瀏覽器請求的資源時,它們直接從CDN返回到瀏覽器中,短路徑返回響應,加快了用戶訪問速度,降低了數據中心的負載壓力。
3、 反向代理
傳統的代理服務器位于瀏覽器端,代理瀏覽器向互聯網發送HTTP請求,而反向代理服務器位于網站機房側,代理網站web服務器接收HTTP請求。
由于傳統的代理服務器可以保護瀏覽器的安全,反向代理服務器也可以保護網站的安全。來自Internet的訪問請求必須通過代理服務器,這相當于在web服務器和可能的網絡攻擊之間建立了一個屏障。
除了安全性之外,代理服務器還可以通過配置緩存來加速Web請求。當用戶初次訪問靜態內容時,靜態內容緩存在反向代理服務器上,這樣當其他用戶訪問靜態內容時,可以直接從反向代理服務器返回,加快web請求的響應速度,減輕web服務器的負載壓力。