解決jsp程式不直接、代碼與UI混雜的痛: JSPWidget

js|程式|解決 介紹一個非常不錯的基於java、web的UI解決方案，用java做web應用的人都知道，web上UI開發的痛苦吧，UI表現上幾乎沒有什麼現成的控制項，這一點.net的確是比java要強一點，即使struts也沒有提供很好的解決JSPWidget是一個台灣的開源的UI架構，它仿照.net的viewstate等思想，提供了事件驅動、頁面狀態儲存(viewstate)、校正、以及常用組件(dropdownList、panel、treeView、menu)等解決方案。並且提供詳細的文檔和demo。其實在一年前就看到過這個項目了，今天偶爾又看到推薦給大家，希望可以學習、參考、借鑒他的思想。

項目地址：http://edu.uuu.com.tw/jspwidget

看一下他的Menu組件效果很cool吧：http://edu.uuu.com.tw/jspwidget/docs/gui/menu_03.jsp

下面是作者對webUI的一段分析：

設計目標
開發 Web-based 應用程式已儼然成為企業應用未來的主流趨勢，而 JSP 具備了 Java 跨平台及可存取 J2EE 架構中提供的所有服務等優點，更是企業在專案開發時考量的最佳網站技術。
然而，單單用 JSP 來開發 Web 專案並不容易，因為 JSP 是非事件驅動程式撰寫模式 ( Non Event-Driven Computing Model)、 UI (HTML Elements) 無法由程式碼直接控制、以及 UI 的狀態(View State)無法自動儲存， 這些因素造成了JSP的程式碼與 UI 混合在一起，錯綜複雜的 UI/程式碼不僅在開發上不容易，也造成日後維護與擴充上的困難。

相較於傳統的 Client Forms 或 Client-based Web Applications 程式撰寫模式而言， JSP顯然不直覺多了。原因有三，茲並列比較如下:

因素 Client Forms 純 JSP
Event-Driven Computing Model 你可以藉由撰寫事件處理函式 (Event Handler) 來處理由 GUI components所觸發的事件。 例如 Button 的 OnClick 事件或 DropdownList 的 OnSelectChanged 事件。 因為JSP是由上到下循序處理 (Sequential Processing)，因此你必須用程式來判斷到底使用者按了哪個按鈕， 使用者是否改變選定的選單項目等等，然後根據這些判斷結果來撰寫對應的程式碼。
GUI Compoment 所有 GUI Compoment 的屬性與行為都可以由程式碼完全存取與控制， 程式碼與 UI是完全分開的。 因為JSP是由上到下循序處理 (Sequential Processing)，因此你必須在適當的JSP檔案位置插入程式碼， 以改變 output 至瀏覽器的 UI。但這樣撰寫方式往往造成程式碼與 UI 混雜在一起，非常難維護與擴充。
Retain View State automatically 無庸置疑，在傳統的 client forms 中， GUI component 的狀態 (view state) 自動保持在最後使用者對它改變的狀態。 因為 HTTP 是不保持狀態的 (Stateless)，因此所有的 HTML element 的狀態 (View State )會在 post 回 web server 後就消失。 為了保持最後使用者對 GUI Compoment 改變的狀態 ，你必須要撰寫程式。 保持 HTML element 的狀態 (View State )並不容易，不同的 HTML element 需要用不同的處理方法。 通常，約有25%的程式碼單純為了這件在 Client Form 中視為理所當然的事。


JSPWidget是在 JSP 標準上建置的一套 Framework，它的設計目標便是為了讓程式設計師可以直覺地方式來開發JSP Web 應用系統，就像是在開發傳統的 Client Form 一樣輕鬆簡單 。