Sencha Touch 2.1 更新


啥更新了?

Sencha Touch 2.1 将是 Sencha 移动框架的下一新版本。2.1包括了下列关键更新:性能上的极大改进、正式支持图表、高级列表 List 控件,以及通过 Sencha Mobile Packager 的增强原生支持。

性能改进

在 Sencha Touch 2.0 中令到开发者一点不爽的地方在于,进行内嵌布局的时候遭遇极大的性能问题。后来我们发现,只要把模板割裂开来,而且尽可能提供更多的信息给浏览器知道,即可改善该问题。这点优化不会影响API 层面,但 DOM 结构以及某些 CSS 样式类就会不同。开发者在升级 Sencha Touch 2.1 的时候请注意这个变化,具体就是某些 CSS 选择器应该更新一下。

改进的地方还不止一点,当组件或元素控制可视之时则再不需要遍历 DOM,那是因为使用了 CSS 的 transitionEnd 的事件来检测 painted 事件。既然我们无法在 erased 事件中做到这一点,所以我们建议避免你这样做,因为它可能会降低性能。最后,我们新增了任务队列 TaskQueue 的机制,以便优化读、写的操作尤其批量的方式下的操作,因为批量读写很容易引发 DOM 回流。

Sencha Touch图表
Aggregative Charts

When we try to plot a huge data set directly on the screen, we are possibly plotting hundreds of points within a space of less than a pixel. This will be a huge waste of calculation power considering the cost of algorithms for stroking and filling. Therefore we only keep the minimum and maximum value within one pixel (by width). For example, if a very large data set has 1000 data points that would render to a pixel in width (such as a financial chart), the chart will only render the minimum and maximum value of that data set within that pixel. We achieve this summarization by a preprocessing technique called “aggregation”. By aggregation, we can query the desired simplified data to a given specificity instantly.

To solve this problem, we used a Segment Tree, which is a data structure for swift data aggregation. It requires linear time and space to finish the aggregation and logarithmic time to query. Segment tree also allows record updating in O(log(n)) time, which is very valuable for the future when features such as partial updates might be implemented.
Financial Chart Types

To display financial data using the Chart package, we are introducing two new charts: the Candlestick chart and the Open-High-Low-Close (OHLC) chart. These are both available as the candlestick series in the new Charts package. The Stock App example also includes a 50 day moving average as well.

高级列表组件之无限翻页

1. 新增了一项
2. 有更新一项,前面那一项被“循环再用”

数据量一大,List 组件就吃不消!Sencha Touch 2.1 新的列表就是为了打破这一宿命而来!此外,除了性能问题,控制列表项比以前更容易了,你只要配置好 itemConfig 和 itemTpl 两项就可以动态转为列表项配置结构,只需配置一次。奥秘在于,我们不但重构了 DOM 的结构,而且还重新设计了数据的绑定方式: 数据源 Data Store 和 DOM 元素之间不再一一对应。于是 DOM 结构包括样式肯定有所改变:例如,要修改列表项的内/外边距,你要把这样的 CSS 选择器“.x-list-item” 改为 “.x-list-item > .x-dock-horizontal > .x-dock-body”。看看例子 TouchTweets,可以反映上述的问题,里面都没有了 DataView,直接用新的列表控件替代。另外,例子中你还能看到新版插件 PullToRefresh 和 ListPaging。

原生打包器

Sencha Moblie Packager 包含在新版 Sencha Cmd 中。之前的版本仅是一个 SDK 工具,这次发布新增一个 native 打包器功能。你可以在测试机中、模拟器上面跑你的 apps,Packager 都为你准备好,可试试利用 Contact 联系人的 API 获取电话簿, iOS 或 Android 亦皆

无问题。你可以对 packager 导入 iOS 的 info.plist 原始数据,安卓的话通过 rawConfig 导入 AndroidManifest.xml。根据大家的反馈,例如 packager 非管理员的访问这项需求,我们就实现了,——安装的时候不再需要管理员身份。

可用性

Sencha Touch 2.1 GA 将于十一月发出。请关注我们的博客有关的报道。

作者:Frank
原文:http://blog.csdn.net/zhangxin09/article/details/8117337

英文原文:
http://www.sencha.com/blog/whats-new-in-sencha-touch-2.1/