Adobe AIR 2.5 中的HTML, HTML5, CSS 和JavaScript 新特性 [译] 上

最新推荐文章于 2024-08-22 08:00:00 发布

原创最新推荐文章于 2024-08-22 08:00:00 发布 · 213 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#AIR #HTML5 #CSS #HTML #Adobe

AIR 开发与应用专栏收录该内容

32 篇文章

订阅专栏

Adobe AIR 2.5 引入了许多 HTML5、CSS3 和 JavaScript 的新特性，包括改进的 Nitro JavaScript 引擎性能、增强的 CSS3 支持、完整的 canvas 标签功能等。这些更新显著提升了基于 HTML 和 JavaScript 的应用程序的性能。

Adobe AIR 2.5 中的HTML, HTML5, CSS 和JavaScript 新特性上

原文：What's new about HTML, HTML5, CSS, and JavaScript in AIR 2.5?

Adobe AIR 2.5 发布了一些新的API，同时其内部的HTML 引擎也增加了新的特性，这一变化主要是因为引入了新的WebKit版本。该版本与Safari 4.0.3 中使用的版本相同，虽然最新的WebKit分支（Safari5，5.0.1和5.0.2）包含了一些安全修复，然而大多数情况下，可以拿Safari 4.0.3作参考来衡量AIR 2.5中的WebKit 的行为。

这篇文章提供了新功能的概述，并强调Adobe AIR 2.5 中支持的HTML的相关功能和对应的WebKit版本的差异。新一代的Web浏览器还支持快速的JavaScript引擎(谷歌的V8，SquirrelFishi的WebKit和Mozilla的TraceMonkey)和HTML5。

版本化WebKit行为

AIR 2.5中HTML引擎行为有一些变化。为了防止AIR 1.5应用程序不能正常运行，这种行为已经根据命名空间和部署描述符被版本化了。这些被版本化的变化包括：

1) 如果HTML文件并没有<head>元素，自动隐式创建。在AIR 1.5不会隐式创建。

2) 如果XMLHttpRequest去请求一个不存在的资源，则会以DONE状态结束，并返回一个无效的HTTP状态码(0)来表示失，在AIR 1.5不会报告任何错误。

3) 如果一个XHR 请求使用POST方法并且没有内容(即 content.length == 0)，则该请求不会自动转换为使用GET方法，在AIR 1.5中却能转化。

新的HTML，CSS和，JavaScript特性

随着WebKit的更新, AIR Runtime也改进了对JavaScript，CSS3，canvas 和data：urls 的支持。

Nitro JavaScript引擎(SquirrelFish Extreme)

新版本的WebKit支持一个修正的JavaScript引擎 SquirrelFish Extreme，这一版本与以前版本相比性能有了巨大的提高。因此，基于HTML / JavaScript的AIR 2.5 应用程序在没有任何代码修改或重新打包的情况下，运行速度就提高了两倍。表1给出了AIR 1.5.3，AIR 2.5和Safari 4.0.4性能的比较，以Google V8和 WebKit SunSpider作为基准。

操作系统/基准	AIR 1.5.3	AIR 2.5	Safari 4.0.4
Windows XP/V8 (值越大性能越好)	158.6	1157.8	1509.4
Windows XP/SunSpider(值越小性能越好)	3286.4	1625.4	666.2
Mac OSX 10.6/V8(值越大性能越好)	374.4	2522.8	2619
Mac OSX 10.6/ SunSpider(值越小性能越好)	1758.8	608.2	374.4

表1 JavaScript引擎的性能比较

从表中可以看出AIR 2.5 和Safari 版本有速度差别，因为AIR runtime优先考虑runtime 大小，而Safari 优先优化速度。

改进的CSS3支持

WebKit包含了很多的CSS新属性。有些是CSS3草案的一部分，有些是WebKit的特定扩展。

1) 2D transformations，animations和transitions：

二维转换通过- WebKit-transform*和- WebKit-perspective*属性和相关的转换功能应用到html 元素中。

- WebKit-transition*属性可以被用来实现CSS属性，包括（但不限于）颜色，位置和尺寸的平滑过渡，可以和-WebKit-transform*属性和方法并用一起来创建简单动画。

Animations 把transforms 和transitions的概念又发展了一步，允许开发人员通过声明的方式使用关键帧来修改行为。采用CSS属性- WebKit-animation* 和@keyframes规则。

2) 滚动条样式：

WebKit的推出了一套新的CSS属性，允许用户给滚动条换皮肤和进行个性化设置。可以通过- WebKit-scrollbar*来访问这些属性，即─WebKit-scrollbar，- WebKit-scrollbar-button，-WebKit-scrollbar-track，- WebKit-scrollbar-track-piece，-WebKit-scrollbar-thumb，-WebKit-scrollbar-corner和 WebKit-resizer。

在典型的Web应用程序使用这些属性设置皮肤可能有问题，因为有些浏览器并不支持(不是WebKit内核或者WebKit版本太低）。但是在AIR应用程序，比起用JavaScript的模拟滚动条利用这些属性是一个更好的选择。

3) 文本列支持：

支持- WebKit-column-count和- WebKit-column-gap属性，在一个容器中文本可以跨任意数量的列。

4) zoom：

AIR 2.5支持CSS3 zoom 属性，可用于指定元素的放大,更改zoom属性可以起到动画效果。

5) Web fonts：

通过css @font-face 声明可以实现Web 字体，它允许字体文件作为资源和其他的资源文件一起放在服务器一端来动态渲染页面。注意 AIR 2.5只支持TTF 和OTF Web字体。

6) 最新<canvas>标签增强

AIR 2.5 支持<canvas> 标签的全部功能，包括imageData API(getImageData()，createImageData()和putImageData())和在css 样式表中使用canvas 对象作为背景图像。

7) Data:URLs

AIR 2中已经支持了data:urls 语法。但是因为潜在的安全风险有一些限制。Data：urls可以在以下情况中使用：

l 只有当它指向一个AIR runtime支持的文件类型时。(JPEG，PNG，BMP和XBM，ICO)唯一支持的编码是Base64。任何其他的内容(包括脚本和Flash Player的内容)都无法通过data:urls语法嵌入页面。

l 仅在那些期望是图片的地方。这包括图片标记(<img src="https://img-blog.csdnimg.cn/2022010611520444961.png" />)，图像类型的输入标签(<input type=”image” src=”data:image/png;base64,…” />)，和CSS规则允许的图片url(background:url(‘data:image/png;base64,…’);)。

请注意 AIR 2.5 中，对于data:URLs 的安全性限制已经更新，目前还允许在@font-face声明中使用此语法。基本上，可以用data:URL语法在CSS样式表中在@font-face 声明中，使用src 规则嵌入字体，例如：

@font-face {

font-family: “MyDataFont”;

src : url(“data:font/opentype;base64,…”);

}