那些年的體驗技術部

時間 2019-11-05

標籤那些年體驗技術部简体版

原文原文鏈接

2008 年對中國人是複雜的一年，冰災，大地震，奧運會接踵而至。對玉伯來講也同樣，趕在奧運會排查臨時人口以前，玉伯從北京中科院軟件所離開，憑着本身幾年來在程序開發上的經歷和對新興前端行業的看好，來到杭州加入了淘寶 UED —— 彼時中國最好的前端團隊，同時開始撰寫歲月如歌博客。雖然 Google 早在 2003 年已經經過 Gmail 這個劃時代的產品展現了 JavaScript 和 Ajax 技術在瀏覽器端的強大能量，前端在當時在國內仍是一個十分稚嫩的行業。windows XP+ IE 統治了國內的互聯網行業的每塊屏幕，也正是那一年 Google 推出了 v8 和 chrome，次年 Node.js 發佈，即將對前端行業產生巨大的影響。html

2008 年的雲謙（sorrycc）拿着不到 4000 塊錢的工資在一家小公司裏打雜，但願老闆加薪 500 元未果，離職加入了淘寶 UED。同一年的蕭慶也在杭州的某公司裏作 Java 程序員兼前端，老闆試探性打開 ExtJS 官網對他說，這個不錯可是要錢，能不能用 jQuery 改一版免費的出來？一個月後，一個 jQuery 版本的 ExtJS 雛形出來了。前端

2009 年由於淘寶店鋪業務的發展，業務上須要一個重型的可視化編輯器，玉伯開始作 KISSY Editor。一年後，承玉加入淘寶，而且立志要在 5 年內升到 P8。玉伯和他、沉魚、喬花一塊兒將 Kissy Editor 進一步升級成了 Kissy，成爲當時淘寶中前臺的標準前端技術棧。react

2009 年貫高和臻兒大學畢業，選擇加入當時名不見經傳的支付寶 UED 前端開發部。git

2010 年的絕雲畢業後，在阿里和一家日本公司的 offer 中選擇了出國淘金。2011 年，臻兒北上南下，在校園中招到了展新和偏右，一塊兒開始參與支付寶前臺業務和基礎技術建設。同年蕭慶也加入了淘寶 UED，依靠本身先前的經驗，在業務線上搭建出了 BUI —— 基於 jQuery 的中後臺組件庫，在淘系後臺場景中大量推廣。程序員

2011 年，玉伯結束了內部創業的湖畔項目，去了淘寶 Java 開發團隊。確認了本身不喜歡 Java 代碼後，次年從淘寶 UED 轉崗到了支付寶 UED 前端開發部，負責基礎技術組，偏右和貫高當時都在這個小組。這也是他第一次正式帶團隊，第一次小組週會，玉伯沒有聊技術，而是操着不甚流利的湘普分享了亞馬遜公司的價值觀，全部小組成員面面相覷，一不知道他想表達什麼，二也看不出面前這個黑黑的湖南漢子和貝佐斯有什麼類似點。github

最後的黃金時代

外部前端大環境正在銳變的前夜，jQuery 如日中天，Node.js 崛起，ES6 正在醞釀中，前端的標準化和工程化即將到來。前端工程師這個職業依然是一個很不成熟的技術崗位，國內不少公司過度地細分了重構工程師（CSS）和 JS 工程師，行業內的大佬們一窩蜂地在使用奇技淫巧悶頭造相似 YUI 和 prototype.js 的輪子，面試問的最多的是閉包的寫法和 IE6 hack 技巧，技術環境的割裂造就了前端基礎技術的風潮和大量崗位。和當時國內大多數前端團隊同樣，支付寶也在閉門造本身的前端輪子，大量借鑑了 YUI 的組件架構體系，底層使用了 Java 生態裏的 MVN 進行依賴管理和構建，全部的輪子和釘子都要內部自造，和前端社區愈來愈遠。面試

很快支付寶在玉伯的影響下開始嘗試逃脫出這個怪圈，解決辦法是開源。玉伯在一行代碼還沒開始寫以前發了一條微博，咱們要用開源的方式打造支付寶下一代前端框架了，這在當時是很是激進的。chrome

2012 年 4 月，玉伯剛剛從淘寶轉崗到支付寶，離開了漸漸進入死胡頭的 Kissy，手攥着當紅的 Sea.js 準備大幹一場。兩年前的支付寶前端團隊也進入了團隊技術的轉型期，舊的前端框架須要升級，笨重的開發方式須要演進，雙方一拍即合，Arale 就此誕生。 —— 關於 Arale 的過去、如今和將來小程序

Sea.js/Arale/spm 套件開始在支付寶內部和國內開源界發展起來。開源的工做方式讓貫高偏右們感到很是興奮，雲謙、沉魚和蕭慶也前後從淘寶轉崗到支付寶開始參與新的前端體系的建設。咱們去了騰訊深圳本部進行了技術分享，號召騰訊的同窗也來使用和共建 Sea.js 和 Arale 前端社區。如今回頭看來有點天真，雖然是開源技術，當時走的依然是一條前端輪子自研和前端社區自建的道路，最終這條路走沒有成功，Angular 和 React 等外部技術體系很快將帶來巨大的衝擊。windows

前端技術以外，整個支付寶乃至阿里的業務平臺也在 13 年走到了一個十字路口，前端和業務結合很是緊密，UED 和設計在公司的話語權極高。那兩年的阿里的 UED 團隊們的氣氛很是活躍，蜜月同樣的 PC 前端時代如今顯得有些光怪陸離，前端和 UED 在產品上進行着各類各樣的 A/B 測試，更換各類按鈕樣式觀察頁面數據變化，每半年搞一次前端性能優化的戰役，公司內舉辦着各種黑客馬拉松比賽，iPhone 和 iTouch 送到手軟，996 這個詞那時候還不存在。這是個一行 js 代碼的錯誤就能夠形成全站交易下跌的時代，也是 PC 前端們最後的黃金時代。

鉅變

2013 年改變了無數人的命運，無線時代的來臨、友商的壓力讓整個阿里坐立不安。11 月，整個阿里宣佈 ALL IN 無線，推出來往正面對決友商，誓要火燒南極，淘寶/支付寶等業務也全面無線化。城門失火殃及池魚，60 我的左右的支付寶前端開發部即刻面臨解體，一半以上的人被抽調支持支付寶無線業務，面對巨大的變化，那幾周整個團隊一盤散沙，全部人都面對很是具體的抉擇：留下 or 離開？當時的前端開發部老大麼麼茶最終去了來往（後來成爲了釘釘的創始人之一），玉伯本身也面臨着各類選擇，特地去現場觀察了來往團隊的狀態：『感受來往可能真的會成功！』。

最終，玉伯仍是決定和剩下的 17 我的一塊兒留在了這個團隊，支持沒有幾個迭代的 PC 端業務和進入死衚衕的自研前端技術體系。調整完的第一次週會，全部人都很沉默，比起鼓起勇氣作抉擇離開的人，留下的人的心態更可能是未知和『擁抱變化』。ALL IN 無線伴隨的是全集團的瘋狂，全組爲配合兄弟團隊主動加班，然而週六來了以後居然不知道要作什麼，兩週後就做罷了。沒有活幹是一方面，更可怕的是對前端自身價值的懷疑，整個阿里前端也陷入了相似的困局。

在阿里，咱們不得不認可一個事實：前端的確有價值，但放在全局來看，前端產生的價值並不是核心價值。在阿里，雖然前端的工做已經不可或缺，但對大公司而言，不可或缺的崗位多了去呢，不可或缺不表明有核心價值，我就不說了。 ————阿里前端的困局與突圍

這個狀態沒有持續好久，本覺得是一艘棄船，業務上新的發展方向卻帶來了新生。

無線戰略的同時，大中臺也做爲公司的重要戰略在那一年被提了出來。剩下的夥伴們沒有閒好久， PC 端的前臺業務雖然沒了，前線業務伴隨的中後臺的業務量開始大量增加起來。那時候團隊最喜歡用一張冰山圖來作技術和業務宣講：大中後臺的業務比例是前臺業務的十倍甚至更多，比起前臺的兵強馬壯，中後臺業務的人力資源、研發效率和產品體驗對咱們都是新的巨大的挑戰。戲劇性的是，幾個月前還不知道作什麼的團隊，很快玉伯就在和無數不知道從哪來長出來的中後臺業務拉扯人力問題：『咱們不是資源！』。隨着業務的爆發，團隊人數迅速增加起來，團隊名也從前端開發部更名成體驗技術部，意在體現前端工程師的核心競爭力：用技術解決產品體驗問題。

老的一套前端技術體系已經明顯不匹配業務現狀了，亟需換代。這一年設計師子溯加入了體驗技術部，開始和偏右展新們一塊兒作螞蟻金服的第一個技術商業產品『螞蟻金融雲』，前端技術棧選的是 AngularJS。而 2014 年 React 技術棧在社區嶄露頭角，承玉們在淘寶維護 Kissy 和 BUI 等技術體系的時光也到了一個轉折點。因而承玉轉崗來了支付寶，和蕭慶一塊兒開始建設 react-component 底層組件生態。

先後端分離的研發模式在社區流行起來，體驗技術部最早實踐的是基於 Node.js 的應用層方案。

在這種研發模式下，先後端的職責很清晰。對前端來講，兩個 UI 層各司其職：一、Front-end UI layer 處理瀏覽器層的展示邏輯。經過 CSS 渲染樣式，經過 JavaScript 添加交互功能，HTML 的生成也能夠放在這層，具體看應用場景。二、Back-end UI layer 處理路由、模板、數據獲取、cookie 等。經過路由，前端終於能夠自主把控 URL Design，這樣不管是單頁面應用仍是多頁面應用，前端均可以自由調控。後端也終於能夠擺脫對展示的強關注，轉而能夠專心於業務邏輯層的開發。經過 Node，Web Server 層也是 JavaScript 代碼，這意味着部分代碼可先後複用，須要 SEO 的場景能夠在服務端同步渲染，因爲異步請求太多致使的性能問題也能夠經過服務端來緩解。前一種模式的不足，經過這種模式幾乎都能完美解決掉。 —— Web 研發模式演變

蘇千、不四等 koa 社區的活躍成員在 2014 年前後加盟，和貫高一塊兒開始研發 Chair 企業級 Node.js 研發框架，以及後來的 Egg.js，嘗試在大規模高可用的金融業務和先後端分離的研發模式中尋找 Node.js 的落地場景。

2012 年，百度商業前端通用技術組的御術（林峯）和幾位團隊成員一塊兒從上百個業務系統中抽取需求，寫出了商業圖表庫 ECharts 0.1 版本，2013 年 6 月 ECharts 1.0 版本發佈。幾乎與此同時，由於買不起 HighCharts，蕭慶開始把 BUI 中的圖表獨立出來，對標作成了內部使用的 ACharts。

AngularJS 的嘗試沒有過久，體驗技術部開始決定要統一技術棧，通過激烈的爭吵和決策，押寶 React 這條船，嘗試在 react-component 基礎上協力建設基於 React 的 UI 設計系統。2015 年，曾經風光無限破釜沉舟的來往也終於走到了盡頭，團隊像剛成立時那麼迅速地分崩離析了，它山沒有跟隨麼麼茶們去作新的釘釘，而是決定來到螞蟻，帶領設計師團隊和承玉偏右一塊兒打造企業級中後臺 Design System。那時 Design System 在國內是一個很新的名詞，只有 Apple 和 Google 等公司有這樣高大上的概念，而基於中後臺的設計語言更是不多有人提。最後玉伯給拍了一個 Ant Design 的奇怪名字，偏右很快註冊了一個 ant.design 的域名，2015 年第一個對外版本上線的時候，社區不少人都看不懂這是什麼。

React 在內部的推廣經歷了很大的阻力，一方面是對 React 技術棧和當時還不成熟的 antd 的懷疑，一方面是大量 Arale/BUI/jQuery/BootStrap 的技術棧還在業務中不斷使用。爲了 Ant Design 設計體系能在支付寶業務落地，咱們甚至認真討論過 jQuery 版本的 antd 的可行性，最終團隊經過投入大量基礎技術的工程師去直接參與一線業務，在關鍵時間點把關鍵項目啃下來，一邊落地一邊完善 antd。Ant Design 的中後臺設計語言的定位和推出時機是很是合適的，antd 開始在公司外部也開始收穫了大量關注，GitHub 的 stars 數直線上升， 17 年 3 月突破了一萬 star，18 年三月 2w star，很快成爲國內中後臺前端開發的標杆，也讓承玉在 2015 年順利升到 P8。

Ant Design 的成功讓整個團隊感覺到鼓舞，另外一個前端大展身手的可視化領域在這個團隊同時生長起來。也在 2015 年，體驗技術部的蕭慶和好修閱讀了 The Grammar of Graphics 一書後，意識到可視化不僅是圖表這麼簡單，開始着手把 ACharts 升級爲 G2 圖形語法庫，即 JavaScript 版本的 The Grammar of Graphics，並嘗試在螞蟻內推廣落地。16 年，剛剛回國加入阿里沒多久的絕雲在微博上聯繫到了 ECharts 的御術，那時御術也正面臨着再次創業的失敗，揣着可視化的夢想來到了杭州。他將和蕭慶絕雲沉魚們一塊兒打造 AntV 螞蟻數據可視化解決方案和九色鹿體驗度量產品。

2016 年，展新在螞蟻金融雲的文檔中心業務研發過程當中，抽離了一個 Markdown 文檔管理應用，起名叫雲雀，想替代公司內部老舊的 confluence 系統。展新做爲這個項目的惟一的設計師兼 PD 兼 BD 兼工程師，作了一個很漂亮的 Keynote 到體驗技術部各個小組去分享，但願能找到志同道合的同事一塊兒參與。而後子溯做爲 PD 加入了，玉伯也看到了這個產品的前景，星星之火開始燎原，一個雲雀產品小團隊迅速運轉起來，產品不斷改版迭代試錯。2017 年蘇千不四加入，雲雀迅猛成長爲整個阿里經濟體內部最大的文檔平臺，次年更名爲語雀正式進行商業化對外服務。

2017 年，御術北上去愛奇藝挖到了愚道。愚道加入體驗技術部後，本覺得內部研發應該已經很是成熟，備受業務和技術折磨後，萌生了開發企業前端研發框架的念頭，和來自成都的水魚一拍即合，一塊兒在酒店裏通宵了幾個晚上，開發出了 Bigfish 1.0 版本。幾乎同時，雲謙基於雲鳳蝶業務中的實踐作出了相似的 UmiJS 而且對外開源，二者經歷了劇烈的內部競爭後在 18 年進行了整合，一個你死我活的局出現了共贏，UmiJS 對外開源服務，Bigfish 則基於 Umi 重構，成爲螞蟻金服內部標準前端應用框架。今天的體驗技術部再也不是當年的刀耕火種，咱們有了工業化的生產工具進行研發，在前端咱們有了 Ant Design，有了 Bigfish，在服務端咱們有了 Chair 有了 Functions，可視化咱們了有了 G2/G6/F2/L7，生產力比起幾年前已經是質的飛躍，可是這裏也遠遠沒有成熟到只須要螺絲釘的程度。效率、資源、體驗的平衡是咱們的終極命題，也是體驗技術部存在的意義。

砥礪前行

除了語雀，其餘內部技術產品在前端工程化的大背景下也成長起來：Basement 前端應用發佈平臺，雲鳳蝶可視化搭建平臺，九色鹿體驗度量等等，投入了大量人力各自發展。玉伯也在被各個業務部門挑戰，爲何業務線不能投入足夠的前端資源，全部體驗科技產品都面臨着在螞蟻和阿里內部巨大的自證壓力。語雀在螞蟻內部被問得最多的問題是和金融服務有什麼關係？爲了努力向內部業務對齊，語雀的第一個 slogan 是『讓知識等於財富』。在大阿里內部，和釘釘在企業協做領域的定位也有重疊，在和強勢的釘釘經歷了無數次業務拉扯以後，很是慘痛的狀況仍是發生了。2018 年 6 月，包括展新在內的大半個語雀團隊被釘釘合並，語雀 HR 在宣佈決定的會議上哭了出來，無線 all in 的噩夢往事彷彿重現。這對新生的語雀是一次巨大的打擊，準備商業化起飛的翅膀被生生打斷。

2018 年 12 月 25 日， Ant Design 彩蛋事件在全網醞釀爆發，一度衝上知乎熱榜第二，用戶的巨大期許轉化成責罵和諷刺崩涌而來，antd 的 GitHub 討論區當天基本癱瘓，Ant Design 團隊經歷了噩夢般的一週。過後整個體驗技術部上下都進行了整肅，全部人感覺到了身上巨大的責任和敬畏感，玉伯很是生氣並自領 3.25 整年績效（無加薪無年終獎股票等獎勵），偏右在內部覆盤上許諾 antd 會更好，用長期的技術投入一點點彌補損失的信任。

2019 年 4 月，御術在一次部門團建中說『大家有感受到體驗技術部這兩年不夠好了麼，已經好久沒有社招 P8 加入了』。號稱國內最好的前端團隊，今天比以往都更須要新鮮血液的加入。『到了坡底，就只能向上走了』

2013 年玉伯寫過他的三個夢：技術夢、產品夢、自由夢。語雀、雲鳳蝶、九色鹿、Basement 是這個產品夢，Ant Design、Egg、Umi、AntV 是技術夢，作夢是須要勇氣的，也歷來不是一路順風的。

我有三個夢：技術夢、產品夢、自由夢。以前我一直把前兩個夢割裂開來，2012 年最大的成長是意識到前兩個夢能夠合起來，技術即產品，產品即技術。12 年下半年很清楚明確基礎技術最重要的是產品化。只有用作產品的心態去作技術，纔有可能把技術作好作長久。產品夢不只僅是技術夢，但技術夢能夠融合進產品。作產品不必定要出去創業，在公司依舊能夠作到。公司自己也是一個產品，對業務的瞭解、深刻、改進等等，都頗有挑戰，很是值得去作。產品夢重要的不是所作的事情，而是作事的產品心態。至於自由夢，於我而言，一是財富自由，二是精神自由。愚公（周愛民）說過挺有意思的一句話：財富自由不要只看收入，最主要取決於支出。目前愚公就已實現了財富自由，由於愚公老家那地方，平常開銷真是小，呵呵。真正可貴是精神自由... —— 畢業十年與個人三個夢

2019 年阿里內已經有幾十個名字是『體驗技術部』的前端團隊。

2019 年的展新在釘釘繼續追逐本身的文檔夢。

2019 年的蘇千子溯在和語雀一塊兒蟄伏，在剛剛過去的四月份發佈了企業空間功能，語雀的商業化再次上路。

2019 年的雲謙已是兩個男孩的父親，剛下線了老邁的 spm，發佈着 umi 的一個個新版本。

2019 年 Ant Design 的 stars 數已經突破了 45000，偏右和勺子正在籌劃 antd 4.0，努力把西湖區第一作成太平洋第一。

2019 年的沉魚開始從九色鹿轉向雲鳳蝶，探索 hpaPaaS 智能建站的可能性。

2019 年的貫高們正在用 Node.js 搭建下一代 Serverless for Frontend 架構，作阿里經濟體小程序雲開發的標配。

2019 年的蕭慶和絕雲把 AntV 作成了阿里數據可視化的核心技術，還在探索用可視化技術給業務帶來價值。

2019 年的臻兒正在嘗試把螞蟻前端研發搬到雲上，讓下一代研發模式早點到來。

2019 年的御術開始帶領體驗技術部下的平臺前端技術部，重走玉伯那年的路。

2019 年的玉伯好久不寫博客了，他的產品夢和技術夢都在路上，自由夢實現了一半。而另外一半也遙遙無期，也近在咫尺。

這是一篇部門招聘貼，我想借這個機會從本身的視角小結一下體驗技術部這幾年的經歷，也但願能找到和咱們意氣相投的將來同事。咱們還在路途中，有前進也有折回，各位不管工程師、設計師、產品仍是運營，也不管阿里內外，如如有夢，歡迎一塊兒同行。