Ext JS是一個針對Web的UI庫。它是市場上的輕量級工具,它經過抽象,支持開發人員沒必要強制性地編寫HTML的源代碼,並且容許開發人員靈活的擴展組件庫或者經過簡單強大的插件架構建立真實的插件。Ext JS解決了管理HTML和CSS的問題,提供了媲美桌面應用的UI外觀。它支持開發人員在現有HTML網頁中注入組件或者開發富企業級RIA,其中一些應用於關鍵任務應用,如實時監控和網絡基礎設施的管理。前端
Ext JS 4從推出第一個預覽版以後,一直處於緊張的開發之中。昨天,其官方博客表示,Ext JS 4的正式版預計將在一個月以後發佈,這對Web開發社區特別是RIA開發人員來講無疑是個好消息。此刻,讓咱們回顧一下Ext JS 4在預覽版中的優秀特性和功能。web
最新的Ext JS 4預覽版4發佈了一個新的元素——Grid組件,該組件在4.0中徹底重寫,所以比3.x版本提供了更多功能,性能和靈活性大幅度提升,所以擴展更加容易。新版Grid組件的主要優勢包括:緩存
智能渲染在Ext JS 3中,Grid組件爲了運行良好,老是生成Grid功能所需的所有標記,在大多數狀況下,過於繁重了。而在Ext JS 4中,默認的Grid只包含了輕量級的標記,在開發人員選擇其餘特性時,對應的標記纔會渲染。這對於頁面渲染速度和總體的Grid性能都是極大的提升。網絡
標準佈局架構
依靠更智能的渲染通道(pipeline),新Grid的許多部分都被劃分紅適當的Component並集成到標準的佈局管理系統,而不是依賴定製的內部標記和CSS。這樣既統一了Grid的渲染過程,又維持了出色的像素UI體驗。框架
數據視圖(DateView)工具
Ext JS 4中的GridView擴展了標準DataView類,不只簡化了內部代碼,並且使新Grid易於定製。由於它擴展了DataView,因此新Grid能夠像其餘視圖同樣利用選擇模式,包括經過鍵盤導航作非連續選擇。佈局
功能支持性能
在Ext JS 3中,沒有統一的策略來添加Grid的功能。許多功能做爲插件添加,而另外一些以子類的形式,這致使難以組合這些功能。Ext JS 4包含了一個基礎類Ext.grid.Feature,能夠此建立靈活的功能。底層的Grid模板能夠被Feature類修改以配合視圖生成的標記。網站
虛擬滾動
Ext JS 4的Grid原生支持在渲染時緩存數據,提供數據的虛擬、按需加載的視圖。Grid如今能夠輕鬆支持成百上千的記錄,而無需分頁,相比Ext JS 3來講是巨大的改進。
除此以外,Ext JS 4在繪圖方面也是一大亮點,其引入了全新的繪圖引擎哇,再也不依賴於Flash,所有使用JavaSCript,支持DOM方法訪問。Ext JS 4容許客戶設計、開發很是炫目的圖表,號稱其餘框架沒法提供如此複雜的數據顯示方法。感興趣的讀者能夠瀏覽在線示例。
《ExtJS in Action》的做者Jesus Garcia在接受InfoQ專訪時表示,Ext JS遵循的組件(Component)和容器(Container)模型是它比其餘Ajax庫更具特點的主要緣由:
組件和容器模型(還有其餘特色)使Ext JS在其餘同類Ajax庫中別具一格,由於它們使庫的UI部分結構化。沒有它,Ext JS不會這麼不同凡響。組件模型爲框架引入了「組件生命週期」,爲組件帶來了一套定義良好和可靠的行爲。它分爲三個階段,初始化(Initialization)、渲染(Render)和銷燬(Destruction)。初始化指組件新實例的初始化時刻。渲染階段指組件被渲染或者繪製到屏幕上的時候。最後,銷燬階段支持組件執行清理任務,如全部注入的HTML節點的刪除和清除事件監聽器。
容器模型支持組件經過父子關係模式來管理其餘模型。經過容器模型,開發人員能夠輕鬆地建立動態UI——利用它的add()或者remove()來添加或者刪除一個或幾個子元素。爲了管理子元素的視覺組織,容器使用了佈局(Layout)。
Jesus在數個大公司部署過基於Ext JS的應用,如萬豪國際、洛克希德馬丁、摩根大通和美國金融監管局,他以本身的實踐經驗告訴你們,Ext JS適合的應用領域很廣:
我一般使用Ext JS爲許多客戶開發應用。我最近一個任務是爲客戶開發界面管理成員信息。由於Ext JS功能齊全,因此我能夠利用它開發各類應用,好比定製UI從IBM的Tivoli Enterprise Console和HP Universal CMDB中合併數據、爲EMC的Documentum產品開發前端界面。我已經開發了幾個應用來幫助公司制定考覈內容。
開發人員能夠充分利用Ext JS來開發RIA中所需的功能。這幾年,我已經看到了各類各樣的應用,大部分是基於業務的。
Ext JS自己不是爲移動web應用而定製的,可是它的兄弟Sencha Touch是。我已經看到而且實驗了在iPad上運行有限功能的Ext JS應用。它不支持觸摸功能,並且UI主題不是以移動爲中心的。