前言
我為什么會(huì)思考這個(gè)問題行冰？這得從一篇演講稿說起：
前端搞基建|堂主 - 如何推動(dòng)前端團(tuán)隊(duì)的基礎(chǔ)設(shè)施建設(shè) - 知乎
上文最初大概是在2020年4窄锅、5月份的時(shí)候看到的（當(dāng)時(shí)還是在語雀上藻肄，不過現(xiàn)在鏈接已經(jīng)失效，好在知乎上面還找得到）间学，作者在上述演講稿中詳盡地介紹了其團(tuán)隊(duì)在一年多的時(shí)間內(nèi)如何從零到一構(gòu)建了龐大的前端基礎(chǔ)設(shè)施體系殷费，以及這些基礎(chǔ)設(shè)施到底起到了多大的作用；整篇演講稿看完真是令人恍然大悟低葫，原來前端可以如此高效以及成體系详羡，看完后我真是對該團(tuán)隊(duì)擁有的前端基礎(chǔ)設(shè)施垂涎三尺，然后臆想了一下在如此高效的前端體系中工作應(yīng)該是一件很幸福的事情嘿悬。
不過实柠，考慮到文中這種龐大的、成熟的前端基礎(chǔ)設(shè)施是建立在龐大的前端團(tuán)隊(duì)以及超多的前端業(yè)務(wù)場景的積累下建設(shè)而成的善涨，那么小團(tuán)隊(duì)怎么辦主到？
于是很自然地我就想到了這個(gè)問題，也在一直試圖尋找這個(gè)問題的答案躯概；在經(jīng)過2020年內(nèi)大半年的在團(tuán)隊(duì)內(nèi)部的基建實(shí)踐（比較初級(jí)）后登钥，我想也許是時(shí)候回答和整理這個(gè)問題的思路了。
小團(tuán)隊(duì)的現(xiàn)實(shí)問題
考慮到現(xiàn)實(shí)娶靡，畢竟大多數(shù)前端團(tuán)隊(duì)不像大廠那樣有豐富的團(tuán)隊(duì)人員配置牧牢，大多數(shù)還是很小的團(tuán)隊(duì)，小團(tuán)隊(duì)在實(shí)施基建時(shí)就不可避免的遇到很現(xiàn)實(shí)的阻力：
- 最大的阻力應(yīng)該就是受限于團(tuán)隊(duì)規(guī)模小姿锭，無法投入較多精力處理作用于直接業(yè)務(wù)以外的事情
- 其次應(yīng)該是團(tuán)隊(duì)內(nèi)部對于基建的必要性和積極性認(rèn)識(shí)不夠（夠用就行的思想）
小團(tuán)隊(duì)基建的必要性
綜合上面的現(xiàn)實(shí)問題塔鳍，是否就可以認(rèn)為前端基建就是大廠/大團(tuán)隊(duì)的專屬權(quán)利和義務(wù)呢？畢竟看起來有點(diǎn)無法下手和吃力不討好的樣子呻此；
在我看來轮纫，所謂的基建就是一切可以提升編碼效率、團(tuán)隊(duì)協(xié)作效率及業(yè)務(wù)魯棒性的工具和方法的集合焚鲜；只要是項(xiàng)目還在迭代掌唾、擴(kuò)展放前，就不可避免地遇到新的問題以及效率瓶頸，更不用說很多項(xiàng)目內(nèi)的業(yè)務(wù)痛點(diǎn)糯彬；目前很多的項(xiàng)目內(nèi)問題解決路徑就是：直到問題出現(xiàn)才會(huì)去解決問題（甚至是到問題嚴(yán)重的時(shí)候才會(huì)去解決問題）凭语；
這就是基建最核心的價(jià)值：幫助業(yè)務(wù)更好的活在未來。[1]
我很認(rèn)同上面這句話撩扒，基建不僅可以幫助提升當(dāng)下的效率似扔，還可以避免一些問題的出現(xiàn)，以便業(yè)務(wù)更好地可持續(xù)發(fā)展搓谆；
小團(tuán)隊(duì)?wèi)?yīng)該建設(shè)哪些基礎(chǔ)設(shè)施炒辉？
考慮到基建的必要性和小團(tuán)隊(duì)的現(xiàn)實(shí)問題，我給出的答案是：
- 優(yōu)先級(jí)：優(yōu)先發(fā)展投入產(chǎn)出比大的地方
- 范圍：著眼于自身業(yè)務(wù)沉淀及業(yè)務(wù)需求
- 自動(dòng)化程度：量力而行泉手，不要一開始就追求大團(tuán)隊(duì)所擁有的成體系的自動(dòng)化前端基建辆脸，推薦“局部研發(fā)鏈路的自動(dòng)化”
在設(shè)計(jì)工具的相關(guān)交流中，我們還發(fā)現(xiàn)了有的團(tuán)隊(duì)開始把交互相關(guān)的功能也做了進(jìn)去螃诅，例如將頁面跳轉(zhuǎn)啡氢，后端處理流程邏輯等進(jìn)行了可視化編輯，自動(dòng)生成相應(yīng)的接口和流程代碼术裸。這種探索可以概括成：“局部研發(fā)鏈路的自動(dòng)化”倘是。它是一個(gè)初期提效很有用的方法。在對外交流中我們發(fā)現(xiàn)了兩點(diǎn)有用的建議：
一是任何團(tuán)隊(duì)都可以并且也都應(yīng)該做袭艺，不必覺得自己團(tuán)隊(duì)研發(fā)實(shí)力不夠搀崭，等大公司推出相應(yīng)方案。局部自動(dòng)化的關(guān)鍵其實(shí)對自己的業(yè)務(wù)和人員分工的一種總結(jié)和思考猾编。在技術(shù)上瘤睹，當(dāng)自己的業(yè)務(wù)相對確定時(shí)，通過一些簡單的方法就能實(shí)現(xiàn)答倡。而大公司要考慮的大而全轰传，不一定適合。在人員組織上瘪撇，幾乎所有的自動(dòng)化方案都有一定的分工要求获茬，這也是因組織而異的。局部的自動(dòng)化是之后整體架構(gòu)變革的關(guān)鍵前提倔既。[2]
投入產(chǎn)出比較大的地方
- 規(guī)范文檔：個(gè)人覺得規(guī)范文檔應(yīng)當(dāng)是整個(gè)基建中的靈魂恕曲，因?yàn)?strong>規(guī)范文檔可以看做是整個(gè)團(tuán)隊(duì)的共識(shí)，在沒有共識(shí)的情況下開展基建不免會(huì)遇到很多不理解的地方渤涌；而且制訂相應(yīng)的規(guī)范可以先參考業(yè)界常用的佩谣，然后再具體討論內(nèi)部的細(xì)節(jié)，花費(fèi)的時(shí)間不需要太多实蓬，但是帶來的收益絕對是極大的（有效地提升團(tuán)隊(duì)協(xié)作共識(shí)和效率）茸俭；
- 業(yè)務(wù)（通用）組件：前端項(xiàng)目隨著業(yè)務(wù)擴(kuò)展吊履，就會(huì)自然地抽象出可以被復(fù)用的業(yè)務(wù)組件，這也是一種業(yè)務(wù)沉淀瓣履；不過個(gè)人覺得組件的產(chǎn)出流程應(yīng)該納入基建中，加以規(guī)范和流程化练俐，否則容易造成組件復(fù)用率不高袖迎、擴(kuò)展性不強(qiáng)，耦合度過高等問題腺晾；
- 工具函數(shù)：實(shí)際上跟業(yè)務(wù)組件類似燕锥，只是組件在前端項(xiàng)目內(nèi)偏向于視圖層，而工具函數(shù)就是邏輯層悯蝉，同樣地工具函數(shù)的產(chǎn)出流程也應(yīng)當(dāng)規(guī)范化归形；
- 代碼檢測：這個(gè)實(shí)際上是配合代碼規(guī)范文檔進(jìn)行的一種輔助手段，因?yàn)榭谡f無憑鼻由，規(guī)范畢竟不是一種實(shí)體性質(zhì)的東西暇榴，實(shí)際編碼過程中可能出現(xiàn)不遵守和遺忘代碼規(guī)范的情況，如果缺乏一種強(qiáng)制手段來檢測規(guī)范的執(zhí)行蕉世，那么代碼相關(guān)的規(guī)范約束力就會(huì)大打折扣蔼紧；事實(shí)上，如今社區(qū)已經(jīng)存在各種相應(yīng)成熟的代碼檢測工具狠轻，只需要根據(jù)內(nèi)部約定的規(guī)范做一些修改配置就夠了奸例；
- 腳手架：當(dāng)公司業(yè)務(wù)項(xiàng)目之間出現(xiàn)高度的相似時(shí)，則可以利用腳手架將之前沉淀的項(xiàng)目配置規(guī)范化向楼，完成項(xiàng)目創(chuàng)建流程的規(guī)范化查吊，可以滿足項(xiàng)目快速創(chuàng)建的目的，且項(xiàng)目初始化工作顯著減少還可以復(fù)用已經(jīng)沉淀的一些項(xiàng)目配置湖蜕；
基建實(shí)踐
說了這么多逻卖，那么如何在項(xiàng)目中實(shí)施前端基建呢？這里以我在內(nèi)部的某個(gè)項(xiàng)目實(shí)踐為例：
- 項(xiàng)目背景：
APP配套使用的業(yè)務(wù)后臺(tái)昭抒；前期工作是從老項(xiàng)目中遷移（重構(gòu)）箭阶，后期加入各種新增模塊； - 項(xiàng)目特點(diǎn)：模塊繁多戈鲁，某些模塊功能相似度很高仇参，表單復(fù)雜度較大；
上圖就是我在項(xiàng)目中大概做的一些基建相關(guān)實(shí)踐的概況婆殿；
公共組件產(chǎn)出流程
渲染模型/DSL
其他
基建的效果
- 團(tuán)隊(duì)協(xié)作效率提升诈乒，規(guī)范性明顯增強(qiáng)
- 通過前期組件/公共的積累和沉淀，后續(xù)開發(fā)速度明顯提升（搭積木式開發(fā)）
- 代碼復(fù)用率明顯提高婆芦，減少復(fù)制粘貼次數(shù)
后話
嘗試基建可以收獲很多
在項(xiàng)目中積極實(shí)踐/推進(jìn)基建后我才發(fā)現(xiàn)怕磨，原來嘗試基建可以收獲到很多東西：
- 對前端項(xiàng)目整體會(huì)有更深喂饥、更本質(zhì)的認(rèn)識(shí)，能夠找出更多的業(yè)務(wù)及編碼痛點(diǎn)
- 可以拓展提效的更多思路肠鲫，接觸到更多高效的編碼體系及工具
- 可以加強(qiáng)全局觀念员帮，認(rèn)識(shí)到各種架構(gòu)、解決方案的具體適用場景导饲，然后嘗試提出更適用于具體業(yè)務(wù)場景下的架構(gòu)及解決方案
簡言之捞高，積極嘗試基建不僅可以對當(dāng)下項(xiàng)目提效，還能提升自我解決問題的能力渣锦；在這不到一年的實(shí)踐中腦海里已經(jīng)閃出了各種各樣的解決方案硝岗，有的是已經(jīng)應(yīng)用了，更多的則是還在探索和檢驗(yàn)中袋毙，總之收獲了很多靈感：
基建沒有終點(diǎn)
我個(gè)人覺得只要是項(xiàng)目還在發(fā)展/迭代型檀，基建就沒有終點(diǎn)；這一點(diǎn)從大廠的實(shí)踐來看也是一樣的听盖，大廠們正齊步從可視化搭建（半自動(dòng)化）邁向智能化搭建（全自動(dòng)化）的探索之路胀溺；
相關(guān)文檔
- 前端搞基建|堂主 - 如何推動(dòng)前端團(tuán)隊(duì)的基礎(chǔ)設(shè)施建設(shè) · 語雀：已失效
- 前端 DSL 實(shí)踐指南（上）—— 內(nèi)部 DSL - 知乎
- 如何從業(yè)務(wù)代碼中提升技術(shù)：使用領(lǐng)域特定語言消除重復(fù)代碼 - 知乎
- 前端搞基建|Scott - 如何在人單力薄時(shí)立項(xiàng)推動(dòng)基建 · 語雀
