郵件模板也能組件化？這家公司的1200行代碼瘦身術(shù)

每個(gè)產(chǎn)品團(tuán)隊(duì)最終都會(huì)在郵件系統(tǒng)上撞墻：welcome.html膨脹成1200行的單體怪物，復(fù)制粘貼的樣式在各模板間永遠(yuǎn)對(duì)不齊，營(yíng)銷(xiāo)團(tuán)隊(duì)的一個(gè)小改動(dòng)搞崩了賬單郵件，A/B測(cè)試要花一周才能上線，因?yàn)?模板引擎"躺在沒(méi)人敢碰的文件夾里。

郵件是現(xiàn)代產(chǎn)品工程中最后一塊還在容忍這種混亂的領(lǐng)地。UI早已組件化，后端早已組件化，但事務(wù)性和生命周期郵件仍然是服務(wù)內(nèi)部用HTML字符串拼貼而成。

Bit公司把每封郵件模板——?dú)g迎信、賬單、組織邀請(qǐng)、密碼重置、通知——都作為獨(dú)立、版本化、可組合的組件來(lái)管理。郵件的每個(gè)片段（標(biāo)題、段落、CTA按鈕、卡片、頁(yè)腳）都是獨(dú)立組件，每封完整模板再把這些片段組合起來(lái)。

他們的思路很直接：郵件就是UI，只不過(guò)渲染在Gmail里而不是瀏覽器里，工程問(wèn)題一模一樣。于是套用相同模式：小組件組合成大組件，跨團(tuán)隊(duì)分發(fā)。

整個(gè)系統(tǒng)分三層，各自有獨(dú)立的命名空間：最底層是UI原語(yǔ)——email-title、email-paragraph、email-link、email-action、email-card，每個(gè)組件返回內(nèi)聯(lián)樣式的HTML字符串；中間層是模板，如welcome-email、password-reset-request、billing/payment-failed，導(dǎo)入所需原語(yǔ)渲染完整文檔；頂層是Aspect，單個(gè)email aspect暴露基于插槽的API，任何服務(wù)可注冊(cè)郵件提供商（Resend、SES、SendGrid），任何功能可請(qǐng)求發(fā)送郵件。

關(guān)鍵是版本獨(dú)立性。email-action發(fā)布v1.2新增屬性，welcome-email可按自己的節(jié)奏接入，billing/payment-failed完全不用關(guān)心這些變化。每個(gè)節(jié)點(diǎn)都是獨(dú)立版本化的Bit組件，解決了傳統(tǒng)郵件系統(tǒng)中牽一發(fā)而動(dòng)全身的耦合噩夢(mèng)。