如何优化 Sencha Touch 性能
发布网友
发布时间:2022-04-12 00:30
我来回答
共2个回答
热心网友
时间:2022-04-12 02:00
优化应用程序的启动时间:
使用sencha cmd 的build工具打包和压缩所有需要的js文件成一个单独的文件,如app-all.js
压缩你的JS和CSS文件。删除任何未使用的的JS函数或CSS mixin的(通过SASS/Compass 能很容易地检查)。有关详细信息,请仔细阅读http://www.sencha.com/blog/an-introction-to-theming-sencha-touch
动态加载外部JS文件,在这里已经有一个很好的话题:在Sencha Touch 2 里什么是正确加载外部JavaScript的方式
优化应用程序的性能:
保持你的DOM结构尽可能小。不活动的view应当予以销毁(以后如果需要的话动态添加到容器中)。
避免使用CSS3属性,因为他们在Android设备上是很慢的。
对于任何scrollviews,l在Android上应禁用overscrol滚动效果。我已经在Android设备上测试过许多Sencha Touch2 应用,overscroll滚动效果因为延迟和滞后严重导致不愉快的经验。 (测试过Nexus S,Galaxy Tab的,和一些HTC手机)
压缩js和css,删除无用的js方法和css
启用硬件加速器
Sencha Touch 跟Ext js一个提供了丰富且高级的组件让我们能快速的开发出一个跨手机平台而且
很绚丽的产品,这听起来不错,但很快我们发现了一个严重的问题,手机上的效果根本没有在PC上用
chrome打开的效果一样让人有刷刷的快感,甚至让人痛苦. Sencha Touch和ext一样,组件是类式继
承的,大大降低了使用和学习的周期.但缺点也是很明显的,你每增加一个组件,内存消耗就增加很多,
可能你已经使用minify/JSBuilder/YUI compressor等工具压缩过你的代码了,如果性能还不佳,那么
可以看看以下是个人的一点建议
1.每个组件都应该考虑它的xtype,如果可以使用container就不要使用一个panel了
2.list一列的个数显示一屏就可以了,list有很多高级的功能,但性能非常的差,只能通过减少加载
项来解决
3.尽量不要使用tbar/bbar,Sencha Touch的提供的toolbar功能强大,按钮也很易用,但使用的DOM元
素也非常的多,自己写一个bar是非常必要的
4.把不在置顶的view中的DOM给删除,有时候,我们的项目中有好几个view,但我们一时间内是不可能
同时查看两个view的,应该把其他view的DOM元素给释放了
从上面看来,性能优化的关键是控制DOM元素的数量,但Sencha Touch还会对一些元素绑定事件,如何
开始就不显示这些元素,那么内存开销会更低