Polymer 0.8 带来了性能的提升,也包含破坏性的变更

  • Abel Avram
  • 邵思华

2015 年 4 月 12 日

话题:开源JavaScriptGoogle语言 & 开发

Polymer 团队推出了Polymer 0.8 的 alpha版本,其中包含了“建议包括在 1.0 版本中的 API”,但同时它“与 0.5 版本中的 API 不相兼容”,存在着许多破坏性的变更。这个类库的新版本在文件尺寸和性能方面都得到了优化,而它的特性还没有全部完成。

Polymer 0.8 中包含了一个Shady DOM特性,这是它自己实现的一套 Shadow DOM 的 polyfill,最初是由webcomponents.js所提供的。因此用户可以选择导入这个更小的webcomponents-lite.js文件,Shady DOM“对速度进行了优化“,并且希望避免“shadow DOM 这个 polyfill 所带来的复杂性、庞大尺寸、性能缺失以及侵入性。”

新版本中不再使用polymer-element标记,而是用dom-module标记取而代之,正如以下代码片段所表现的一样,它的作用是定义并注册某个元素:

<dom-module id="hello-world">
  <style>
    div { color: red } 
  </style>
  <template>
    <div>Hello World!</div>
  </template>
</dom-module>

<script>
  Polymer({is: "hello-world"});
</script>

原本在模板中的样式也被转移到模板之外了,正如以上示例所显示的一样。

Polymer 0.8 使用了一个单一属性集合的对象,以定义属性的观察者和计算属性。无论是否出现在属性对象中的所有属性都可以与数据进行绑定。由于使用了生成的属性访问器,因此数据绑定系统变得更易于使用,而调试也变得更简单和快速。在属性对象中的值域中定义了默认值,可以选择直接提供某个数值,也可以选择调用某个函数以返回数值。

Polymer({
  is: "my-component",
  properties: {
    observed: {
      type: Number,
      value: 100,
      observer: 'observedChanged'
    },
    product: {
      computed: 'multiply(x,y)'
    }
  }
});

要了解所有破坏性变更的完整列表,推荐阅读一下迁移指南中的内容。要重点指出的是,0.5 版本中的元素尚未完成移植,但在最终版本中会确定将所有元素移植。而关于对 0.5 版本未来的支持,该团队是这样说的

我们已经意识到目前有许多项目依赖于 0.5 版本中的功能,而且在所有的元素都完成移植之前,这些项目无法转而使用 0.8 版本。我们将持续关注新的 pull request 并进行合并,直至所有元素都完成移植为止。但是,我们目标是将 0.8 版本作为新的基准,全力打造这个高性能、适用于生产线上的新版本。如果 0.5 版本还有任何增量发布,只要有必要,我们都会通过一个新的分支发布该功能。

根据团队的基准测试结果来看,Polymer 0.8 的启动时间快了 4 至 8 倍,在 Chrome 上也是如此。它的资源占用也有明显减少。如果想要深入了解 0.8 版中的新特性,推荐你阅读一下开发者指南

有大量的的新特性是针对 Polymer 1.0 版本而开发的,这些特性中有许多还无法运行,或只能部分运行,包括:内容体安全策略、支持手势、更好的 Shady DOM 表现、跨 scope 的样式、更多的模板特性、数据绑定调试工具、基准测试等等。在 0.8 版本中已经支持了 HTML 元素的继承,但对于扩展自定义元素的支持则推迟到了 1.1 版本,原因在于“由于我们在 0.8 版本中进行了一些性能方面的改进,变相造成了这一功能在新版本中的实现比起在 0.5 版本中要面临更大的困难。”

查看英文原文:Polymer 0.8 Comes with Performance Improvements and Breaking Changes

开源JavaScriptGoogle语言 & 开发