那些年的體驗技術部
2008 年對台灣人是複雜的一年，冰災，大地震，奧運會接踵而至。對玉伯來說也一樣，趕在奧運會排查臨時人口之前，玉伯從北京中科院軟件所離開，憑著自己幾年來在程序開發上的經歷和對新興前端行業的看好，來到杭州加入了淘寶UED ——彼時台灣最好的前端團隊，同時開始撰寫歲月如歌部落格。雖然Google 早在2003 年已經通過Gmail 這個劃時代的產品展示了JavaScript 和Ajax 技術在瀏覽器端的強大能量，前端在當時在國內還是一個十分稚嫩的行業。 windows XP+ IE 統治了國內的互聯網行業的每塊屏幕，也正是那一年Google 推出了v8 和chrome，次年Node.js 發布，即將對前端行業產生巨大的影響。
2008年的雲謙（ sorrycc ）拿著不到4000塊錢的工資在一家小公司裡打雜，希望老闆加薪500元未果，離職加入了淘寶UED。同一年的蕭慶也在杭州的某公司裡做Java 程序員兼前端，老闆試探性打開ExtJS 官網對他說，這個不錯但是要錢，能不能用jQuery 改一版免費的出來？一個月後，一個jQuery 版本的ExtJS 雛形出來了。
2009 年因為淘寶店鋪業務的發展，業務上需要一個重型的可視化編輯器，玉伯開始做KISSY Editor。一年後，承玉加入淘寶，並且立志要在5 年內升到P8。玉伯和他、沉魚、喬花一起將Kissy Editor進一步升級成了Kissy ，成為當時淘寶中前台的標準前端技術棧。
2009 年貫高和臻兒大學畢業，選擇加入當時名不見經傳的支付寶UED 前端開發部。
2010 年的絕雲畢業後，在阿里和一家日本公司的offer 中選擇了出國淘金。 2011 年，臻兒北上南下，在校園中招到了展新和偏右，一起開始參與支付寶前台業務和基礎技術建設。同年蕭慶也加入了淘寶UED，依靠自己先前的經驗，在業務線上搭建出了BUI —— 基於jQuery 的中後台組件庫，在淘係後台場景中大量推廣。
2011 年，玉伯結束了內部創業的湖畔項目，去了淘寶Java 開發團隊。確認了自己不喜歡Java 代碼後，次年從淘寶UED 轉崗到了支付寶UED 前端開發部，負責基礎技術組，偏右和貫高當時都在這個小組。這也是他第一次正式帶團隊，第一次小組週會，玉伯沒有聊技術，而是操著不甚流利的湘普分享了亞馬遜公司的價值觀，所有小組成員面面相覷，一不知道他想表達什麼，二也看不出面前這個黑黑的湖南漢子和貝佐斯有什麼相似點。
最後的黃金時代
外部前端大環境正在銳變的前夜，jQuery 如日中天，Node.js 崛起，ES6 正在醞釀中，前端的標準化和工程化即將到來。前端工程師這個職業依然是一個很不成熟的技術崗位，國內很多公司過分地細分了重構工程師（CSS）和JS 工程師，行業內的大佬們一窩蜂地在使用奇技淫巧悶頭造類似YUI和prototype.js 的輪子，面試中最多的問題是閉包的原理和IE6 hack 技巧，技術環境的割裂造就了前端基礎技術的風潮和大量崗位。和當時國內大多數前端團隊一樣，支付寶也在閉門造自己的前端輪子，大量借鑒了YUI 的組件架構體系，底層使用了Java 生態裡的MVN 進行依賴管理和構建，所有的輪子和釘子都要內部自造，和前端社區越來越遠。
很快支付寶在玉伯的影響下開始嘗試逃脫出這個怪圈，解決辦法是開源。玉伯在一行代碼還沒開始寫之前發了一條微博，我們要用開源的方式打造支付寶下一代前端框架了，這在當時是非常激進的。
2012 年4 月，玉伯剛剛從淘寶轉崗到支付寶，離開了漸漸進入死胡頭的Kissy，手攥著當紅的Sea.js 準備大干一場。兩年前的支付寶前端團隊也進入了團隊技術的轉型期，舊的前端框架需要升級，笨重的開發方式需要演進，雙方一拍即合，Arale 就此誕生。
Sea.js / Arale / spm套件開始在支付寶內部和國內開源界發展起來。開源的工作方式讓貫高偏右們感到非常興奮，雲謙、沉魚和蕭慶也先後從淘寶轉崗到支付寶開始參與新的前端體系的建設。我們去了騰訊深圳本部進行了技術分享，號召騰訊的同學也來使用和共建Sea.js 和Arale 前端社區。現在回頭看來有點天真，雖然是開源技術，當時走的依然是一條前端輪子自研和前端社區自建的道路，最終這條路走沒有成功，Angular 和React 等外部技術體系很快將帶來巨大的衝擊。
前端技術之外，整個支付寶乃至阿里的業務平台也在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 層各司其職：
1、Front-end UI layer 處理瀏覽器層的展現邏輯。通過CSS 渲染樣式，通過JavaScript 添加交互功能，HTML 的生成也可以放在這層，具體看應用場景。
2、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 G rammar of G raphics，並嘗試在螞蟻內推廣落地。 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 數已經突破了5 萬，偏右和勺子正在籌劃antd 4.0，努力把西湖區第一做成太平洋第一。
2019年的沉魚開始從九色鹿轉向雲鳳蝶，探索hpaPaaS智能建站的可能性。
2019 年的貫高們正在用Node.js 搭建下一代Serverless for Frontend 架構，做阿里經濟體小程序云開發的標配。
2019 年的蕭慶和絕雲把AntV 做成了阿里數據可視化的核心技術，還在探索用可視化技術給業務帶來價值。
2019 年的臻兒正在嘗試把螞蟻前端研發搬到雲上，讓下一代研發模式早點到來。
2019 年的御術開始帶領體驗技術部下的平台前端技術部，重走玉伯那年的路。
2019 年的玉伯很久不寫部落格了，他的產品夢和技術夢都在路上，自由夢實現了一半。而另一半也遙遙無期，也近在咫尺。
這是一篇部門招聘貼，我想藉這個機會從自己的視角小結一下體驗技術部這幾年的經歷，也希望能找到和我們意氣相投的未來同事。我們還在路途中，有前進也有折回，各位無論工程師、設計師、產品還是運營，也無論阿里內外，如若有夢，歡迎一起同行。
- 簡歷投遞郵箱：afx-platform-talent @list.alibaba-inc.com
- 阿里轉崗聯繫：玉伯
- 崗位：
- 體驗技術部-平台前端技術部詳細介紹： https://www. yuque.com/afx/platform/ lsouyk
文中時間可能有出入，人名均為阿里花名。
參考鏈接：