如何开发高性能的phoengap应用

2015-11-9 11:49| 发布者: admin| 查看: 4108| 评论: 0

摘要: 用phonegap写一个app非常容易，但是写一个高性能的pheongap应用，不是随便回一点htmlcssjs基础就能写出来的。还需要注意很多的东西。写一个糟糕的应用很容易，但是写个高性能的应用缺不是那么的容易。所以如果你用ph ...

用phonegap写一个app非常容易，但是写一个高性能的pheongap应用，不是随便回一点html css js基础就能写出来的。还需要注意很多的东西。写一个糟糕的应用很容易，但是写个高性能的应用缺不是那么的容易。所以如果你用phoengap开发的应用跑起来慢的话。不要说pheongap开发的app慢，这和phoengap没有任何关系，因为phoengap不负责你的应用快慢，你的应用款慢取决于你用什么html5框架开发

下面从7点出发告诉大家如何提高pheongap的开发性能，如何开发高性能的phoengap应用

1.首先得选一个不错的javascript移动app开发框架

这是最重要的一个。有团队1000多个小时创建JavaScript移动app开发框架，让开发者创建移动应用程序更容易和更快，他们考虑很多潜在的性能问题，所以他们的框架非常优秀，比如ionic

如果你不使用框架创建一个HTML5的移动应用程序，这种方式不是不行，只是你考虑的东西太少，所以性能会非常差（大多数情况下），或者你会花大量的时间来写一个应用，还不如用现成的html5移动app框架

2.优化CSS 动画效果animations

css的过度效果对app的性能影响特别大，不过我们用别人的框架的话这些都注意到了

错误的方式BAD:

.el {
     top: 0;
     transition: 200ms top;
}

.el .animated {
     top: 20px;
}

正确的方式GOOD:


.el {
     top: 0;
     transition: 200ms transform;
}

.el .animated {
     transform: translate3d(0, 20px, 0);
}

3. 优化点击300ms的延迟

任何时间，任何在用户点击您的应用程序，浏览器应用程序会有 300ms的点击延迟，所以你需要解决这一延迟。
像ionic这一的框架已经对这个有优化

4. 使用离线存储技术

有些变化少的东西，我们就用离线存储技术把它存储到本地，1. 可以减少服务器的请求，2.可以加快访问速度

5. 使用后台任务，或者使用异步请求

6. 减少js dom操作

7. 使用CrossWalk

您开发的在垃圾的应用程序，如果使用Crosswalk打包，那么他的性能也最少能提升3-5倍

Crosswalk采用Chromium内核并不断地快速演进(六周一次更新)，使基于Crosswalk的Web应用充分享有Chromium的功能与性能优势，以及较好的平台一致性。