HBuilder：最快的Web開發IDE

從Frontpage、Dreamweaver、UE，到Sublime Text和JetBrains的WebStorm，Web編程的IDE已經更換了幾批。HBuilder是DCloud（數字天堂）推出一款支持HTML5的Web開發IDE。“快，是HBuilder的最大優勢，通過完整的語法提示和代碼輸入法、代碼塊及很多配套，HBuilder能大幅提升HTML、js、css的開發效率。”問到HBuilder的優勢時，DCloud CEO王安表示。

HBuilder

在HBuilder里預置了一個hello HBuilder的工程，用戶敲這幾十行代碼后會發現，HBuilder比其他開發工具至少快5倍。“最全的瀏覽器兼容性數據、開發手機App等很多特點也都是HBuilder強于競品的地方”，王安表示。

以“快”為核心的HBuilder，引入了“快捷鍵語法”的概念，巧妙地解決了困擾許多開發者的快捷鍵過多而記不住的問題。開發者只需要記住幾條語法，就可以快速實現跳轉、轉義和其他操作。比如alt+[是跳轉到括號，alt+’是跳轉到引號，alt+字母是跳轉菜單項，而alt+左則是跳轉到上一次光標位置。而Ctrl則是各種操作，比如ctrl+d就是刪除一行。shift則是轉義，比如shift+回車是<br/>，shift+空格是&nbsp;。

另外，HBuilder的生態系統可能是最豐富的Web IDE生態系統，因為它同時兼容Eclipse插件和Ruby Bundle。SVN、git、ftp、PHP、less等各種技術都有Eclipse插件。

HBuilder的編寫用到了Java、C、Web和Ruby。HBuilder本身主體是由Java編寫，它基于Eclipse，所以順其自然地兼容了Eclipse的插件。但因為Java效率太低，所以用C寫了啟動器。HBuilder柔和的綠色界面設計需要動態調節屏幕亮度，它還支持手機數據線真機聯調，而這些都是用C寫的。

HBuilder很多界面，比如用戶信息界面都是使用Web技術來做的，既漂亮，開發起來又快。最后，代碼塊、快捷配置命令腳本，都是用Ruby開發的。

“這4種技術各有各的用途，我們團隊內部也靈活運用，HBuilder的架構支持不同的技術互相融合通信。至于我們的技術選型原則，首先滿足用戶需求，然后我們內部用什么技術能更快完成就會選什么技術”，王安解釋道。

最大的難題：js解析

HBuilder第一個版本發布到現在，DCloud以每周一版的速度已經發布了20多個版本。主要更新包括支持邊看邊改、插件安裝、App打包平臺開放、代碼塊自定義開放。“但是最主要的工作還是在努力把亮點做到極致，從第一個版本發布，我們能提升一倍的web開發效率，到現在可以提升5倍”王安說道。

DCloud在開發HBuilder的過程中遇到了不少難題，比如 web語法庫和瀏覽器兼容庫的建立，從W3C的HTML、JavaScript、CSS的正式標準和推薦標準，到ECMAScript中瀏覽器支持的部分，還有各大瀏覽器的擴展語法，Webkit、moz、ms的HTML、JS、CSS， 想集齊這些語法，不僅僅是工作量的問題。而每個語法在每個瀏覽器的每個版本上是否能運行，得到這個數據也是前人未能突破的挑戰。還好這個難題目前已經被解決。

“當前困擾我們最大的難題還是js解析”王安坦言道。

目前其他開發工具都不能有效的識別代碼里的js對象，要不沒有提示，要不全提示，甚至有的隨意提示用戶輸入過的詞。而DCloud在識別用戶寫的js方面下了很大的功夫，比如var e = document.getElementById("e")，e或許是一個div也可能是input，那么e設置屬性時，就需要準確識別e到底是什么，才能給出有效精準的提示。

“我們已經克服了很多挑戰，即使很復雜的寫法document.querySelector("div:not(#a1) .class1")，HBuilder也知道這個對象到底是什么”。

當然把精準識別做到極致，必然帶來一個煩惱，就是性能下降。當用戶快速敲代碼時，無法接受延遲提示，也就是說，復雜的識別運算要在毫秒級完成，這種挑戰非常大。為此需要不停的優化算法甚至重構。“目前我們還在路上艱難前行，但我們相信終究會克服這個挑戰，屆時開發者們將得到又快又準的提示，而我們也給競品鑄造了難以超越的壁壘”，王安表示。

目前Web開發領域格局

目前主流的前端開發工具有Sublime為代表的文本編輯器，以及Webstorm、Brackets、Dreamweaver、vs等IDE。但說道為HTML5設計或做了特殊優化的，只有HBuilder、Webstorm和Brackets。從用戶群和優缺點角度，主流的開發工具總結如下表（僅收集小部分開發者的意見，如對工具有更多看法，歡迎評論）：

文本編輯器以輕快方便的特點獲得了很多用戶的喜愛，但商業項目的編寫缺少IDE還是會很低效。IDE相比文本編輯器最大的特點是擁有語法引擎，能夠識別語言。

Mobilehub：HBuilder主頁

HBuilder申請試用地址

生活不易，碼農辛苦
如果您覺得本網站對您的學習有所幫助,可以手機掃描二維碼進行捐贈