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