大家好，我卡頌。

最近我們技術(shù)群發(fā)生個(gè)事兒，我覺得還挺有代表性的。有時(shí)候，技術(shù)問題的最優(yōu)解并不是從技術(shù)考慮。

對于工作時(shí)間不長的程序員，這篇文章可能對你有幫助。

事情起因

事情起因是一位同學(xué)在群里問：“怎么獲取react element對應(yīng)dom中的文本？”

為什么想獲取文本內(nèi)容呢，原來他是想做「交互的打點(diǎn)上報(bào)功能」。

他希望這個(gè)打點(diǎn)上報(bào)功能是完全自動化、業(yè)務(wù)無感知的。但這里存在一個(gè)悖論：如果打點(diǎn)上報(bào)是“業(yè)務(wù)無感知的”，那打點(diǎn)功能肯定要和業(yè)務(wù)解耦。既然和業(yè)務(wù)解耦，就無法記錄“業(yè)務(wù)的完整操作鏈路”。

那么類似“用戶點(diǎn)擊了一個(gè)按鈕，我想知道這個(gè)按鈕是否在對話框中，如果在，取出對話框的標(biāo)題上報(bào)”就無法實(shí)現(xiàn)。

想一想，如果是你，會怎么實(shí)現(xiàn)這個(gè)功能呢？

功能實(shí)現(xiàn)

這位同學(xué)的做法是 —— 梳理現(xiàn)有業(yè)務(wù)邏輯中的組件層級，從特定的層級里拿數(shù)據(jù)。

比如Modal組件的標(biāo)題渲染成HTML是：

<div>
  <h1>這里是標(biāo)題</h1>
</div>

那么他會按div -> h1這樣的層級結(jié)構(gòu)取標(biāo)題數(shù)據(jù)。具體實(shí)現(xiàn)還涉及很多hack的方法。

比如，組件沒有掛載時(shí)如何獲取數(shù)據(jù)？他通過把組件掛載在一個(gè)離屏DOM上，再分析他：

function analyzeCpn(node: ReactNode) {
  const div = document.createElement('div');
  const root = reactDOM.createRoot(div);
  flushSync(() => root.render(node));
  // ...分析 div.innerHTML
}

再比如，如何根據(jù)DOM不同，增加一些特殊的屬性呢？可以覆寫jsx、React.createElement方法。

問題

這么實(shí)現(xiàn)，當(dāng)前項(xiàng)目確實(shí)沒問題。但有個(gè)很現(xiàn)實(shí)的問題：隨著業(yè)務(wù)不斷迭代，如果哪天組件結(jié)構(gòu)變了，按以往結(jié)構(gòu)獲取數(shù)據(jù)就會失敗，難道我還得跟著業(yè)務(wù)一起改打點(diǎn)上報(bào)代碼么？

一個(gè)打點(diǎn)上報(bào)功能硬生生開發(fā)成了爬蟲功能。

但是，這位同學(xué)并不覺得這有問題。從他的回答看，他的思想是 —— 技術(shù)問題就應(yīng)該交給技術(shù)解決。

實(shí)際上有時(shí)候，技術(shù)問題的最優(yōu)解并不是從技術(shù)考慮。就像遇到產(chǎn)品的不合理需求，我們首先思考的，不應(yīng)該是“如何實(shí)現(xiàn)他”，而是“從哪個(gè)角度把需求懟回去”。

就本文的例子來說，一種合理的解決方式是：

• 調(diào)研一下主流打點(diǎn)上報(bào)庫的實(shí)現(xiàn)邏輯。
• 調(diào)研完畢后和領(lǐng)導(dǎo)溝通。
• 溝通好后讓領(lǐng)導(dǎo)拉個(gè)會，會上把你的方案跟大家同步一下，讓大家知道上報(bào)方案如何實(shí)現(xiàn)。
• 各個(gè)業(yè)務(wù)同學(xué)認(rèn)領(lǐng)自己那部分的打點(diǎn)上報(bào)需求，遇到技術(shù)問題和你溝通，你輔助解決。

總結(jié)

作為搞通用服務(wù)的同學(xué)，要接近業(yè)務(wù)，又不能讓自己陷入業(yè)務(wù)。

回到本文的例子，如果你替業(yè)務(wù)同學(xué)實(shí)現(xiàn)了業(yè)務(wù)邏輯打點(diǎn)上報(bào)還不知會他們。未來業(yè)務(wù)需求變化導(dǎo)致代碼變化后，打點(diǎn)上報(bào)有誤，這是誰的鍋呢？

業(yè)務(wù)同學(xué)會說：我根本不知道打點(diǎn)這回事兒啊。

到時(shí)候你就欲哭無淚了。

所以，明確自己的工作職責(zé)，做好向上管理，不是所有技術(shù)問題都得靠技術(shù)解決。