一、Web Components

首先从Web Components开始，今年在Google I/O谷歌发布Android L预览版的时候，也是Google Design上线的时候，那时对Material的风格印象非常深刻。但是无奈Android版没有提供兼容库去实现，在某个巧合看到了Polymer，于是去了解了一下看起来非常有前途的Web Components。

仅仅从名字就能看出是web组件的封装，首先不论基于js动态生成还是提供css样式进行渲染的方法，目前很多前端框架如bootstrap，都已经提供了非常简单实用且强大的框架支持。但是在使用过程中会深切的感受到，由于框架资源与自定义资源属于同一个级别，使用中需要去详细了解框架提供的样式和JS方法。不仅仅是为了风格统一和资源重复利用，更重要的是为了避免与框架的冲突。

1
2
3
4
5
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu2">
  ...
  <li role="presentation" class="dropdown-header">Dropdown header</li>
  ...
</ul>

而Web Components提出了一套非常详细和完善的标准，初看起来简直是前端开发者的福音。使用link import导入控件，直接使用控件指定的标签即可简单高效的使用组件化的思想。在浏览器启用Shadow DOM特性支持的前提下，控件标签会被Shadow DOM封装成一个独立的控件。并且和Web界面是相互隔离的，即我们在源代码中式无法看到控件的内在细节，展现给我们的仅仅是自己写的标签而已。

如上图，自定义的标签封装和隔离了web界面，不仅仅是的其本身的样式信息与主界面分隔开来，互不影响。而且可以自带脚本语句，相互嵌套引用等。哪个开发者看到这些不会心动？实现Web Components的框架有许多，在这里仅仅对Polymer进行简单的说明。

一、Google Polymer

Google Polymer框架，在2013年的Google I/O大会上发布。其来自加盟谷歌的原Palm webOS的Enyo框架团队打造，使用了最新的浏览器特性。但是对于目前仍然处于开发阶段的框架，又如何吸引开发者去使用呢？以前几乎没有，但是现在Material design推出之后，也许会有所改观。

特别是在Polymer的Paper elements支持Material之后，其效果的在线示例(已缓存在本网站)更是达到了前所未有的惊艳，特别是其反馈效果。其提供的基本控件样式、控件交互动画，布局动画和大量的控件，为在Web端实现Material效果提供了极其便利的途径。

这样的最大好处就是Android 5.0发布之后(好像从11月3号推迟到了11号)，新的一轮应用改版热潮中，web端也能简单的实现与Android端相一致的功能了吧。在以InBox为首的谷歌自家应用全线向Material design风格靠拢的时候，甚至是InBox网页版也做到了和Android端高度一致的时候，Polymer依旧处于开发阶段，其未来存在越来越多的不确定因素。

这一切的开始从我打算做一个Android app的服务器端开始。经过一段时间的选型之后，后台决定使用python/tornado + mysql。前端在看到正好Paper elements支持了Material design，于是根据之前的一些了解决定试试Polymer。但是随着设计和实现的展开，一步步阅读Polymer文档之后，我发现这个现在真的不适合使用。特别是选了python这种节约人参的语言之后，当然了Polymer目前依旧可以作为一个实现性的工具进行小规模使用。相比之下谷歌的另外一个框架AngularJS，他还是太年轻了，并且AngularJS也推出了对Material design的支持。但是AngularJS的学习曲线真的是太陡峭了，虽然思想是如此的先进，功能是如此的强大。

1
2
3
4
5
6
7
8
9
10
<polymer-element name="tag-name" constructor="TagName">
  <template>
    <!-- shadow DOM here -->
  </template>
  <script>
    Polymer({
      // properties and methods here
    });
  </script>
</polymer-element>

在此，对polymer的使用不做过多的说明，但是到目前为止我依旧记得第一次打开Polymer Project的网站时给我带来的惊喜。polymer目前依旧处于开发阶段，其本身依旧存在很多问题，而且还有浏览器兼容性这个暂时无法解决的难题。联想到谷歌无数夭折的项目，不禁对Polymer的未来… …

但是我个人依旧希望Polymer可以成功。