Sencha Touch 2 的新特性

翻译 2012年03月25日 11:35:06

Sencha Touch已正式发布新的版本Sencha Touch 2,并同步更新了网站的界面、API文档及2.0的例子。Sencha Touch是什么?在这里先做一下简单的介绍。Sencha Touch是一个基于HTML5标准实现的面向移动开发的javascript框架。其继承于Sencha(原Ext JS)这个Web上的js框架。相信很多人对这个东西并不陌生。

Sencha Touch刚发布的时候,已经吸引了不少人的关注。现在Sencha Touch 2正式发布,让我们看看官方如何给我们介绍它的新特性。

Sencha Touch 2.0是Sencha Touch一个最重要的版本升级。这个发行版本最关注的问题是性能--让应用在尽量多的设备上运行得更快。为了让应用启动得更快,我们提供了一个更快速的初始化渲染器和布局,并且当设备旋转的时候可以马上重新布局。下面是一些其他的值得关注的功能增强:

  • 全新的滚动条,针对各种平台进行了优化,使之更快速--特别在Android的设备上。我们优化了渲染过程和使用了新的技术重用已经存在的组件,而不是重新初始化一个新的。
  • 来源于Ext JS 4的很多创新,包括先进的新的Class体系、可重构的组件和改进的应用架构。
  • 增加了支持设备的范围,降低对针对WebKit支持的单一性。建立一个强壮的平台,让我们在之后能支持更多的设备。

下面,我们更详细地介绍SenchaTouch 2 的提高。

 

更小、更快的布局引擎

提供了一个非常灵活的设计体系,让它容易为各种形状和大小的设备设计应用。版本2带来一个布局引擎,它运行起来更像浏览器的CSS优化引擎。其结果就是在以下几个领域中极大地提高了性能:

  • 应用在启动时更快地渲染和布局。
  • 当旋转设备时,比用Sencha Touch 1.x设计的应用更快地更新屏幕(的布局显示)。
  • 布局引擎变得更小,结果就是让下载变得更快。

 

在新的布局引擎下,支持全部SenchaTouch 1.x 所使用的布局配置选项。因此,你无须改动任意一行代码。

 

(新的布局引擎)全方位的大量提高了布局的性能。通过控制应用在页面上弹出窗口变得更快,给人更流畅的体验。最引人注目的改进,是当改变设备的方向时,新的布局引擎快得让我们必须使用一台高速相机去测量它。下面是Kitchen Sink按钮例子运行于1.x和2.x,减速于1/4的速度:

  

 

更强大、更智能的核心

Sencha Touch受益于与Ext JS共享一个开发环境。ExtJS 4带来一系列新的改革,现在被纳入到Sencha Touch中去,包含以下内容:

  • 升级了Class体系,支持动态加载和依赖关系。支(dynamic loading and dependencies)
  • 支持类配置成为一个核心既概念--为自由、整洁和一致的API提供getters和setters方法

 

 

更快的启动速度

我们对1.x版本的启动时间不是很满意,因此我们优化了启动时我们可以优化的任何东西。目前为止,我们在一系列的设备上测试我们的Kitchen Sink这个示例时,看到了在启动时间上有10%至25%的改进。这个APP相当大,它展示了框架(Framework)里几乎所有的组件。在很多设备上,(在启动时)在2.x的版本里,它差不多可以快一秒:

 

 

类体系和应用(Class system and apps)

Sencha Touch 2 应用了源于Ext JS 4的,新的,强大的类体系。这提供了以下全部好处:动态加载、只需要引用你用到的类就能进行智能编译、混合类型、可配置性和新引擎其它新特性。

我们已经从Ext JS 4的应用架构中带来了ComponentQuery和产品编译支持。

 

配置驱动式组件

新类体系其中一个好处是可以通过配置--简单的属性进行装载,这些(属性)都能自动提供getter和setter方法,并且可以设置默认值,和更多。

 Sencha Touch 2 通过框架利用了配置系统。任何时候你都可以重新设置任意一个类中你已知的任意属性。

 例如,当我们实例化的时候可以给label属性设置一个TextField值,并且知道我们在后面可以很容易去改变它的值:

var text = Ext.create('Ext.form.Text', {
   label: 'My Field'
});
 
//anything we can configure also has asetter function
//its name always follows the setConfigNamepattern
text.setLabel('Another Field');


可配置性是伟大的,因为它为类提供了一个非常清晰的API。 任何你看到的在各个类的API文档里配置选项都是通过标准的getter和setter方法去完成的。


提高了MVC的能力

Sencha Touch 1 通过简单的方法组织你的应用实现一条mvc的工作线。Sencha Touch 2 相当大地改进了这种方式,并全面支持history,和通过一种强大的新的方式去控制组件,和根据不同的屏幕大小通过一种强大的新的方式去定制你的应用。


更好的android支持

Sencha Touch 2 在Android上带来了很大的性能提升,特别在滚动和动画方面。在Sencha Touch1.x里,Android设备在滚动大的列表时显示特别缓慢。动画波动性很大和展示出不好的视觉效果。

Touch 2 提供了Android自己的优化机制,更顺畅更快地实现滚动和流动性好的动画。

 


本地打包

一个开发者在编译自己的SenchaTouch应用时经常会问到的问题:“我如何将我的应用展示在用户的面前?”

在很多情况下,编译和发布应用到网站开发者和用户期望的。在其它情况下,将应用投入到app store是展现给用户的最快方式。

Sencha Touch 2可以非常容易地将应用编译和发布到Android Marketpalce和iOS App Store。



原文出处:http://docs.sencha.com/touch/2-0/#!/guide/whats_new

相关文章推荐

Hands-On Sencha Touch 2

  • 2016年11月28日 11:33
  • 22.19MB
  • 下载

Sencha Touch 2 的运行环境 案例

天翼空间·应用工厂— 移动互联网的开发者梦工厂! 天翼商城 网站导航 http://www.189works.com/article-53553-1.html Touch 2 ...

phonegap与sencha touch2的js库

  • 2012年07月08日 15:57
  • 192KB
  • 下载

sencha touch笔记(2)——ExtJs语法基础

因为sencha touch的语法大部分是基于extjs的,而extjs大部分是基于json的,所以好好预习一下extjs的语法还是很重要的。extjs是封装的javascript的一个框架,相比原生...
  • SDDCCCC
  • SDDCCCC
  • 2013年12月08日 15:50
  • 1570

Sencha Touch 2入门教程之MVC

  • 2013年06月07日 14:24
  • 90KB
  • 下载

Sencha Touch Cookbook(PACKT,2ed,2013)

  • 2015年09月20日 23:40
  • 5.83MB
  • 下载

Sencha Touch 2 快速入门系列(四)-- 组件之标签面板(TabPanel)

本文已添加至Sencha Touch 2快速入门系列索引:http://blog.csdn.net/ardy_c/article/details/7544470 转载请注明出处:http://b...
  • ardy_c
  • ardy_c
  • 2012年05月07日 13:14
  • 5929

Sencha Touch 2 -- 页面布局

  • 2013年07月03日 15:29
  • 5KB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Sencha Touch 2 的新特性
举报原因:
原因补充:

(最多只允许输入30个字)