`
webdev2014
  • 浏览: 675481 次
文章分类
社区版块
存档分类
最新评论

Ext JS 4倒计时:开发者预览版

 
阅读更多

作为Ext JS团队的代表,我很高兴地宣布第一个Ext JS 4开发者预览版 发布了。Ext JS 4是到目前为止,我们所做的改动最大,有史以来最先进的Javascript框架。从生成HTML代码到类系统,框架的每一个领域几乎都被更新了。我们统一了Api,添加了令人难以置信的新功能和改进了整个框架的性能。

对Ext JS 4,我们有三个主要目标: 速度、 健壮性和易用性。我们想要速度更快,并尽可能在每个浏览器上足够健壮,而且很容易学习和使用的框架。为了实现这一目标,我们整个框架回到画板,以及回到我们曾将创建的的速度最快、 最防弹的版本。最重要的是,我们已经成功做到这一点,并坚持了走使用“the Ext JS way”的核心经验来写应用程序。

今天的预览版(包含例程)包含了最终版几乎所有的组件。我们已经将一些闪光点重新打磨,尤其是树和Accordion。我们也将Ext JS 3默认的蓝色主题移植到了新的系统,这项工作通过全新的SASS主题系统轻松的完成了。有如此多的更新,实在不可能在一篇博客文章中说明,因此我们将继续在未来数周内书写我们的Ext JS 4倒计时系列。

Ext JS 4开发者预览版今天已经可以下载了。现在就下载

你已经知道的框架

Ext JS一直致力于开发用于创建Web应用程序的领先Javascript框架,至今已经是第4版了,我们的信念至今未变。对任何重大的升级来说,连续性是最重要的一个方面,如API的连续性、外观和感觉以及向后与以前版本的兼容性。在Ext JS 4,我们已经采取了两个重要的步骤来实现这一目标,

首先,Ext JS 4是完全沙箱的,没有扩展的原生对象和对全局变量的依赖。未来证明这一点,我们已经采用两个最好版本的Ext JS,并将它们组合在一个单一页面里。我们使用了Ext JS 3中的桌面例子,在桌面中,你可以看到Ext JS 4生成的图表,就像它们是桌面的一部分。你可以亲自去这里 查看一下。

第二步就是提供强大的旧式层以帮助你升级Ext JS 3.x的应用程序。我们从今天开始,将会出一个详细描述版本之间的差异的指南,并作为我们的部署持续进行更新。除了指南,我们还会提供一个文件让你拖进你的Ext JS3.x应用程序来帮助你升级应用程序。我们将尽快通过另一篇文章来讲述这两个问题。

相当棒的新特性

图表

上星期我们介绍了Ext JS 4的图形和图表包。我们知道这是对Ext JS 4最值得期待的部分之一,但是没想到会其受欢迎程度是那么的令人难以置信。对没有看过原文的人,我们再说一次,Ext JS 4不需要任何插件,通过SVG、Canvas和VML就可以绘制出华丽的图表,而且该图表可以通过集成的新的数据包在任何浏览器上实现动画。

数据

数据包在版本4中得到了巨大的升级,它可以应用程序中加载和保存所有数据。和新的模型类一起,可以很容易的处理客户端上任何数据种类的数据。验证在模型级实现,新的关联API可以让你在模型之间建立关系。

扩展的代理类现在可以直接使用在模型上,这意味着你不需要使用Store加载和保存数据,而且localStorage代理可以让你通过一行代码在客户端保存数据。现在在客户端就可以实现数据的多列排序、过滤和分组,而新的Reader事件可以处理嵌套数据。数据包是框架中使用最广泛的组件,我们已经在近期的文章中介绍过:

Grid是Ext JS的焦点之一。它是一个令人难以置信的通用组件,根据你需要格式,提供了大量数据的一次查看的好方法。在Ext JS 4中,我们已彻底修改,令它更快、更轻、更容易定义。

我们开始大幅减少Grid的HTML标记。在以前的版本中,Grid始终渲染自定义的标记,如行扩大、 编辑、 列锁定和其它标记。在版本4中,Grid相当聪明,它只渲染基于你的功能需要开启的标记。在大多数情况下,Ext JS 4比Ext JS 3产生的标记减少了20%,这带来了巨大的性能优势。事实上,Grid是如此之快,甚至胜过了现在不推荐使用的3.x的ListView。

关于Grid会有许多话题,我们将会在发表一篇介绍它的文章。最后要注意的是,Tree现在是从Grid扩展出来的。这不单减少了框架的大小,而且还使它非常容易的使用自定义Grid的方式自定义Tree。我们正在做Tree的收尾工作,期望可以在下一个版本中看到它们。

表单

和Grid一样,表单在Ext JS应用程序中也会经常使用。在版本3,我们可能已经受够了Formlayout,因为它很难获得正确的形式。Ext Js 4彻底的删除了FormLayout,使你能够在layout中任意布置你的表单。表单也不再限于DOM中,这样就解决了以前不能跨越多个标签的问题。

通过新的FieldLayout,任何组件都可以放置在表单中,并给予一个标签,甚至错误信息。这是因为字段的定义已被移动到Mixin(请看博客文章Ext JS’s new class system )。你可以将一个Grid、Tree或者其它组件增加到表单中作为一个多项选择器。有一些例子演示此版本中新的表单功能。

布局

布局系统是Ext JS中最强大的部分之一,它处理应用陈旭中每个组件的大小和位置,并在将其保持在适当位置以让你的用户顺利完成它们的工作。Ext JS 2的布局速度很快,但是它不够灵活,虽然我们认为它可以做到。在Ext JS 3中,我们使用了新的布局盒子,虽然变得很灵活,但是我们牺牲了性能。

在Ext JS 4,我们终于实现了两全其美,性能更好,更灵活的布局,而且还新增了DockLayout对象。有兴趣的,可以看一下Jamie在SenchaCon 2010期间发表博客文章《Ext JS 4 Layouts 》,里面解释了所有与布局的有关更新。

无障碍

写无障碍的Javascript应用程序是很困难的。在Ext JS 4中,我们采用了以下3个措施实现了无障碍应用程序,脱离了苦海:

ARIA支持。所有组件都采用ARIA属性标记,这样就可以使屏幕知道如何渲染页面。
焦点管理。在整个应用程序中启用键盘驱动导航。
高对比度主题。在黑的背景上使用亮的文字,这样使有视力障碍的用户更容易阅读。

无障碍和TRL支持对我们来说都很重要,它们将会作为新功能出现在即将推出的版本中。

主题

我们得到的最大请求就是在应用程序轻松制作主题。根据我们开发Sencha Touch的经验,在Ext jS 4中,通过功能强大的SASS和Compass,使我们的框架更容易制作主题。每一个框架的外观方面,都可通过简单的调整颜色变量轻松自定义。

如果你还没有见识过SASS和Compass的威力和灵活,那么你可以看一下Dave Kaneda’s的文章《theming Sencha Touch 》。我们将很快发表标题为《 theming Ext JS 4》的文章。如果你实在急不可耐,那么可以在SenchaCon 2010中与 Rob Dougan’s 讨论此问题。

Ext JS 4路由图

今天发布的是Ext JS 4最终版本的几个版本中的第一个版本。我们期望在接着下来的几个星期每周发布一个新的版本,而第一个beta版本将在两周后发布。Ext JS 4你们已经等待很久了,我期望框架的变化能让你们兴奋。请浏览这些例子 ,并在评论中告诉我们你们的想法。

Written by Ed Spencer.

原文:http://www.sencha.com/blog/ext-js-4-developer-preview/

分享到:
评论

相关推荐

    Ext.JS.4.First.Look(第1版)

    中文名: Ext JS 4 First Look (第一版) 原名: Ext JS 4 First Look 作者: Loiane Groner图书分类: 软件 资源格式: PDF 版本: 英文文字版/EPUB 出版社: Packt Publishing书号: 1849516669发行时间: 2012年01月 地区: ...

    Practical Ext JS 4.pdf

    Chapter 4: Controls and Layout Chapter 5: Working with Data Chapter 6: Data Controls Chapter 7: Drag and Drop Chapter 8: Theming and Styling Chapter 9: MVC with Ext JS 4 Chapter 10: Extending, Unit ...

    [Ext JS] Ext JS 实战 第2版 英文版

    ll learn the best practices for building and scaling full featured web applications including how to customize and build Ext widgets Fully revised for Ext JS 4 0 ☆ 出版信息:☆ [作者信息] Jesus ...

    ext4解压工具和操作方法.rar

    包含3个工具:make_ext4fs、simg2img、kusering.sh。 1. 解压system.img为system.img.ext4。命令:simg2img system.img system.img.ext4 2. 创建system.img.ext4挂载目录tmp; 命令:mkdir tmp; 3. 挂载system....

    深入浅出Ext JS第2版.pdf下载地址

    深入浅出Ext JS第2版.pdf(4/4):http://download.csdn.net/source/3554013 深入浅出Ext JS第2版.pdf(3/4):http://download.csdn.net/source/3554012 深入浅出Ext JS第2版.pdf(2/4):...

    ext4环境搭建

    基于vs2012的ext4开发环境搭建,

    Ext JS权威指南

    全书一共22章:第1章简要介绍了学习ext js必备的基础知识、json、ext js 4的新特性,以及其开发工具的获取、安装与配置;第2章介绍了ext js 4的获取、ext js库的配置与使用、语法、本地化,以及一个经典的入门示例;...

    [ExtJS] Ext JS 4 学习指南 (英文版)

    [Packt Publishing] Ext JS 4 学习指南 (英文版) [Packt Publishing] Learning Ext JS 4 (E-Book) ☆ 出版信息:☆ [作者信息] Crysfel Villa, Armando Gonzalez [出版机构] Packt Publishing [出版日期] 2013...

    Ext JS 7.6.0.41 SDK

    # Sencha Ext JS This is the Sencha Ext JS Framework Package, or just "ext" for short. Release Notes for Ext JS 7.6.0 Release Date: Thu Apr 28 2022 Version Number: 7.6.0.41

    Learning Ext JS 4 pdf

    Learning Ext JS 4 by Crysfel Villa and Armando Gonzalez (Oct 8, 2012) $49.99 Paperback Order in the next 13 hours and get it by Tuesday, Mar 19. More Buying Choices - Paperback $46.48 new (17 ...

    Ext官方中文教程列表

    4BTutorial:EXT简介 4 5BTutorial:Ext 2简述 15 6BTutorial:EXT新手建议 27 EXT新手建议:建立自己的工具箱(Toolkit) 27 7BTutorial:怎么轻松地进入Ext的世界 28 8BTutorial:Javascript中的作用域(scope)是什么?...

    深入浅出Ext.JS (4)

    ext js是一种用javascript编写的功能强大的ajax框架,可用于开发绚丽多彩的富客户端ajax应用。本书是ext js领域内的经典著作,由浅入深、循序渐进地对ext js各方面的知识进行了全面而系统的阐述。全书由一个可以引领...

    Ext js 4.1

    这是Ext js 4,对于现在开发者来说,版本有点低了,但是对于初学者来说,是不错的版本。在Ext JS官网上有很好用的API,大家可以参考

    Ext4新概念:类系统

    Ext4新概念:类系统

    EXT JS 4自学手册

    EXTjs4自学手册.docx,适用用新手学习EXT JS 4

    ExtJS和Sencha touch可用到的倒计时插件

    用于ExtJS和sencha touch中用到的倒计时插件

    Practical Ext JS 4

    After a quick refresher on some JavaScript basics, you will get to grips with Ext JS 4’s OO concepts (such as mixins) and familiarize yourself with its UI components and layout. You'll learn all the...

    EXT JS ExtJS 4

    EXT JS 4 正式版 发布 Posted 周三, 04/27/2011 - 20:27 by admin 我很自豪能代表Sencha和ExtJS团队和大家成功的分享了ExtJS 4的预览版、3个beta版和今天发布的正式版等5个版本。 ExtJS 4从创建之初,就以最全面...

    EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档

    EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档...

Global site tag (gtag.js) - Google Analytics