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