「JavaScript」項目方面的一些問題

前端優(yōu)化總結(jié)

前端優(yōu)化一直是一個值得關注的話題。因為這個話題在前端之路的探討之聲從未停止過，今天就來好好分析一下一些常用的優(yōu)化案例：

我們可以從以下的幾個點來逐步進行分析：

  • 網(wǎng)絡方面

  1. 減少http請求，主要是三個方面js, css, 和圖片資源三個方面。
    ** 合并js文件
    ** 合并css文件
    ** 使用雪碧圖（css sprite)
    ** 使用字符圖片（svg)

  2. 減小資源體積
    ** gzip壓縮
    ** 圖片壓縮
    。。。?？傊M量減小體積

  3. 緩存
    ** DNS緩存
    ** CDN部署于緩存
    ** http緩存

DNS緩存： 為了提升域名查詢效率，設計了域名緩存機制，當訪問過某個網(wǎng)站并得到其IP后，會將其域名和IP緩存下來，下一次訪問的時候，就不需要再請求域名服務器獲取IP，直接使用緩存中的IP，提高了響應的速度

  1. 移動端優(yōu)化
    ** 首屏優(yōu)化
    ** 減少重定向
  • 渲染DOM

  1. 優(yōu)化網(wǎng)頁渲染
    ** css文件放在頭部，js文件放尾部
    ** 盡量避免內(nèi)聯(lián)樣式

  2. DOM操作優(yōu)化
    ** 避免頻繁的操作DOM
    ** 盡量使用css動畫
    ** 減少css表達式的使用
    ** 使用事件代理

  • 數(shù)據(jù)方面
  1. 圖片：
    懶加載，loading
  2. 異步請求優(yōu)化
最后編輯于 ：
?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容