cordova/phonegap/webapp性能優化方法


1.有條件可以自己做UI,不要用框架.用框架的話不要用jquery mobile,用sencha touch或者jqmobi(app framework)

2.不要在服務器生成UI,在本地生成.

3.前端盡量少在DOM上插入,刪除顯示的元素.

4.把頁面切換特效關掉,安卓上很多白屏就是這樣出現的.

5.避免網絡請求,可以用LocalStorage,sqlite數據庫,文件等保存在本地.

6.為數據使用本地緩存,如開啟ajax的緩存.

7.限制結果集的高度和寬度

8.不要讓界面等數據,先加載界面,再加載數據.如CSS跟html寫前面,JS寫后面.ajax異步等等.

9.所有的動畫用CSS的轉換和硬件加速,性能會好很多.

10.使用本地的滾動條,用插件的話,卡出翔!

#scroller { overflow: auto; -webkit-overflow-scrolling: touch; position: absolute; top: 48px; bottom: 0px; left: 0px; right: 0px;}

11.避免用click觸發,因為會有300毫秒的延遲,直接用touch觸發.

12.優化圖片,為每一個元素設置一個圖片的src是很慢的.直接用CSS Sprite Sheets,在很多圖片的APP里面效果明顯.

13.圖片的大小要跟html的容器相適應.

14.不要用陰影和梯度,特別在安卓手機上,陰影渲染的代價太大了.其他還有文字對齊和邊界半徑.

15.減少回流.減少DOM的數量,減少DOM訪問,避免用js調整布局,全部用CSS來完成.

16.沒用到的框架,不要傻乎乎的全引用進來,搞清楚你需要哪些,不需要的就別加載了,加載是要時間的,特別在手機瀏覽器上,特別明顯.

17.通過開發者工具來調試,看什么東西占用的時間最多,再有目的的優化.


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM