在螞蟻的前端工程團(tuán)隊(duì)工作是怎樣一種體驗(yàn)?

作者:茅曉鋒

導(dǎo)讀:打造出Ant Design、AntV等知名開(kāi)源項(xiàng)目的螞蟻體驗(yàn)技術(shù)團(tuán)隊(duì),實(shí)際工作是什么樣子呢?讓我們走近螞蟻前端工程團(tuán)隊(duì)一探究竟。

我是螞蟻前端工程團(tuán)隊(duì)的一位工程師。很多人都以為我們是一群專(zhuān)職“造輪子”的同學(xué)。那么工程團(tuán)隊(duì)真實(shí)的日常工作是些什么呢?以我的觀(guān)察體驗(yàn),大概可以用有趣、有挑戰(zhàn)、有價(jià)值三個(gè)詞來(lái)總結(jié)。這里用幾個(gè)實(shí)際項(xiàng)目給大家做介紹。

有趣:讓“帶薪編譯”變得更快

隨著前端業(yè)務(wù)復(fù)雜度膨脹,團(tuán)隊(duì)項(xiàng)目的云端構(gòu)建速度不可避免地出現(xiàn)了惡化,部分大項(xiàng)目甚至沖破了20min,“帶薪編譯”成了常態(tài)。而工程團(tuán)隊(duì)要做的就是,找到自己和同學(xué)們?cè)跇?gòu)建過(guò)程中的問(wèn)題并加以解決,效率問(wèn)題當(dāng)然也是其中之一。

為了解決構(gòu)建速度的命題,我們做了這些嘗試:

1. 換基礎(chǔ)平臺(tái),構(gòu)建上云!

經(jīng)過(guò)幾輪考察,我們選定了阿里云函數(shù)計(jì)算(FC)作為新的構(gòu)建環(huán)境。

通過(guò)選用高配集群 + webpack多進(jìn)程策略調(diào)優(yōu) + 灰度觀(guān)察,部分業(yè)務(wù)的構(gòu)建耗時(shí)直接降到了60%左右。實(shí)踐證明,函數(shù)計(jì)算不僅加加速了編譯過(guò)程,它免運(yùn)維的特性也使我們能更專(zhuān)注在前端構(gòu)建本身的建設(shè)上。

2. 歷史任務(wù)回放,在發(fā)布前做好評(píng)估

構(gòu)建腳本升級(jí)一直是高危變更。為了確保不產(chǎn)生意外的breaking change,我們搭建了“流量回放”能力,通過(guò)重跑歷史項(xiàng)目源碼 + 新腳本,比對(duì)前后效果,盡可能把bug暴露在發(fā)布前。

借助構(gòu)建服務(wù)在云端快速擴(kuò)容的特性,我們?cè)诿看伟l(fā)布前都會(huì)進(jìn)行數(shù)千次回放、尋找潛在變更點(diǎn),由此幫助框架組做好發(fā)布決策。

3. 蘋(píng)果m1來(lái)了

蘋(píng)果新發(fā)布了m1芯片mac mini,發(fā)布后我們?cè)诘谝粫r(shí)間就發(fā)起了采購(gòu)。實(shí)測(cè)證明,m1的性能大幅領(lǐng)先現(xiàn)有各大平臺(tái),這對(duì)日常研發(fā)、構(gòu)建服務(wù)都是巨大利好。

但集群運(yùn)維、虛擬化依然充滿(mǎn)不確定性,如何把它送到云端運(yùn)行,我們?nèi)栽趯で蠼夥?..

在螞蟻的前端工程團(tuán)隊(duì)工作是怎樣一種體驗(yàn)?

圖:m1 mac mini測(cè)試機(jī)已就位!

把云計(jì)算、webpack、高性能PC等產(chǎn)品做成組合拳,趁著新技術(shù)新平臺(tái)的紅利,讓編譯速度起飛吧

有挑戰(zhàn):試試把安卓云真機(jī)推送到桌面?

Android App的調(diào)試環(huán)境一直面臨流程復(fù)雜、機(jī)型長(zhǎng)尾等問(wèn)題。由于測(cè)試覆蓋不足,這甚至引發(fā)了幾起線(xiàn)上bug。

為了緩解這個(gè)問(wèn)題,我們考慮向內(nèi)網(wǎng)云真機(jī)平臺(tái)尋求協(xié)助,使研發(fā)同學(xué)在桌面上連接云真機(jī)、把遠(yuǎn)端真機(jī)調(diào)試映射成本地Chrome調(diào)試。

項(xiàng)目開(kāi)動(dòng)后,我們才發(fā)現(xiàn)坑比夢(mèng)想大...現(xiàn)有云平臺(tái)的速度、延遲、瀏覽器內(nèi)UI操控體驗(yàn)遠(yuǎn)達(dá)不到本地桌面級(jí)的效果。于是團(tuán)隊(duì)小哥又被迫成為了調(diào)優(yōu)工程師,在機(jī)型選配、adb協(xié)議、底層網(wǎng)絡(luò)、桌面視頻渲染各個(gè)節(jié)點(diǎn)尋求優(yōu)化。

截止上周,我們第一次跑通了遠(yuǎn)程真機(jī),鄰座小哥熱淚盈眶....

在螞蟻的前端工程團(tuán)隊(duì)工作是怎樣一種體驗(yàn)?

圖:終于跑通了遠(yuǎn)程真機(jī)

App是前端業(yè)務(wù)的重要環(huán)境,日常在真實(shí)環(huán)境調(diào)試代碼能大幅降低踩坑的概率

有價(jià)值:小程序IDE,爭(zhēng)議和探索

小程序開(kāi)發(fā)者工具(IDE)是我們團(tuán)隊(duì)投入度較高的項(xiàng)目,也常常是挑戰(zhàn)和爭(zhēng)議的匯聚地。但不管怎么樣,對(duì)業(yè)務(wù)有價(jià)值的事情,我們就要去做。

這其中最大的爭(zhēng)議來(lái)自于產(chǎn)品形態(tài):vscode已占領(lǐng)前端IDE的半壁江山、命令行構(gòu)建是前端業(yè)界常態(tài),我們重兵投入IDE領(lǐng)域的意義是什么?專(zhuān)業(yè)開(kāi)發(fā)者對(duì)IDE有各自的偏好,我們真能取悅所有用戶(hù)嗎?

在螞蟻的前端工程團(tuán)隊(duì)工作是怎樣一種體驗(yàn)?

圖:小程序IDE產(chǎn)品

在團(tuán)隊(duì)產(chǎn)品經(jīng)理(是的, 前端兼職產(chǎn)品經(jīng)理!)組織的幾番大爭(zhēng)論之后,我們決定為IDE新增Lite模式,主打“輕量”體驗(yàn),專(zhuān)注在調(diào)試器、預(yù)覽、小程序SDK的核心功能體驗(yàn)上,其余環(huán)境工具還給開(kāi)發(fā)者自由選擇。

在螞蟻的前端工程團(tuán)隊(duì)工作是怎樣一種體驗(yàn)?

圖:IDE Lite模式與vscode結(jié)合開(kāi)發(fā)

歷經(jīng)數(shù)月閉關(guān)、首批用戶(hù)嘗鮮,支持Lite模式的小程序IDE已經(jīng)發(fā)布了第一個(gè)Beta版本,用戶(hù)反饋和Bugfix工作也在繼續(xù)進(jìn)行。未來(lái)還我們將配套發(fā)布vscode編碼插件。

項(xiàng)目中我們需要同時(shí)承擔(dān)功能研發(fā)和產(chǎn)品規(guī)劃的雙線(xiàn)職責(zé),為產(chǎn)品價(jià)值負(fù)責(zé),這可能是“造輪子”中最有挑戰(zhàn)的一個(gè)話(huà)題

未來(lái)還有啥?

云計(jì)算、IoT、客戶(hù)端動(dòng)態(tài)技術(shù)、low code平臺(tái).... 隨著技術(shù)生態(tài)前進(jìn),前端的武器庫(kù)和業(yè)務(wù)領(lǐng)域都在不斷擴(kuò)展。

在前端效能、工程能力的方向上,如果你也有興趣一起探索,歡迎加入我們一起探索!

螞蟻體驗(yàn)技術(shù)團(tuán)隊(duì)招聘長(zhǎng)期開(kāi)放,上海、杭州、北京、成都,歡迎來(lái)聊!

在螞蟻的前端工程團(tuán)隊(duì)工作是怎樣一種體驗(yàn)?

(免責(zé)聲明:本網(wǎng)站內(nèi)容主要來(lái)自原創(chuàng)、合作伙伴供稿和第三方自媒體作者投稿,凡在本網(wǎng)站出現(xiàn)的信息,均僅供參考。本網(wǎng)站將盡力確保所提供信息的準(zhǔn)確性及可靠性,但不保證有關(guān)資料的準(zhǔn)確性及可靠性,讀者在使用前請(qǐng)進(jìn)一步核實(shí),并對(duì)任何自主決定的行為負(fù)責(zé)。本網(wǎng)站對(duì)有關(guān)資料所引致的錯(cuò)誤、不確或遺漏,概不負(fù)任何法律責(zé)任。
任何單位或個(gè)人認(rèn)為本網(wǎng)站中的網(wǎng)頁(yè)或鏈接內(nèi)容可能涉嫌侵犯其知識(shí)產(chǎn)權(quán)或存在不實(shí)內(nèi)容時(shí),應(yīng)及時(shí)向本網(wǎng)站提出書(shū)面權(quán)利通知或不實(shí)情況說(shuō)明,并提供身份證明、權(quán)屬證明及詳細(xì)侵權(quán)或不實(shí)情況證明。本網(wǎng)站在收到上述法律文件后,將會(huì)依法盡快聯(lián)系相關(guān)文章源頭核實(shí),溝通刪除相關(guān)內(nèi)容或斷開(kāi)相關(guān)鏈接。 )