迷戀Flex開發人員的HTML5框架

多年來，我一直在作爲一名flex開發人員，構建真正複雜的應用程序。隨着最近的炒作，我對學習HTML5感興趣。迷戀Flex開發人員的HTML5框架

我對Flex框架的喜愛是它構建RIA的一致性，一致性和完整性。我喜歡它有一個開箱即用的廣泛組件，以及一個用於擴展和構建真正複雜，大量定製的皮膚組件的框架。

HTML5空間中是否有類似的框架？

從我所做的搜索，我看到有很多有用的.js腳本提供漂亮的組件，效果等。但是，我一直沒有找到一個堅實的js框架與成熟和架構組件庫。

這讓我很擔心，在構建一個複雜的應用程序時，我可能會寫很多管道代碼來連接不同的組件。我知道HTML5還處於起步階段，所以如果有一些有希望的框架，我應該關注一下，我想知道他們。

我的購物的理想框架需求列表將如下所示：

固體組件架構（包括生命週期事件）
擴展
佈局管理器
瀏覽器無關
支持數據綁定
支持複合皮膚
服務層的抽象&協議（即，SOAP/JSON/XML服務都是一個類型的IRemoteService）

隨着UI框架本身，在JavaScript的空間存在哪些框架

MVC體系結構。（在Flex世界類似Parsley，或Maté）
依賴注入
單元測試

來源

2011-01-05 Marty Pitt

如果您是Flex開發人員，那麼可能有興趣查看Sencha Frameworks（我的公司）的桌面和移動版本：用於桌面應用程序的Ext JS和用於移動/平板電腦應用程序的Sencha Touch。 Ext JS專注於桌面Web應用程序，它可以一直工作到IE6，所以儘管我們可以做到（我們的新圖表使用Canvas，SVG或VML），但沒有太多空間可以成爲「HTML5」。取決於它發現自己的瀏覽器）。

Sencha Touch專注於Android，iOS，Blackberry和IE9（？）移動瀏覽器，所以我們可以使用所有CSS3，localStorage等等，您可以搖一搖。如果你正在尋找一個測試案例，說明你從一個現代瀏覽器的假設開始就可以做什麼，那麼就是這樣。

Ext JS & Sencha Touch是組件的全部功能。儘管組件和佈局模型對於Ext JS 3來說沒有太大的改變，但是組件和佈局的最佳概述是this article，這是爲Ext JS 2編寫的。佈局對Ext JS 4進行了重寫 - 它將會有第一個測試版這個月 - 讓他們更像CSS3 flexbox佈局系統。

可擴展性是具有適當的組件模型的產物。 Ext JS有許多可以混合和匹配的用戶擴展組件。專業售後服務組件的一個很好的例子是Ext Scheduler.還有一個good tutorial on how to create components。

數據綁定：UI組件綁定到商店，因此多個UI元素隨着新數據更新而更新。你可以閱讀store API reference以瞭解它是如何工作的。

複合蒙皮 - 煎茶觸摸具有正被移植到分機JS 4的excellent theming system - 但分機JS 3和2是涉及多一點到主題由於IE6兼容性要求（你必須生成圖像）

服務層被抽象爲data proxy, which is extended for JSON, Http, XML etc。

Sencha Touch和Ext JS 4有一個（簡單的）MVC架構。 Ext JS 3及以下版本不支持。

這裏的a good write-up on dependency injection in Ext JS（但應推廣到觸摸）

進行單元測試，我們建議茉莉花 - 就是出舉足輕重的實驗室。 Ext JS和Sencha Touch的應用非常廣泛 - Ext JS主要用於公司應用程序，但是有很多大公司像Salesforce，Marketo和其他大型公司一樣使用它來爲外部用戶提供服務。 Sencha Touch有a nice gallery of apps from our latest dev contest，你應該檢查出來。

如果你關心的工具，我們也有一個GUI拖放設計師和CSS3動畫工具（後者在開發者預覽版）

來源

2011-01-07 02:23:33

HTML5的樣板可以是有趣的你。我不確定關於MVC或Dependency的JS框架，但對於單元測試Dojo的Harness（由於新的用戶限制，我不能發佈第二個鏈接，但它應該很容易找到）是非常強大的。我會看看更多的道場的東西，因爲他們做了一些非常酷的工作與JS

來源

2011-01-05 18:05:13 Zaksoup

同意爲純HTML5和JavaScript（哦，對不起，這不是純粹的是）它也漸入佳境的一個很好的比較因爲其他人蔘與貢獻。 – PurplePilot 2011-01-05 18:55:17

樣板是矯枉過正！ – rxgx 2011-01-06 05:17:59

我認爲你可能喜歡Sencha Framework符合你正在尋找的一些東西。

來源

2011-01-05 18:51:45 Tsundoku

Sproutcore是一個JavaScript應用程序框架。它是完全MVC，具有豐富的鍵值觀察/綁定基礎結構，可以減少需要編寫的管道代碼的數量，如果使用正確的話。它支持您的大部分需求：

「固體組件架構（包括生命週期事件）」 - 每個視圖都有一堆生命週期事件。

「可擴展」 - Sproutcore支持mixins，並且它具有自己的「convert prototypal inheritance」來轉換古典繼承的東西，所以你覺得你要在JS中創建類。

「佈局經理」 - 您展示自己的觀點，他們在哪裏，他們有多大。有SplitViews你可以調整和嵌套，但這可能是SC不符合你的要求的一個領域（雖然你可以很容易地通過觀察來實現視圖大小調整）

「瀏覽器不可知」 - 它是漂亮的瀏覽器不可知的，就像任何其他JS框架一樣。

「支持數據綁定」 - 非常廣泛的綁定基礎結構。如果將視圖字段綁定到模型字段，則會在模型更改時進行更新。

「支持複雜皮膚」 - 如果您不喜歡默認主題，則可以像使用任何其他Web應用程序一樣通過css皮膚。

「單元測試」 - SC附帶一個qunit測試工具。當您使用SC命令行工具創建類（無論是M，V還是C）時，該工具會爲您創建一個測試存根。

'HTML5' - 一種模糊的概念開始。 SC絕對支持在構建工具中生成html5應用程序清單。有框架可用於寫入瀏覽器本地存儲。我認爲不久的將來會有更多的html5功能上線。

鉻應用程序商店和這個sudoku應用程序的NPR應用程序都是SC應用程序。

來源

2011-01-05 19:11:38 hvgotcodes

你可以擴展你的評論「......減少你需要編寫的管道代碼的數量，如果你正確使用它，也許關於什麼「正確使用」的鏈接看起來像？ – datico 2011-12-16 00:25:29

@datico，我希望記錄。瞭解它的最好方法是查看一些開源應用程序，如OtherInbox（在github上提供） – hvgotcodes 2011-12-16 18:31:01

我在同一條船上，你在一起。我發現的所有js框架都需要很多CSS來使它們與原生flex一樣好。大多數較新的js框架在較舊的瀏覽器上放棄。

資金和酷炫的演示可能讓流星成爲js框架的長期贏家。

我喜歡的angularJs

簡單這裏的一些流行的

http://blog.stevensanderson.com/2012/08/01/rich-javascript-applications-the-seven-frameworks-throne-of-js-2012/

來源

2013-01-05 13:46:50 Systemsplanet

我最近也接受了AngularJS。到目前爲止，我非常喜歡這個過程。 – 2013-01-06 04:43:33

迷戀Flex開發人員的HTML5框架

回答

相關問題