“前端”工匠系列（二）：合格的工匠，怎么做好價(jià)值落地

此文為系列文章第一篇，為淺嘗輒止的引入，目的是為了讓前端從業(yè)人員及非從業(yè)但是對(duì)此領(lǐng)域感興趣的人對(duì)于”前端“是干什么的這個(gè)話題有個(gè)無門檻的了解。

“前端職能是什么”

說起"前端"，維基百科對(duì)這個(gè)技術(shù)角色的定位是“前端（英語：front-end）和后端（英語：back-end）是描述進(jìn)程開始和結(jié)束的通用詞匯。 前端作用于采集輸入信息，后端進(jìn)行處理。 計(jì)算機(jī)程序的界面樣式，視覺呈現(xiàn)屬于前端。”對(duì)于當(dāng)下服務(wù)于互聯(lián)網(wǎng)各企業(yè)的前端研發(fā)人員來說，這個(gè)崗位定義是很清晰的。前端是個(gè)對(duì)于后端的相對(duì)概念，它的崗位角色更應(yīng)該關(guān)注“采集和呈現(xiàn)”兩個(gè)部分。

從以上的概念來看，前端研發(fā)的正常職責(zé)是通過編碼工作對(duì)數(shù)據(jù)及業(yè)務(wù)邏輯進(jìn)行展示，用戶通過操作界面（或其他交付方式）與系統(tǒng)進(jìn)行交互，最后用戶的交互信息可以按照功能邏輯的預(yù)期傳輸?shù)胶蠖朔?wù)遞交給業(yè)務(wù)后端及更下游的算法層處理。

?

“編碼工作包括什么呢？”

前端研發(fā)人員工作對(duì)接的上游干系人包括產(chǎn)品和UI設(shè)計(jì)，必要輸入有產(chǎn)品文檔和UI設(shè)計(jì)稿件，下游干系人為后端研發(fā)人員，必要的輸出為一整套界面交互及邏輯處理實(shí)現(xiàn)代碼。

產(chǎn)品要向研發(fā)團(tuán)隊(duì)輸出PRD（產(chǎn)品需求文檔Prodcut Requirement Document的簡(jiǎn)稱）來對(duì)此次產(chǎn)品或者迭代的具體的功能細(xì)節(jié)進(jìn)行詳細(xì)的描述，通過需求評(píng)審會(huì)議的方式與研發(fā)人員和設(shè)計(jì)人員進(jìn)行“語言的互通轉(zhuǎn)換及翻譯”工作，得以把所有的產(chǎn)品邏輯向不同專業(yè)人員表達(dá)清晰，這是一切需求交付最重要的環(huán)節(jié)。對(duì)于新增的或者復(fù)雜的需求，需要有交互設(shè)計(jì)人員與產(chǎn)品人員共同輸出交互設(shè)計(jì)稿件，從另外一個(gè)維度對(duì)產(chǎn)品需求邏輯進(jìn)行闡述，對(duì)于前端研發(fā)人員對(duì)于需求理解的清晰程度來看，交互設(shè)計(jì)稿件的嚴(yán)謹(jǐn)和質(zhì)量十分重要。

UI設(shè)計(jì)人員需要根據(jù)產(chǎn)品需求文檔和交互設(shè)計(jì)稿件對(duì)界面的UI風(fēng)格、色系及動(dòng)效等素材進(jìn)行設(shè)計(jì)畫制作，向研發(fā)人員輸出UI設(shè)計(jì)稿件，此項(xiàng)工作需要前端研發(fā)、產(chǎn)品和設(shè)計(jì)人員進(jìn)行多輪溝通以便敲定所有元素細(xì)節(jié)。UI設(shè)計(jì)稿件的設(shè)計(jì)質(zhì)量和對(duì)產(chǎn)品邏輯的描述精細(xì)度，直接對(duì)前端研發(fā)人員的編碼設(shè)計(jì)方式和效率產(chǎn)生影響，前端研發(fā)人員必須對(duì)UI設(shè)計(jì)稿件有足夠的重視，避免在實(shí)現(xiàn)過程中反復(fù)與產(chǎn)品和設(shè)計(jì)人員對(duì)設(shè)計(jì)稿件的細(xì)節(jié)進(jìn)行確認(rèn)甚至重新設(shè)計(jì)。如果這種情況出現(xiàn)，勢(shì)必對(duì)項(xiàng)目的排期產(chǎn)生影響。最后，前端研發(fā)的界面輸出要通過UI設(shè)計(jì)人員的驗(yàn)收測(cè)試才算完成界面編碼工作。

與后端研發(fā)人員的對(duì)接是研發(fā)工作中的重中之重，最終，一整套前后端研發(fā)人員公認(rèn)的經(jīng)過冒煙用例自測(cè)的代碼包才是此階段的合格產(chǎn)出物。接口規(guī)范、約定習(xí)慣以及默契度較高的對(duì)接伙伴，都是業(yè)界不斷在研發(fā)調(diào)試、聯(lián)合調(diào)試以及提測(cè)冒煙過程中提效降本的思路?！耙磺卸际侨说氖隆薄凹s定大于習(xí)慣”這些對(duì)軟實(shí)力、流程的嚴(yán)謹(jǐn)程度都提出了要求。

研發(fā)流程中最后的步驟是UAT驗(yàn)收后上線。上線一定要采用“流水線自動(dòng)化”的方式才行，也就是大家常說的“CI/CD”。只有這樣做，才能保證主干版本代碼與線上代碼版本完全保證一致，不會(huì)因?yàn)槿藶榘炎约罕镜卮a編譯打包后發(fā)布到線上，導(dǎo)致主干分支成為擺設(shè)；所有上線相關(guān)的合并、編譯、打包、發(fā)布等核心流程都是流水線自動(dòng)跑事先部署在流水線各個(gè)節(jié)點(diǎn)的腳本，才能避免人為操作“失誤”導(dǎo)致的線上問題。

“上線了？”

上線是個(gè)很值得探討的話題，因?yàn)閷?duì)于研發(fā)來說，只有上了線并且發(fā)揮了預(yù)期或者超預(yù)期的業(yè)務(wù)價(jià)值的代碼，才算是對(duì)企業(yè)、對(duì)社會(huì)有一點(diǎn)點(diǎn)貢獻(xiàn)，個(gè)人的價(jià)值才能在工作中得以體現(xiàn)。上線完成就是研發(fā)工作的結(jié)束嗎？對(duì)于很多研發(fā)團(tuán)隊(duì)來說，這就是最后一步了。但是，研發(fā)流程僅僅止步于此，是不符合“合格”這個(gè)標(biāo)準(zhǔn)的。一套代碼，只有在上線后，才開始受到真正用戶的親測(cè)使用，研發(fā)人員的產(chǎn)出物才算是“生命開始”。產(chǎn)品功能在用戶的使用中“表現(xiàn)是否符合預(yù)期”、“是否有邊界異?！?、“是否存在打不開頁面的情況”、“是否存在顯示異常的情況”，諸如此類的問題，都應(yīng)該是產(chǎn)研需要關(guān)注的話題。

因此，研發(fā)人員需要預(yù)先在代碼包中預(yù)留與線上真實(shí)用戶“交流”的抓手，通過分析用戶在“可用性和性能”做出可以提升用戶體驗(yàn)的改進(jìn)措施，例如，“特殊邏輯自定義埋點(diǎn)上報(bào)”、“邊界兜底監(jiān)控”、“系統(tǒng)運(yùn)行時(shí)監(jiān)控”等，只有做到了這些，才能說對(duì)一個(gè)用戶功能的真正上線，后續(xù)也才有精細(xì)化運(yùn)營(yíng)的可能?？墒?，對(duì)于很多研發(fā)人來說，“上線即需求的終點(diǎn)”、“線上問題由業(yè)務(wù)反饋”、“有客訴嗎？”都是研發(fā)普遍存在的心理。

那如何通過“預(yù)先”的方式建立與用戶之前的溝通通道呢？因?yàn)榇宋臑榍岸祟I(lǐng)域文章，所以我們此次只說前端部分。

“與用戶交流”

有效的交流是需要以有效的信息為載體的。對(duì)于技術(shù)實(shí)現(xiàn)來說，就是對(duì)核心代碼塊進(jìn)行合理的代碼埋點(diǎn)。當(dāng)特殊用戶行為發(fā)生時(shí)，當(dāng)代碼處理邏輯走向了一個(gè)非正常的處理單元時(shí)，當(dāng)發(fā)生了代碼處理邏輯沒有覆蓋到的情形時(shí)，埋點(diǎn)上報(bào)代碼就會(huì)觸發(fā)執(zhí)行，向中心化的埋點(diǎn)服務(wù)發(fā)送消息。技術(shù)人員通過對(duì)此次用戶行為觸發(fā)的埋點(diǎn)信息的分析，從而得到用戶在瀏覽或操作頁面過程中的“正?；虍惓！鼻闆r的“現(xiàn)場(chǎng)復(fù)現(xiàn)”，當(dāng)然，這種復(fù)現(xiàn)可以是數(shù)據(jù)信息，也可以是截圖或視頻回溯，具體要用什么方式來復(fù)現(xiàn)用戶行為，要以“有效”為目標(biāo)，綜合考慮“用戶流量成本、研發(fā)成本、性能影響以及存儲(chǔ)成本”等因素來最終選型。

“實(shí)時(shí) OR T+1”

對(duì)于業(yè)務(wù)前端用戶行為及觸發(fā)邏輯的監(jiān)控，有實(shí)時(shí)監(jiān)控和異步監(jiān)控兩種。

在實(shí)時(shí)關(guān)注用戶行為、實(shí)時(shí)分析等場(chǎng)景里，需要使用實(shí)時(shí)監(jiān)控，這個(gè)“實(shí)時(shí)”，一般到秒級(jí)就夠用了，一些業(yè)務(wù)使用分鐘級(jí)也是可以的，具體看業(yè)務(wù)的需要。對(duì)于實(shí)時(shí)監(jiān)控，上報(bào)行為是從每一臺(tái)用戶的設(shè)備上觸發(fā)并上報(bào)的，應(yīng)用于大體量業(yè)務(wù)來說，這個(gè)數(shù)據(jù)量的采集、上報(bào)、收集、存儲(chǔ)、分析和報(bào)表的生成，都是相當(dāng)耗費(fèi)資源的。為了降本提效，埋點(diǎn)服務(wù)首先會(huì)對(duì)用戶數(shù)據(jù)按照特殊的規(guī)則（比如正態(tài)分布）進(jìn)行一層比例的抽樣，降低分析及報(bào)表生成過程中對(duì)資源和人力的消耗。

在用戶端日志查詢、特殊邊界場(chǎng)景復(fù)現(xiàn)、日志排查定位故障等場(chǎng)景，“實(shí)時(shí)”就不是必要的，這種場(chǎng)景下一般采用T+1查詢，但是又引入了大量級(jí)日志的存儲(chǔ)周期的話題，一般企業(yè)應(yīng)用級(jí)的用戶日志保存14天就完全夠用了，因?yàn)閷?duì)于C端日志來說，更多的是對(duì)現(xiàn)場(chǎng)故障的復(fù)現(xiàn)、處理及跟進(jìn)，如果算法策略對(duì)用戶日志有需要，只需要在一定時(shí)間內(nèi)采用處理任務(wù)對(duì)用戶日志進(jìn)行一次處理，把輸出的標(biāo)簽、行為特征等關(guān)鍵數(shù)據(jù)存儲(chǔ)就可以，基礎(chǔ)的用戶日志還是應(yīng)該被存檔或清除釋放資源供給更有價(jià)值的最新日志來使用。

綜上所述，實(shí)時(shí)監(jiān)控和非實(shí)時(shí)監(jiān)控分別應(yīng)對(duì)兩種場(chǎng)景：實(shí)時(shí)對(duì)應(yīng)“業(yè)務(wù)可用性、線上運(yùn)行時(shí)異?！钡仁褂迷V求，非實(shí)時(shí)對(duì)應(yīng)“性能指標(biāo)、用戶日志查詢、用戶行為復(fù)現(xiàn)”等使用訴求。

“后續(xù)”

之后會(huì)繼續(xù)講述一些有關(guān)"用戶體驗(yàn)、效率提升、頁面搭建"相關(guān)的話題。

審核編輯 黃宇