移動端效能優化?

2021-08-09 11:37:06 字數 338 閱讀 7149

盡量使用css3動畫,開啟硬體加速。

適當使用touch事件代替click事件。

避免使用css3漸變陰影效果。

可以用transform: translatez(0)來開啟硬體加速。

不濫用float。float在渲染時計算量比較大,儘量減少使用

合理使用requestanimationframe動畫代替settimeout

css中的屬性(css3     transitions、css3 3d transforms、opacity、canvas、webgl、video)會觸發gpu渲染,請合理使用。過渡使用會引發手機過耗電增加

pc端的在移動端同樣適用

移動端網頁效能優化自查表

1 dns預載入 通過dns prefetch屬性可以讓瀏覽器提前解析資源或介面對應的伺服器ip位址,避免在請求中發起dns解析請求,節省請求時間 2 資源預載入 利用preload,prefetch,preconnect屬性我們可以在 內部宣告式的書寫資源獲取請求,提前載入非首屏但又較重要的資源,...

移動端效能

1 減少或避免使用repaint 頁面重繪 reflow 頁面回流 2 盡量快取可以快取的資料 3 用css3動畫代替dom 操作的動畫,可以用animation.css html5常用api 1 dom操作 queryselector 2 本地資料儲存,localstorage,setitem,g...

移動端網路優化

乙個網路請求可以簡單分為連線伺服器 獲取資料兩個部分。其中連線伺服器前還包括 dns 解析的過程 獲取資料後可能會對資料進行快取。一 連線伺服器優化策略 1.不用網域名稱,用 ip 直連 省去 dns 解析過程,dns 全名 domain name system,解析意指根據網域名稱得到其對應的 i...