前端優化 基於前端H5移動端的優化

2021-09-20 02:41:07 字數 580 閱讀 7756

1)減少js載入體積

很多庫能用cdn的盡量使用cdn,這樣打包出來的js體積會很小,載入很快。

2)盡量採用比較輕量級的ui 元件庫

比如museui,mintui等

4)儘量減少網路請求數量

程式中的資料,有的能乙個介面返回的盡量乙個介面返回,不要弄太多的介面。

5)盡量把大的js 檔案進行分割成小的js檔案

如果乙個檔案有幾百k,則需要想辦法減小js的體積,js體積大的時候,往往影響js的載入速度,進而影響體驗。

6)盡量不要在手機端做過於複雜的邏輯處理

複雜的邏輯後端處理,手機端盡量只進行資料的展示和一些簡單的邏輯處理。

lazyload懶載入

能採用懶載入的盡量採用懶載入,如模組懶載入,頁面懶載入,懶載入等等。

減少使用定位屬性(fixed/absolute)

否則存在明顯的渲染問題

釋放沒有使用的閉包

釋放沒有使用的閉包

釋放定時器

用了定時器,盡量都釋放下,t=null就可以

11)盡可能的減少watcher的數量

如果用的是vue, 儘量減少watch

前端 移動端h5常用屬性

viewport 設定顯示方式,一般適配移動裝置用來避免縮放和影響體驗的滾動條 width device width 寬度為裝置寬度 initial scale 初始的縮放比例 範圍從 0到 10 minimum scale 允許使用者縮放到的最小比例 maximum scale 允許使用者縮放到的...

移動端h5優化

1 減少js載入體積 很多庫能用cdn的盡量使用cdn,這樣打包出來的js體積會很小,載入很快。2 盡量採用比較輕量級的ui 元件庫 比如museui,mintui等 4 儘量減少網路請求數量 程式中的資料,有的能乙個介面返回的盡量乙個介面返回,不要弄太多的介面。5 盡量把大的js 檔案進行分割成小...

h5移動端適配

原理 postcss function 視覺稿的1 10 在index.html中指定 font size為document寬度的1 10 iphonex 的解析度 2436 1125 pt 812 375 dpr 3 iphonexr的解析度 1792 828 pt 896 414 dpr 3 i...