前端性能優(yōu)化需要從前端的資源類型分析,以減少請求資源和請求時(shí)間為目的。目前的類型包括圖片、javascript、css、動(dòng)態(tài)數(shù)據(jù)等，不同的資源對(duì)于運(yùn)算、帶寬等的依賴也不同，因此優(yōu)化的方式也不同。參照以往的經(jīng)驗(yàn)和雅虎前端優(yōu)化的策略，本系統(tǒng)分為以下方面： 1）根據(jù)瀏覽器加載數(shù)據(jù)的順序不同，將加載的位置分為head內(nèi)部和body之后 ? ? ? a，css盡可能的放到head內(nèi)部 ? ? ? b，JavaScript放到body之后 2）減少數(shù)據(jù)請求的次數(shù)，減少服務(wù)器請求時(shí)間 ? ? ?a，合并不必要的單次后端請求； ? ? ?b，首界面采用惰性加載，列表頁采用分頁加載； ? ? ?c，javascript合并； ? ? ?d，css合并 ? ? ?e，2k以內(nèi)的請求采用get方式，反之采用post請求 3）通過數(shù)據(jù)壓縮，減少數(shù)據(jù)傳輸?shù)臅r(shí)間 ? ? ?a，服務(wù)器請求采用gzip壓縮 ? ? ?b，banner圖片采用圖片壓縮，壓縮到200kb左右 ? ? ?c，javascript和css采用數(shù)據(jù)壓縮 4）通過數(shù)據(jù)緩存增加請求的速度 ? ? a，圖片資源，JavaScript、css 配置cdn ? ? b，頁面靜態(tài)資源配置頁面緩存； 5）多域名請求 ? ? a，將數(shù)據(jù)庫、圖片、應(yīng)用程序等功能分開存儲(chǔ)請求； ? ? b，根據(jù)不同的業(yè)務(wù)劃分不同的域名服務(wù)器 6）負(fù)載均衡 ? ? a，設(shè)定負(fù)載均衡，包括應(yīng)用程序負(fù)載和數(shù)據(jù)庫負(fù)載處理； 7）硬件配置提升 ? ? a，增加網(wǎng)絡(luò)帶寬 ? ? b，增加服務(wù)器處理能力
? ??以上的優(yōu)化策略效果逐級(jí)提升，從成本的角度考慮，不同的階段側(cè)重點(diǎn)不同。優(yōu)化的核心關(guān)鍵是理解問題的瓶頸，根據(jù)瓶頸和問題特點(diǎn)進(jìn)行針對(duì)性優(yōu)化。

總結(jié)

以上是生活随笔為你收集整理的Web前端性能优化策略的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。