什么是polymer？

polymer由谷歌的Palm webOS團隊打造，并在2013 Google I/O大會上推出，旨在實現Web Components，用最少的代碼，解除框架間的限制的UI 框架。

Everything is an element,一切皆組件，是polymer的核心思想

polymer 可以通過Twitter的包管理器bower，方便的進行組件（Elements）及包的依賴管理，不必自己從git上下載組件。

polymer分層結構：

    元素層（Elemets）， 分為UI elements（如select、tab）、 non-UI elements（如ajax、animate）

    核心層：polymer.html+polymer.js，是創(chuàng)建polymer element的必要依賴。
    基礎層：platform.js，是平臺兼容，和響應式代碼實現的必要依賴，創(chuàng)建應用必須首先引入它。其中大部分API最終將成為原生瀏覽器API。

通過<link rel="import" href="component-name.html">方式引入組件，即Web Components的Imports規(guī)范。

Web Components是polymer的一個很重要的基礎，我們有必要來了解一下：

Web Components？

它是一些規(guī)范，旨在以瀏覽器原生的方式向外提供組件，它的規(guī)范如下
1、模板（Templates）

     可以將不必立即渲染的元素，不必立即執(zhí)行的腳本放入這里。
2、裝飾器（Decorators）
3、Shadow DOM
4、自定義元素（Custom Elements），

     實現自定義html標簽，及屬性。擁有同原生組件一樣的生命周期
5、Imports，

     指定引入的組件文檔及類型

（并不需要實現它的全部規(guī)范。polymer element的創(chuàng)建、引入是參照這個規(guī)范來的）

Shadow DOM？

是一顆對用戶不可見的DOM元素子樹，即不能在常規(guī)的DOM樹中看到它。它是實現Web Components封裝
的必要能力。但是，目前只有Chrome支持它。它有以下幾個作用：
1、避免頁面不同組件的ID、CSS、JS的互相干擾
2、使得組件便于維護，組件實現的改變不影響其使用
3、加快DOM節(jié)點的查詢速度，Shadow DOM中的元素是不被查詢的。

為了便于索引，不應該將內容（文本）放入Shadow DOM中。
可以使用<content>元素來指定子元素的插入點。

規(guī)范是促進技術良性可持續(xù)發(fā)展的、是形成良好生態(tài)系統(tǒng)的必要條件。這就相當于法律的作用。

網格布局 CSS Grid Layout？

布局經歷了從表格布局到div層布局的變化，如今面對如此眾多的設備，屏幕大小分辨率有很大差異我們期望能夠找到一種方式來實現統(tǒng)一的布局，這就是響應式布局。而響應式布局被寄予厚望的就是，網格布局。
顧名思義，就是用網格來劃分頁面。這里有兩個要求，即多列、可伸縮。
這里的多列不使用浮動來完成，使用grid-columns屬性來完成。
可伸縮的關鍵在于，分數單位fr，指列或者行占剩余空間的比例，x(fr)/total(fr)

如果要實現更加精確的控制，需要引入CSS3中的媒介查詢，@media的支持。以提供在不同設備，不同屏幕大小不同設備方向上的樣式。

網格布局為w3c草案，目前只得到IE10的部分支持（這次IE跑到前面了）。

MVVM模式？

為什么要談這個模式？Polymer中有一個設計原則，Model-Driven Views（MDV），數據驅動模型，而MVVM模式就是這個原則的很好體現。

(這里不舉例子，如果還不能夠理解這個模式，可以看這里，http://www.cnblogs.com/626498301/archive/2010/08/17/1801475.html)

Model-View-ViewModel，相對于MVC模式，Controller被換成了ViewModel。

Model（模型）是一種數據格式約束，它定義了數據應當被如何訪問和組織。從數據存取、數據轉換、數據處理、數據展示都必須依賴于這個數據模型。

View（視圖）通常是指組件的可視部分，數據模型、業(yè)務邏輯一般來說是穩(wěn)定的，有較高的可重用性，但是視圖可能經常更改，

ViewModel（視圖模型）主要用于數據加工（邏輯處理），并為視圖提供數據綁定（將Model的類屬性綁定到View的相應組件屬性上）。

它們的依賴關系是View依賴ViewModel，ViewModel依賴Model，這是單向依賴，這樣View的變更不會對VM，Model有任何影響。但是如果Model發(fā)生改變，就會影響VM、View了。

 “Angular將基于Polymer開發(fā)widget”，這是來自Angular的聲音。而Angular是采用MVVM模式來設計的，這種模式很適合組件開發(fā)，擁有很低的耦合性，便于修改維護。

現實？

目前來說，Polymer是一個面向未來的方案，還沒有產生正式版本，不夠成熟（組件數量，技術文檔，實例，社區(qū)都需要發(fā)展）。

同時，瀏覽器的兼容性上（IE9、10都不能很好支持，即使在Chrome下頁面渲染速度，用戶體驗都還存在一些問題），也需要進一步提升。

暫時看來，Googel的Angular就是開發(fā)成熟組件的不錯選擇。