專訪王安:HTML5開發(fā)工具HBuilder的特別之處
HBuilder是數(shù)字天堂出品的一款支持HTML5的Web開發(fā)IDE,InfoQ中文站獨(dú)家專訪了數(shù)字天堂的創(chuàng)始人王安,就開發(fā)者關(guān)心的問(wèn)題一一作了解答。
記者:HBuilder作為一個(gè)HTML5的IDE,都能做什么?主要面向哪些開發(fā)者?
王安:HBuilder是我們認(rèn)為當(dāng)前***的web開發(fā)工具。它能大幅提升開發(fā)效率,對(duì)程序員也設(shè)計(jì)了更人文關(guān)懷的UI,它包括最全面的語(yǔ)法庫(kù)和瀏覽器兼 容性數(shù)據(jù)。HBuilder是面向追求效率的極客開發(fā)者的,比如HBuilder強(qiáng)調(diào)的手不離鍵盤、飛一樣編碼。與之相對(duì)應(yīng)的另一面代表是 dreamweaver,dreamweaver擁有可視化拖拉拽布局頁(yè)面的設(shè)計(jì)器,更多的是面向設(shè)計(jì)師或初學(xué)者。
記者:在HBuilder開發(fā)的過(guò)程中,你們參考了哪些前人的解決方案?能介紹一下HBuilder的實(shí)現(xiàn)方案么?比如,采用了什么語(yǔ)言編寫,是否基于Eclipse等開源IDE的架構(gòu),等等。
王安:HBuilder有4種編程語(yǔ)言,Java、Web、C、Ruby。里面用到了Eclipse,這讓我們省了不少事,可以把精力用到更多創(chuàng)新的功能 上。至于為什么編程語(yǔ)言這么多,其實(shí)我們團(tuán)隊(duì)都是一群會(huì)多種編程語(yǔ)言的極客,我們清楚每個(gè)語(yǔ)言的優(yōu)劣,每個(gè)功能該用什么語(yǔ)言做就用什么語(yǔ)言做。舉個(gè)例 子,HBuilder的啟動(dòng)速度是3秒,如果全是基于Java的Eclipse,是不可能做到的。并且我們的每種編程語(yǔ)言之間都有橋來(lái)保障底層接口的通暢 度,不會(huì)造成混亂。
記者:相比之前那些工具,HBuilder的優(yōu)勢(shì)是什么?
王安:我們認(rèn)為是全面超越競(jìng)爭(zhēng)對(duì)手的。當(dāng)然優(yōu)勢(shì)那么多,最值得記住的優(yōu)勢(shì)還是那4點(diǎn):
- 最快的開發(fā)工具,五大助手大幅提升編碼效率
- 綠柔主題,保護(hù)健康
- 最全的語(yǔ)法庫(kù)
- 最全的瀏覽器兼容性數(shù)據(jù)
記者:在HBuilder的實(shí)現(xiàn)過(guò)程中,你們遇到了哪些問(wèn)題?是如何解決的?
王安:Web IDE是所有IDE中最難做的,因?yàn)閃eb有3個(gè)特點(diǎn):Web太靈活了、規(guī)范太多了、更新太快了。我想這些難題也是這些年Web IDE進(jìn)化比較慢的一個(gè)重要原因。
- 以顏色舉例,開發(fā)者寫成black、#000000、#000、RGB(0,0,0)...我們都得能識(shí)別。一個(gè)變量,一會(huì)是字符串,一會(huì)就可能變成數(shù)字,這都給我們?cè)斐闪撕艽蟮墓ぷ髁浚袛喾浅6嗲闆r。
- 目前全世界沒(méi)有一個(gè)地方擁有所有Web語(yǔ)法。我們動(dòng)用了幾十種手段才收集了3萬(wàn)多語(yǔ)法,包括W3C的html、Javascript、 CSS的正式標(biāo)準(zhǔn)和推薦標(biāo)準(zhǔn)...,ECMAScript中瀏覽器支持的部分,還有各大瀏覽器的擴(kuò)展語(yǔ)法。我們目前擁有最全的語(yǔ)法庫(kù),但我相信也還不是全 部web語(yǔ)法,所以我們還建了UGC,讓用戶來(lái)反饋數(shù)據(jù)。
- 我們都知道Web標(biāo)準(zhǔn)的發(fā)展速度是非常快的,去年底HTML5推薦標(biāo)準(zhǔn)出臺(tái),今年前段時(shí)間HTML5.1也發(fā)布了。而至于各個(gè)瀏覽器的擴(kuò) 展語(yǔ)法,幾乎每次瀏覽器版本升級(jí),都會(huì)產(chǎn)生新的標(biāo)簽或語(yǔ)法。而瀏覽器升級(jí)的速度也是非常快的。這就要求Web IDE必須拋棄瀑布式開發(fā)流程,引入互聯(lián)網(wǎng)的快速迭代理念。其實(shí)HBuilder整個(gè)就是一個(gè)服務(wù),而不是一個(gè)單機(jī)工具,我們稱之為live service,或者叫HBuilder是活的。
記者:從截圖看起來(lái),HBuilder似乎是一個(gè)Windows客戶端。HBuilder是否會(huì)提供Mac、Linux或Web版,乃至于移動(dòng)平臺(tái)?
王安:HBuilder的Windows版本相對(duì)比較成熟,MAC版本也基本開發(fā)完,稍晚一點(diǎn)也會(huì)發(fā)出來(lái)。Linux版本要看需求的踴躍程度了,畢竟有很 多更有意義的創(chuàng)新功能還在排隊(duì)中。純Web版目前不考慮,響應(yīng)速度還不夠快。至于移動(dòng)平臺(tái),敲代碼太不方便了,主工程不會(huì)有移動(dòng)版本,但是以后的問(wèn)答功能 上線后會(huì)有移動(dòng)版本。
記者:HBuilder在代碼調(diào)試方面有哪些特點(diǎn)?自身使用了哪種JS和渲染引擎,是否支持開發(fā)者在多鐘瀏覽器平臺(tái)上調(diào)試和兼容性測(cè)試?
王安:看下界面會(huì)更直觀。目前點(diǎn)擊運(yùn)行菜單如下。 如果本機(jī)沒(méi)裝,會(huì)提示下載地址。點(diǎn)擊后可以直接啟動(dòng)相應(yīng)的瀏覽器。由于HBuilder內(nèi)置了webserver,所以可以直接運(yùn)行網(wǎng)站工程,而不是使用file:///C:那種方式。
比較有特點(diǎn)還有手機(jī)的真機(jī)連調(diào),插上數(shù)據(jù)線后,在HBuilder中點(diǎn)真機(jī)運(yùn)行,可以直接在手機(jī)上看效果。在HBuilder中保存代碼更改,手機(jī)會(huì)自動(dòng)刷新界面。
至于調(diào)試,我們有計(jì)劃,但本版不會(huì)包含。因?yàn)槟壳按蠖鄶?shù)Web工程師都習(xí)慣于直接用瀏覽器來(lái)調(diào)試,集成調(diào)試在IDE里確實(shí)方便了一些,但并非殺手功能。
記者:在企業(yè)級(jí)Web開發(fā)中,開發(fā)人員需要對(duì)JS\CSS代碼做壓縮打包服務(wù),HBuilder是否提供相應(yīng)的支持?代碼重構(gòu)支持方面做了哪些工作?
王安:壓縮打包的問(wèn)題與調(diào)試類似,都是有計(jì)劃但***版不包含,因?yàn)樗麄兌紝儆诜奖愕皇菤⑹止δ堋D壳伴_發(fā)者有很多選擇,比如YUI或GCC,把HBuilder里的工程放到y(tǒng)ui下再壓一次就好了。YUI有Eclipse插件,可以裝在HBuilder中。
關(guān)于重構(gòu),這個(gè)是一款好IDE不可或缺的,HBuilder的重構(gòu)還是很強(qiáng)大的。不管是變量的重命名、刪除,還是文件的重命名、刪除、移動(dòng),都可以進(jìn)行重構(gòu)。比如把一張圖片從A目錄移動(dòng)到B目錄,各個(gè)層級(jí)的頁(yè)面對(duì)該圖片的引用都會(huì)重新匹配。
記者:HBuilder的發(fā)展路線圖是什么?未來(lái)有哪些重量級(jí)特性?
王安:HBuilder致力于給開發(fā)者提供***的Web開發(fā)工具。我們會(huì)搭建一個(gè)需求調(diào)研系統(tǒng),把一些候選項(xiàng)列出來(lái)讓開發(fā)者投票,看他們更需要哪個(gè)。目前已經(jīng)比較明確要做的包括:
- Mac版本支持
- 服務(wù)器端語(yǔ)言(PHP,Node.js)強(qiáng)化集成。雖然這些服務(wù)端語(yǔ)言也有Eclipse插件,但目前這些插件調(diào)不了我們的代碼助手。
- PC瀏覽器的邊改邊看模式。目前保存代碼時(shí)手機(jī)端可以自動(dòng)刷新,但PC上還不行。我們希望左邊編輯代碼,右邊就能實(shí)時(shí)看到效果。
- 畫中畫:用戶可以把一段代碼固定在屏幕的小窗里,在另一處編輯代碼時(shí)一直參考看著這段代碼的實(shí)現(xiàn)。還可以直接更改小窗里的代碼。
- 發(fā)行(包括壓縮、混淆)
- 斷點(diǎn)調(diào)試
記者:HBuilder是免費(fèi)的,在這種模式下如何維持長(zhǎng)期穩(wěn)定的發(fā)展?
王安:DCloud走的是互聯(lián)網(wǎng)模型,先做用戶,找投資,然后再考慮商業(yè)模式。我們現(xiàn)在的目的就是HBuilder成為全世界Web工程師都在用的工具。 當(dāng)我們擁有數(shù)百萬(wàn)開發(fā)者時(shí),我們不擔(dān)心自己設(shè)計(jì)不出來(lái)共贏商業(yè)模式。就像Facebook在做到上千萬(wàn)用戶之前沒(méi)人想商業(yè)模式,之后一群聰明的高管花了一 個(gè)月設(shè)計(jì)共贏商業(yè)模式,結(jié)果很好。
王安透露,目前HBuilder在實(shí)施公測(cè)。邀請(qǐng)的公測(cè)用戶是那些確實(shí)對(duì)HBuilder感興趣,為了追求效率愿意接受一個(gè)可能還有bug的產(chǎn)品, 并愿意反饋問(wèn)題給我們的熱心用戶。計(jì)劃近期發(fā)給首批試用者。根據(jù)試用反饋的情況來(lái)調(diào)整更大規(guī)模開放的時(shí)間。預(yù)計(jì)在9月份把質(zhì)量水平提升到可規(guī)模發(fā)行。但即便是更大規(guī)模的發(fā)行,并不代表所有人都可以隨意使用,有可能是類似于Gmail的邀請(qǐng)碼方式,由早期的用戶分發(fā)他的邀請(qǐng)碼給朋友。