移動端webUI框架（HTML5手機框架）

淘寶SUI Mobile框架

官網地址：http://m.sui.taobao.org/

SUI Mobile 是一套基於 Framework7 開發的UI庫。它很是輕量、精美，只須要引入咱們的CDN文件就可使用，而且能兼容到 iOS 6.0+ 和 Android 4.0+，很是適合開發跨平臺Web App。

輕量的UI庫

SUI Mobile 很是輕量，核心庫壓縮Gzip後的JS、CSS網絡傳輸體積總共只有52K，卻提供了20+個經常使用的組件。

對於只有HTML&CSS的組件，你只須要複製HTML代碼既可使用。他的大部分JS組件都是獨立的 Zepto 插件，而且提供了 Zepto/jQuery 風格的API，你將會很是熟悉這種方式。

移動端web框架 Frozen UI

官網地址：http://frozenui.github.io/

Frozen UI是一個開源的簡單易用，輕量快捷的移動端UI框架。基於手Q樣式規範，選取最經常使用的組件，作成手Q公用離線包減小請求，升級方式友好，文檔完善，目前全面應用在騰訊手Q增值業務中。

非手Q用戶不能使用離線包而直接請求核心css也僅28k，另外也能夠採用cdn和combo的方式按需加載。

CSS組件包括按鈕，列表，表單，通知，提示條，彈出框，選項卡，等級圖標，角標，紅點，1px解決方案等。

CSS使用模塊化的樣式命名和組織規範，使用sass編寫css代碼。

FrozenJS 是針對移動端開發的 js 組件庫，其依賴 zepto.js 和 FrozenUI，支持seajs模塊化和非模塊化兩種方式。

FrozenJS 包括： basic：FrozenJS 的一些基礎功能，包括模板引擎、tap 支持等。 ui：主要是一些觸屏經常使用的 UI 組件，包括 dialog 等。 effect：很是用的特效庫，特殊場景使用到是能夠單獨調用。

兼容android 2.3 +，ios 4.0 + 。

移動WebApp開發框架 Clouda

官網地址：http://clouda.baidu.com/

Clouda是基於node.js的Webapp開發框架，在使用Clouda時須要安裝node.js和MongoDB。

Clouda 是百度推出的一款面向資深開發者的WebApp開發框架。在Clouda中開發app，能夠在多終端下實現數據同步、任務遷移。而且Clouda支持面向數據的編輯模式，根據數據的變化自動實現界 面實時更新，開發者不需描述躍遷過程。它的核心在於雲、端使用統一的Javascript語言，能夠同時運行在瀏覽器、iOS、Android以及百度框中。另外，clouda app能夠同時開發服務端和客戶端，客戶端的數據與雲端實時同步，其內部數據也可供搜索引擎檢索，解決app孤島以及99.9%長尾應用只有30%分發量 的搜索分發問題。

HTML 移動端框架 Framework7

官網地址：http://framework7.io/

Framework7 或者叫 F7 是全功能的綁定 iOS 7 應用的 HTML 框架。Framework7 是免費開源的 HTML 移動端框架，用來開發混合移動端應用或者 iOS 7 的 Web 應用，而且帶有 iOS 7 的原生外觀和感受。Framework7 也是獨立的原型應用工具。

Framework7 使用 Javascript，CSS 和 HTML 來建立 iOS 7 應用，支持多個平臺的遷移（PhoneGap），可是不是支持全部平臺，主要仍是針對 iOS 7。

Amaze UI框架

官網地址：http://amazeui.org/

Amaze UI 開發思路

經過拆分、封裝一些經常使用的網頁組件，以規範化採用雲適配平臺開發的移動網站，統一用戶體驗逐漸造成的。

一、語義化

Amaze UI開發遵循語義化原則，意圖經過類名（class）等信息直觀傳達元素的功能角色，同時關注結構、樣式、行爲分離，下降各部分的耦合程度，提升開發效率和可維護性。

二、移動優先，跨屏適配

遵循 「移動優先（Mobile First）」、「漸進加強（Progressive enhancement）」的理念，可先從移動設備開始開發網站，逐步在擴展的更大屏幕的設備上，專一於最重要的內容和交互，適應移動互聯潮流。輕鬆建立跨屏適配的網頁。

三、模塊化，按需定製

AMUI使用LESS編寫樣式，結構良好，易擴展，易維護；使用Seajs模塊化開發、組織 JavaScript，天然、優雅。

四、專一於HTML5

AMUI 基於輕量的Zepto.js開發，有效減小爲兼容舊瀏覽器的臃腫代碼；基於 CSS3 的交互效果，平滑、高效。AMUI專一於現代瀏覽器（支持HTML5），再也不爲過期的瀏覽器耗費資源，爲更有價值的用戶提升更好的體驗。

五、本地化支持

相比國外的前端框架，Amaze UI專一解決中文排版優化問題，根據操做系統調整字體，實現最佳中文排版效果；針對國內主流瀏覽器及App內置瀏覽器提供更好的兼容性支持，爲你節省大量兼容性調試時間。

Amaze UI 的開發歷程

雲適配創始人陳本峯：這個項目最開始是做爲內部使用工具來開發的。咱們雲適配自己就是一個前端產品，Amaze UI能幫咱們下降開發時間和成本，用標準化做業流程，能有更高的產出。

從雲適配創立之初，咱們就開始積累本身的前端框架，同時也借鑑了Bootstrap等國外框架的優勢。在內部使用過程當中，你們一致反映不錯，咱們就但願把這個產品開源，但願分享給更多的人，也但願更多的人來貢獻代碼，來共建中國前端開源生態環境。在最近幾個月，咱們投入人力將這個項目整理成一個開源產品。目前有2個軟件工程師全職在開發這個產品，還有一個設計，一個PM也在盡力配合。產品發佈以後，咱們會投入更多全職的工程師來專心打磨這個產品，同時也呼籲更多的前端開發愛好者共同來完善這個框架。

Amaze UI的目標

幫助開發者提升開發效率，提高網頁效果，即用最短的時間作出最讚的網頁，使更多的前端開發者再也不受前端複雜代碼困擾。

Jingle移動端框架

官網地址：http://vycool.com/Jingle/

Jingle是一個SPA(Single Page Application)開發框架，用來開發移動端的html5應用，在體驗上儘可能去靠近native應用，但願有一天html5可以作到與native同樣的操做體驗。

騰訊移動Web前端框架

官網地址：https://github.com/AlloyTeamDev/Pro

微信WeUI和微信支付WePayUI

https://github.com/weui/weui

https://github.com/wepayui

GMU

百度已經不更新

 

purecss

 

ionic

 

jquery mobile

 

bootstrap

 

MUI

http://dev.dcloud.net.cn/mui/

 

AUI

http://www.auicss.com/

 

 

總結：

框架當然是好，並且不少問題都已經解決，尤爲是兼容性問題；可是帶來的問題也不少，尤爲是你只會用框架，不知道里面的原理；因此我我的建議：先靜態最原始的方式實現，再到框架進行重構。