為什么要浪費時間學習新的語言和框架，還冒著隨時可能被淘汰的風險？如果Java可以直接在瀏覽器中運行呢？本文，高級全棧Java程序員Niels Gorisse介紹了VertxUI的優(yōu)勢。
就像大多數(shù)資深的Java程序員一樣，我在2000年之前寫了第一個JavaScript代碼行。如今，經(jīng)過十多年的瀏覽器革命，ECMAscript5已成為標準：超過97％的瀏覽器在使用中支持它。JavaScript雖有不足，但可以編寫一段可在任何地方工作的JavaScript代碼。 JavaScript正在成為一個體面的語言，包含類，異常，lambda表達式，工作線程，包裝，注釋，庫管理等等。
如今，JavaScript許多新穎的功能已經(jīng)添加到Java中了。在幾乎每一種情況下，這意味著它多年來已經(jīng)變得相當穩(wěn)定和成熟了：
VertxUI和Fluent
VertxUI是一個100％的Java庫。由于純HTML和CSS足以構建網(wǎng)頁，VertxUI除了普通訪問瀏覽器外，還提供了一種稱為Fluent的輕量級流暢的API，它簡化了僅使用代碼構建HTML和CSS。Fluent使用與HTML標簽對應的方法名稱，這些方法的第一個參數(shù)總是一個CSS類。所以VertxUI沒有任何模板，都是代碼。使用HTML，我們定義一個Bootstrap菜單，如下所示：
變量主體是來自Fluent類的靜態(tài)導入。同樣，程序員也可以使用控制臺，文檔和窗口的方法。
實際上，Java源代碼的代碼數(shù)量略高于上面的HTML代碼片段。它還顯示了如何在單擊菜單項時調(diào)用Java代碼。在我們的示例中，控制器（controller :: someMethod）的一個實例負責處理事件。
雖然在前面的代碼片段中沒有顯示，但是還有一個類Store，維護一個類Model的列表。 這種傳統(tǒng)的MVC（模型 - 視圖 - 控制器）設置并不是必需的，但是在編寫JUnit測試時可能會很有用。
當然，程序員也可以使用lambda表達式。例如，我們創(chuàng)建一個Bootstrap表單。方法.css（）和.att（）也用于顯示它們的工作原理。這基本上需要編寫HTML和CSS：
所需HTML代碼段：
使用Fluent收集一些代碼：
View on … model
當程序員要更改DOM時，F(xiàn)luent的真正實力就顯示出來了。更改盡可能高效地更新，與ReactJS（來自Facebook）相當，這確保當一個在線狀態(tài)更改時，其他列表不會被完全重新呈現(xiàn)。
程序員可以使用.add（）方法創(chuàng)建一個ViewOn <Model>。這有兩個參數(shù)：一個初始模型（或一個模型的引用）和一個將該模型轉換為Fluent對象的方法。例如：
result
code：
你可能注意到了syncPerson（）方法。這將重繪所有具有指向Person實體鏈接的ViewOn對象。請注意，編寫復雜的用戶界面（如向?qū)В┓浅Ｈ菀?，因為只是聲明性地寫下UI的外觀即可，甚至可以嵌套ViewOn對象。
所有代碼都是純Java，所以如果你喜歡流，那也沒有問題。 tbody——就像許多其他容器（如標簽）一樣，它需要一個CSS類和一個Fluent對象的列表或流。
View on … state
在以前的Bootstrap菜單示例中，當程序員單擊它時，具有“active”類的CSS項目應切換到所選項目。這就是我們稱之為'state'的方法，它可以方便地識別一個狀態(tài)，并將其視為一種不會被保存到數(shù)據(jù)庫中的實體，也可以使用ViewOn <>作為狀態(tài)：
JUnit - 單元測試
因為Fluent內(nèi)部有一個虛擬DOM，所以可以很容易地用于JUnit測試，而不必啟動瀏覽器。這是非?？斓模驗闆]有對JavaScript進行編譯，并且在后臺沒有啟動和停止瀏覽器。
在下一個示例中，我們直接模擬Controller調(diào)用：
JUnit - 集成測試
隨著項目發(fā)展并開始使用外部JavaScript庫，集成測試越來越重要。在Fluent中，程序員可以在具有“register-and-run”構造的瀏覽器中執(zhí)行雙語言測試。運行時環(huán)境比對Selenium有更多的控制，因為可以在一個測試中輕松地運行和組合JavaScript和Java。
一個Bootstrap菜單示例，我們通過直接調(diào)用controller.onMenuAbout（）來模擬一個菜單。讓我們看看前一個改變“active”類內(nèi)容的例子是否真的有效，Java到JavaScript的編譯正在發(fā)生：
請注意，此示例可能已被放入非DOM測試，運行速度更快。
VertX
程序員可在任何后端軟件中運行VertxUI，但是與VertX一起，它提供了幾個設施，如FigWheely和POJO traffic。VertxUI與VertX比簡單易用：只需啟動main（）并將瀏覽器指向http：// localhost。不必安裝任何IDE插件，也不必處理* .war或* .jar。
VertX是完全異步的，與回調(diào)類似，就像JavaScript一樣。最大的區(qū)別在于，由于Java是一種非常結構化的語言，所以永遠不會在JavaScript中遇到回調(diào)。當異步發(fā)生異常時，可能會在另一個類中調(diào)用另一種方法。
VertX - FigWheely
FigWheely是VertxUI的運行時幫助器。它通過瀏覽器保持WebSocket打開，并在服務器上更改文件時收到通知。如果已更改的文件恰好是.java文件，則圖片將重新編譯瀏覽器代碼并通知瀏覽器。
無需任何IDE插件就可以像VertxUI一樣工作，因為當啟動（VertX）服務器和找到源代碼時，會發(fā)生JavaScript的編譯。在啟動期間，也會生成一行index.html，但也可以將其關閉。
VertX - POJO
VertxUI便于服務器和瀏覽器之間的POJO流量用于ajax調(diào)用，WebSocket，sockJS和VertX事件總線。這意味著強類型的流量，即使在下面使用了JSON。讓客戶端和服務器使用相同的語言有一些不錯的優(yōu)點：當你想添加一列時，它可能只是在實體中添加一行代碼，在視圖中添加一行額外的“TD”。
無論客戶端和JavaScript語言將來發(fā)生什么情況，程序員都可以在非常成熟的語言中創(chuàng)建非常好的可測試單頁Web應用程序，由完善的VertX服務器環(huán)境支持，使用任何很棒的CSS框架，如Bootstrap。
JavaScript和它的庫將會長大，但這將需要數(shù)年時間。為什么不一次性選擇一個很好的框架，幫助編寫干凈整潔的代碼呢？VertxUI就是這么想的！
