Mozilla Brick:一個Web組件Polyfill庫

Web組件是一個W3C規範,它旨在使Web開發人員可以定義具備很是豐富的視覺效果和高可交互性且易於組合的小組件。Brick庫提供了新的自定義HTML標籤,從而抽象了用戶經常使用接口模式。在瀏覽器自己支持相似標籤以前,開發人員可使用Brick。html

Brick基於Mozilla的X-Tag polyfill庫,所以,要運行依賴任何Brick標籤的代碼,開發人員須要先將window.onload替換爲x-tags庫的「DOMComponentsLoaded」事件:git

document.addEventListener('DOMComponentsLoaded', function(){   
// 在這裏添加可運行代碼... 
});

在寫做本文的時候,Brick包含13個不一樣的標籤(「bricks」),它們中的大部分都徹底相互獨立,甚至能夠分別下載,而不是一塊兒打包下載:github

  1. 「導航欄(Appbar)」
  2. 「日曆(Calendar)」
  3. 「日期選擇器(Datepicker)」
  4. 「面板(Deck)」
  5. 「翻轉框(Flipbox)」
  6. 「圖標按鈕(Iconbutton)」
  7. 「佈局(Layout)」
  8. 「滾動框(Slidebox)」
  9. 「滾動條(Slider)」
  10. 「選項卡(Tabbar)」
  11. 「開關(Toggle)」
  12. 「開關組(Togglegroup)」
  13. 「提示框(Tooltip)」

下面是日曆標籤的樣子:web

<x-calendar></x-calendar> 

Google很是信任Web組件,它也正在開發一個名爲Polymer的Web組件polyfill庫,該庫試圖在現有的瀏覽器基本結構上充分利用「影子DOM(Shadow DOM)」、「自定義元素(Custom Elements)」和「模型驅動視圖(Model Driven Vies)」等將來技術。瀏覽器

值得一提的是,雖然在過去的一年裏Web組件的發展勢頭看上去很好,可是Web組件規範變化很快,還有許多方面不肯定。幾周前,來自Google的Dimitri Glazkov在W3C郵件列表中提議,從規範中刪除<element>元素。關於這一點,他們一致認爲, 已擬定的<element>元素語法不夠好,在實現標準化以前,應該把這個問題留給各實現庫來探索,正如來自Apollo Group的Brian Kardell所說:app

像x-tags和polymer這樣的項目,甚至是像Ember和Angular這樣的項目,要給他們機會,讓他們帶頭提出那些問題並幫忙給出具備潛在競爭力的答案——在我看來,沒有必要急於在這一點上進行高層次的標準化。webapp

相關文章
相關標籤/搜索