VS Code 這么牛,再次印證了一句名言
?2011年,50歲的Eric Gamma 從IBM跳槽到微軟。
那一年我正好在IBM,還是IBM的百年大慶,看到這個(gè)消息,非常失望,這么一位大牛,《設(shè)計(jì)模式》的作者,JUnit的作者,Eclipse JDT架構(gòu)師,程序員界的標(biāo)桿性人物,IBM沒有留住他,實(shí)在是太可惜了。
當(dāng)時(shí)Eclipse風(fēng)頭正盛,IDEA還沒有現(xiàn)在這么火,Eric Gamma突然跳槽,這挺讓人費(fèi)解。
后來得知,他加入了Visual Studio團(tuán)隊(duì),從事的是online developer tooling,就是讓程序員可以在瀏覽器中寫代碼。
這一次,50歲的Eric Gamma,相當(dāng)于拋棄之前所有的成就和榮譽(yù),重新創(chuàng)業(yè)了。
1.創(chuàng)業(yè)起步
可能很多人并不知道Eric Gamma一直以來都是遠(yuǎn)離IT的中心美國,在瑞士的蘇黎世,領(lǐng)導(dǎo)著一個(gè)小而強(qiáng)悍的團(tuán)隊(duì)工作。
(風(fēng)景如畫的蘇黎世)
他的小團(tuán)隊(duì)馬上要面對一個(gè)最大的問題:我們的產(chǎn)品是什么?
如果沒有產(chǎn)出,去哪里獲取進(jìn)一步的投資?
資本就是這么現(xiàn)實(shí),Eric Gamma你再牛,沒有產(chǎn)品說話,也是混不下去的。
他們的第一個(gè)產(chǎn)品就是 Monaco Editor,一個(gè)Web版本的編輯器。
這個(gè)編輯器利用了HTML5的技術(shù),支持語法高亮,智能提示。
Eric Gamma還做了一個(gè)重要的決定:不使用任何UI Framework,盡可能地接近最底層的DOM。
因?yàn)樗J(rèn)為性能非常重要,完全控制自己的命運(yùn)更加重要。
于是,Monaco Editor 就這么完全從零開始,一行一行地發(fā)展起來。
一切從頭來過,嗯,牛人就是牛人。
對項(xiàng)目名稱,老外好像特別喜歡用地名,例如摩納哥(Monaco),雅加達(dá)(Jakarta),爪哇(Java),我在IBM的時(shí)候也遇到過,明明是個(gè)電子商務(wù)系統(tǒng),非要叫個(gè)意大利的地名:塔司科尼。
誰要是知道原因的話,不妨在下面留個(gè)言。
產(chǎn)品出來了,自然要找客戶。
Monaco的第一個(gè)客戶是 微軟云Azure ,隨后也被嵌入到了各種各樣的產(chǎn)品中。
可以這么說,這個(gè)創(chuàng)業(yè)公司生存沒問題,接下來就是怎么發(fā)展了。
2.遭遇滑鐵盧
初戰(zhàn)告捷,勝利沖昏了團(tuán)隊(duì)的頭腦:為什么不把它變成一個(gè)Web IDE呢?把日常開發(fā)的所有內(nèi)容都搬到瀏覽器中。
于是,他們把Monaco Editor改造成了Monaco Workbench ,一個(gè)單詞的變化,一下子就高大上起來。
他們搭建了本地的服務(wù)器,開始吃自己的狗糧,使用Monaco Workbench來開發(fā)Monaco Workbench。
Monaco是用JavaScript編寫,而JavaScript是一門匆忙設(shè)計(jì)出來的語言,其中一些特性在代碼庫變大的時(shí)候很容易讓人抓狂。
即使Erich Gamma的團(tuán)隊(duì)編程水平很高,他們也會遇到一個(gè)動(dòng)態(tài)語言的終極問題:動(dòng)態(tài)一時(shí)爽,重構(gòu)火葬場。
幸運(yùn)的是,微軟的另外一個(gè)大神Anders創(chuàng)造了一門叫做TypeScript的語言,完美地解決了這個(gè)問題。
(Anders的故事參見 《一個(gè)養(yǎng)活了四代程序員的男人?》)
從這幅圖中可以看出,Monaco并不是推倒重來,而是漸進(jìn)式地采用TypeScript。
2013年,他們發(fā)布了Visual Studio Online Monaco(這個(gè)名字實(shí)在是太長了), 具備代碼瀏覽,和Git集成,搜索代碼等功能,界面和后來的VS Code已經(jīng)非常像了。
界面看起來很酷,但是殘酷的現(xiàn)實(shí)是:這個(gè)產(chǎn)品每個(gè)月只有3000活躍用戶。
對于微軟這么一個(gè)巨無霸來說,產(chǎn)品用戶以億級計(jì)數(shù),這實(shí)在是太尷尬了。
在線的IDE,這樣的產(chǎn)品理念在2013年可能是太超前了。
這中間還發(fā)展了一個(gè)趣事,摩納哥(Monaco)王國寫了一封信,說他們不喜歡這個(gè)產(chǎn)品的名字(有他們的國家名在其中),后來Erich Gamma他們只好加了一個(gè)引號 Visual Studio Online “Monaco”
是不是很奇怪,為什么一定要把Monaco這個(gè)地名放到一個(gè)程序員用的產(chǎn)品中呢?叫Visual Studio Online 不行嗎?
3.轉(zhuǎn)折
Erich Gamma的團(tuán)隊(duì)面臨著一個(gè)經(jīng)典的創(chuàng)業(yè)公司挑戰(zhàn):如何獲得十倍,百倍的用戶增長?
從哪里獲得用戶呢?
是繼續(xù)砸錢在程序員社區(qū)做推廣,還是轉(zhuǎn)向別的方向?
這時(shí)候大環(huán)境發(fā)生了變化,新CEO納德拉上臺,微軟開始擁抱開源,為了吸引更多程序員,微軟的產(chǎn)品要從運(yùn)行在Windows上,變成跨平臺運(yùn)行。
Erich Gamma看到機(jī)會,也發(fā)現(xiàn)了一個(gè)新的用戶群體:為Web開發(fā)而生的程序員。
這個(gè)群體在開發(fā)中會使用很多語言,很多開發(fā)工具,有很多不同的運(yùn)行時(shí)環(huán)境,天生有跨平臺的需求。
但是Web程序員是喜歡Editor 還是IDE呢?
Erich Gamma決定選擇中間部分。
Web版沒人用,那就開發(fā)一個(gè)桌面版吧,但是從頭兒開發(fā)代價(jià)太高。
幸運(yùn)的是,當(dāng)時(shí)存在著一個(gè)叫做Electron的技術(shù),通過使用使用Node.js(作為后端)和Chromium的渲染引擎(作為前端),讓JavaScript可以運(yùn)行在桌面端。
通過Electron的包裝,Visual Studio Online "Monaco" 這個(gè)Web Workbench搖身一變,成了桌面"IDE",并且是跨平臺的。
2015年5月,發(fā)布 VS Code (終于不再有地名了), 團(tuán)隊(duì)做了一個(gè)很酷的Demo:在Linux上調(diào)試.NET程序,一下子引起了轟動(dòng)。
VS Code 從此進(jìn)入了發(fā)展的快車道。
4.創(chuàng)新致勝
如果到此打住的話,VS Code充其量也只是個(gè)好一點(diǎn)的編輯器。
想捕獲程序員的芳心,不拿出來些干貨是不行的。
- 開源
群眾的呼聲很高,微軟和Erich Gamma 團(tuán)隊(duì)也順勢而為,開源VS Code。
放到GitHub之前,團(tuán)隊(duì)仔細(xì)地Review了代碼,把它弄得干干凈凈。
無論是誰,都擔(dān)心自己的代碼被噴啊。
- 擴(kuò)展
大家試用了VS Code以后,提出的最大建議就是:要支持?jǐn)U展,支持插件。
這不正是Erich Gamma 擅長的嗎!他在Eclipse搞了10多年的擴(kuò)展了!
但Erich非常清楚,擴(kuò)展是好東西,但是也可能會傷害你,它會嚴(yán)重地拖慢你的IDE。
有了之前的慘痛教訓(xùn), 團(tuán)隊(duì)決定,擴(kuò)展要在一個(gè)獨(dú)立的進(jìn)程中運(yùn)行(是不是讓你想到了Chrome?)
VS Code核心通過RPC和擴(kuò)展進(jìn)行交互,這樣即使擴(kuò)展崩潰了, VS Code核心也不會受到影響。
- LSP
Web開發(fā)通常使用多種語言,用JavaScript寫前端,用Java寫后端,還可能用Python搞點(diǎn)兒腳本啥的。
這么多語言,如何在一個(gè)編輯器中對它們支持智能的感知呢?
例如:
用戶點(diǎn)擊了某個(gè)函數(shù)名,點(diǎn)擊“Go to Definition”,就應(yīng)該跳到函數(shù)定義。
用戶把鼠標(biāo)放到某個(gè)類名上,應(yīng)該顯示相關(guān)定義和文檔。
......
Erich Gamma再次發(fā)揮了他大師級的抽象能力,把用戶在編輯時(shí)最常用的操作,如打開文件、編輯文檔,Goto Definition等抽象出來,定義出一套協(xié)議:LSP(Language Server Protocol)。
VS Code不用理解語言的特性,不用考慮抽象語法樹,非常輕量級.
編程語言,Java也好,Python也罷,不用考慮IDE,只要有個(gè)對應(yīng)的Language Server實(shí)現(xiàn)了這套協(xié)議,就可以和VS Code進(jìn)行交互。
LSP協(xié)議在短短幾年內(nèi)取得了空前的成功,現(xiàn)在已經(jīng)有了來自微軟以及社區(qū)的一百個(gè)實(shí)現(xiàn),基本覆蓋了所有主流編程語言。
4. VS Code Remote
VS Code Remote 讓程序員可以在遠(yuǎn)程環(huán)境(比如虛機(jī)、容器)里開一個(gè)VS Code工作區(qū),然后用本地的VS Code連上去工作。
在這些創(chuàng)新特性的加持下,VS Code 迅速攻城掠地,開始爆炸式發(fā)展,成為廣大開發(fā)者的必備神器。
5.回歸初心
不要忘了Erich Gamma的最初目標(biāo):online developer tooling,讓程序員在瀏覽器中寫代碼。
經(jīng)過艱苦的奮斗,現(xiàn)在終于可以回歸初心:瀏覽器中的VS Code
由于VS Code良好的架構(gòu),使得它向Web的遷移比較容易,主要的改變是UI層。
原來是依賴Electron 做UI, 現(xiàn)在轉(zhuǎn)向Web,需要再次重構(gòu)代碼,做出抽象。
例如原來有Electron的對話框,現(xiàn)在需要抽象出Dialog,給出HTML Dialog的實(shí)現(xiàn)。
但是,程序員真的會適應(yīng)純Web的編輯器,在瀏覽器中編程嗎?大家可以在留言區(qū)討論下。
這里有一些統(tǒng)計(jì)數(shù)字,大家可以看下,每月的活躍用戶達(dá)到了1400萬,28k個(gè)插件,LSP Server都有138個(gè)。
尤其是那10萬的issue,格外耀眼,讓人非常震撼,一個(gè)好的產(chǎn)品真的是靠不斷打磨出來的。
十年過去了,一個(gè)完整的社區(qū)成形, 60歲的Erich Gamma創(chuàng)業(yè)成功!
6.總結(jié)
看完這段歷史,你可能會覺得,Erich Gamma實(shí)在太牛了,干啥都能成。
其實(shí)并不是這樣,在他離開IBM之前, 曾經(jīng)做過一個(gè)叫做Jazz的項(xiàng)目,Jazz試圖把團(tuán)隊(duì)協(xié)作,特別是敏捷軟件開發(fā)的流程搬到IDE這樣的開發(fā)工具中,和代碼無縫集成,但是除了IBM內(nèi)部的人,恐怕了解Jazz的并不多,這個(gè)項(xiàng)目并沒有在業(yè)界掀起多大的波瀾。
?如果要總結(jié)的話,還是那句老話:運(yùn)氣,從來都是給有實(shí)力的,準(zhǔn)備好的人。
TypeScript、Electron、微軟轉(zhuǎn)型看起來都是VS Code的重要助力和運(yùn)氣,但是如果沒有最早的摩納哥Editor,沒有Erich Gamma迅速轉(zhuǎn)型的勇氣,沒有后續(xù)的一系列創(chuàng)新,VS Code走不到今天。
參考資料:
本文大部分內(nèi)容和圖片的來源于Erich Gamma的演講:《VS Code an Overnight Success… 10 years in the making》https://www.youtube.com/watch?v=hilznKQij7A?