網頁美工設計
網頁設計移動端H5前端性能優化方案
編輯：
時間：2017-07-11 20:07:54
1、HTML使用Viewport
Viewport可以加速頁面的渲染，請使用以下代碼：
2、減少Dom節點
Dom節點太多影響頁面的渲染，應盡量減少Dom節點。
3、動畫優化
（1）、盡量使用CSS3動畫。
?。?）、合理使用requestAnimationFrame動畫代替setTimeout。
（3）、適當使用Canvas動畫5個元素以內使用css動畫，5個以上使用Canvas動畫（iOS8可使用webGL）。
4、高頻事件優化
Touchmove、Scroll事件可導致多次渲染。
?。?）、使用requestAnimationFrame監聽幀變化，使得在正確的時間進行渲染。
?。?）、增加響應變化的時間間隔，減少重繪次數。
5、GPU加速
CSS中以下屬性（CSS3transitions、CSS33Dtransforms、Opacity、Canvas、WebGL、Video）來觸發GPU渲染，請合理使用。（PS：過渡使用會引發手機過耗電增加。）
| << 上一篇：h5移動端頁面怎么根據設計稿布局 | >> 下一篇：網頁設計師的靈感主要從哪里來 |
相關資訊
- 2017-07-11h5移動端頁面怎么根據設計稿布局
- 2017-06-26怎么把網頁設計的更有視覺效果
- 2017-06-22網頁設計中的樣式單位px、em、rem區別
- 2017-06-01室內設計師如何設計一個好的室內設計方案
- 2017-05-24室內設計平面布局方案和技巧
- 2017-05-24室內設計師如何寫室內設計方案
- 2017-05-23室內設計師如何講述設計方案
- 2017-05-09網頁設計中圖片有哪些常見的使用技巧
- 2017-05-04鄭州哪里可以學網頁設計培訓班
- 2017-05-04自適應網頁設計制作的方法和技巧
- 2017-04-10網頁設計首頁如何布局會有好的用戶體驗
- 2017-04-08室內設計中式白墻黑瓦設計方案
- 2017-04-06網頁設計中怎么用ps切圖
- 2017-04-06網頁前端需要會些什么 學什么東西
- 2017-03-20web前端用到的專業技能有哪些
- 求學問答專業答復，快速響應
- 電話：0371-63218905
- 手機：13613841515
-
QQ：
更多
熱門課程排行榜
