VS Code 這麼牛,再次印證了一句名言

2011年,50歲的Eric Gamma 從IBM跳槽到微軟。

那一年我正好在IBM,還是IBM的百年大慶,看到這個訊息,非常失望,這麼一位大牛,《設計模式》的作者,JUnit的作者,Eclipse JDT架構師,程式設計師界的標杆性人物,IBM沒有留住他,實在是太可惜了。

VS Code 這麼牛,再次印證了一句名言

當時Eclipse風頭正盛,IDEA還沒有現在這麼火,Eric Gamma突然跳槽,這挺讓人費解。

後來得知,他加入了Visual Studio團隊,從事的是online developer tooling,就是讓程式設計師可以在瀏覽器中寫程式碼。

這一次,50歲的Eric Gamma,相當於拋棄之前所有的成就和榮譽,重新創業了。

創業起步

可能很多人並不知道Eric Gamma一直以來都是遠離IT的中心美國,在瑞士的

蘇黎世

,領導著一個小而強悍的團隊工作。

VS Code 這麼牛,再次印證了一句名言

(風景如畫的蘇黎世)

他的小團隊馬上要面對一個最大的問題:我們的產品是什麼?

如果沒有產出,去哪裡獲取進一步的投資?

資本就是這麼現實,Eric Gamma你再牛,沒有產品說話,也是混不下去的。

他們的第一個產品就是 Monaco Editor,一個Web版本的編輯器。

這個編輯器利用了HTML5的技術,支援語法高亮,智慧提示。

Eric Gamma還做了一個重要的決定:

不使用任何UI Framework,儘可能地接近最底層的DOM。

VS Code 這麼牛,再次印證了一句名言

因為他認為效能非常重要,完全控制自己的命運更加重要。

於是,Monaco Editor 就這麼完全從零開始,一行一行地發展起來。

一切從頭來過,嗯,牛人就是牛人。

對專案名稱,老外好像特別喜歡用地名,例如摩納哥(Monaco),雅加達(Jakarta),爪哇(Java),我在IBM的時候也遇到過,明明是個電子商務系統,非要叫個義大利的地名:塔司科尼。

誰要是知道原因的話,不妨在下面留個言。

產品出來了,自然要找客戶。

Monaco的第一個客戶是 微軟雲Azure ,隨後也被嵌入到了各種各樣的產品中。

可以這麼說,這個創業公司生存沒問題,接下來就是怎麼發展了。

遭遇滑鐵盧

初戰告捷,勝利衝昏了團隊的頭腦:為什麼不把它變成一個Web IDE呢?把日常開發的所有內容都搬到瀏覽器中。

於是,他們把Monaco Editor改造成了

Monaco Workbench

,一個單詞的變化,一下子就高大上起來。

他們搭建了本地的伺服器,開始吃自己的狗糧,使用Monaco Workbench來開發Monaco Workbench。

VS Code 這麼牛,再次印證了一句名言

Monaco是用JavaScript編寫,而JavaScript是一門匆忙設計出來的語言,其中一些特性在程式碼庫變大的時候很容易讓人抓狂。

即使Erich Gamma的團隊程式設計水平很高,他們也會遇到一個動態語言的終極問題:動態一時爽,重構火葬場。

幸運的是,微軟的另外一個大神Anders創造了一門叫做TypeScript的語言,完美地解決了這個問題。

(Anders的故事參見 《一個養活了四代程式設計師的男人》)

VS Code 這麼牛,再次印證了一句名言

從這幅圖中可以看出,Monaco並不是推倒重來,而是漸進式地採用TypeScript。

2013年,他們釋出了Visual Studio Online Monaco(這個名字實在是太長了), 具備程式碼瀏覽,和Git整合,搜尋程式碼等功能,介面和後來的VS Code已經非常像了。

VS Code 這麼牛,再次印證了一句名言

介面看起來很酷,但是殘酷的現實是:

這個產品每個月只有3000活躍使用者

對於微軟這麼一個巨無霸來說,產品使用者以億級計數,這實在是太尷尬了。

線上的IDE,這樣的產品理念在2013年可能是太超前了。

這中間還發展了一個趣事,摩納哥(Monaco)王國寫了一封信,說他們不喜歡這個產品的名字(有他們的國家名在其中),後來Erich Gamma他們只好加了一個引號 Visual Studio Online “Monaco”

VS Code 這麼牛,再次印證了一句名言

是不是很奇怪,為什麼一定要把Monaco這個地名放到一個程式設計師用的產品中呢?叫Visual Studio Online 不行嗎?

轉折

Erich Gamma的團隊面臨著一個經典的創業公司挑戰:如何獲得十倍,百倍的使用者增長?

從哪裡獲得使用者呢?

是繼續砸錢在程式設計師社群做推廣,還是轉向別的方向?

這時候大環境發生了變化,新CEO納德拉上臺,微軟開始擁抱開源,為了吸引更多程式設計師,微軟的產品要從執行在Windows上,變成跨平臺執行。

VS Code 這麼牛,再次印證了一句名言

Erich Gamma看到機會,也發現了一個新的使用者群體:

為Web開發而生的程式設計師。

這個群體在開發中

會使用很多語言,很多開發工具,有很多不同的執行時環境,天生有跨平臺的需求

但是Web程式設計師是喜歡Editor 還是IDE呢?

Erich Gamma決定選擇中間部分。

VS Code 這麼牛,再次印證了一句名言

Web版沒人用,那就開發一個桌面版吧,但是從頭兒開發代價太高。

幸運的是,當時存在著一個叫做Electron的技術,透過使用使用Node。js(作為後端)和Chromium的渲染引擎(作為前端),讓JavaScript可以執行在桌面端。

VS Code 這麼牛,再次印證了一句名言

透過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核心也不會受到影響。

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進行互動。

VS Code 這麼牛,再次印證了一句名言

VS Code 這麼牛,再次印證了一句名言

LSP協議在短短几年內取得了空前的成功,現在已經有了來自微軟以及社群的一百個實現,基本覆蓋了所有主流程式語言。

4。 VS Code Remote

VS Code Remote 讓程式設計師可以在遠端環境(比如虛機、容器)裡開一個VS Code工作區,然後用本地的VS Code連上去工作。

VS Code 這麼牛,再次印證了一句名言

在這些創新特性的加持下,VS Code 迅速攻城掠地,開始爆炸式發展,成為廣大開發者的必備神器。

迴歸初心

不要忘了Erich Gamma的最初目標:online developer tooling,讓程式設計師在瀏覽器中寫程式碼。

經過艱苦的奮鬥,現在終於可以迴歸初心:瀏覽器中的VS Code

VS Code 這麼牛,再次印證了一句名言

由於VS Code良好的架構,使得它向Web的遷移比較容易,主要的改變是UI層。

原來是依賴Electron 做UI, 現在轉向Web,需要再次重構程式碼,做出抽象。

例如原來有Electron的對話方塊,現在需要抽象出Dialog,給出HTML Dialog的實現。

但是,程式設計師真的會適應純Web的編輯器,在瀏覽器中程式設計嗎?大家可以在留言區討論下。

這裡有一些統計數字,大家可以看下,每月的活躍使用者達到了1400萬,28k個外掛,LSP Server都有138個。

VS Code 這麼牛,再次印證了一句名言

尤其是那

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