活動中台：揭秘vivo的千萬級DAU活動中台

本書講解瞭如何將企業的營銷活動開發和運營能力通過中台標準化和敏捷化，
實現對前端需求的快速響應和後端能力的整合復用，從而提升企業營銷能力和營銷效果。
本書的內容來自於vivo官方的實踐，vivo的活動中台“悟空”是各行業競相學習和效仿的標杆。
本書從業務、產品和技術的角度對悟空中台的業務設計、技術架構、
核心技術、實現思路、應用實踐等做了全面的講解。
全書一共7章，可以分為三個部分：
第1部分 活動中台前世今生（第1~3章）
首先介紹了傳統活動開發的模式和瓶頸，
然後介紹了vivo結合中台理念探索出的一套創新性的活動開發模式，
z後介紹了活動中台的功能架構和業務設計。
第二部分 活動中台架構設計（第4~5章）
從前端的視角講解瞭如何利用微前端和H5等技術實現活動中台的架構設計和落地，
不僅講解了活動中台的架構與實現，而且還包含諸如微前端架構、
可視化搭建、H5性能優化、H5跨屏動態適配等大量技術細節。
第三部分 活動中台技術探索（第6~7章）
這部分內容是 vivo中台團隊對智能活動製作的探索與設想。
不僅向讀者介紹了中台配套的服務端Nodejs技術，
而且還介紹了中台團隊在活動中台上進行的低代碼實踐。

朱明鵬

一位具有豐富可視化搭建經驗的技術專家，有近10年的軟件開發與架構經驗。
先後就職於亞信科技、途牛旅遊網，積累了豐富的前後端開發經驗，
曾負責並參與多個大型系統軟件的基礎架構和業務平台的設計與研發工作。
目前是vivo互聯網產品平台部系統架構師，
領導低代碼效能工具的設計研發和和大前端領域的技術探索。

序一
序二
序三
前言
第一部分 活動中台的前世今生
第1章 傳統活動開發遇到的困境  3
1.1 活動開發的3種模式  3
1.2 如何抽象整合活動平台  6

第2章 活動開發模式創新  8
2.1 “將平台交出去”的創新設計  8
2.2 讓研發人員也成為平台的用戶  10
2.3 原來這就是活動中台  12

第3章 活動中台業務設計  15
3.1 中台功能架構設計  15
3.1.1 問題背景  15
3.1.2 產品介紹  16
3.1.3 產品矩陣  17
3.1.4 功能架構  17
3.2 落地頁管理—作品中心  18
3.2.1 作品卡片  19
3.2.2 作品狀態  20
3.2.3 作品短鏈  20
3.2.4 批量管理  21
3.2.5 作品組  22
3.2.6 數據分析  23
3.3 作品的齒輪—組件與任務  24
3.3.1 組件類型  24
3.3.2 任務組件  27
3.4 物料管理—素材中心  30
3.4.1 素材上傳  31
3.4.2 素材管理  33
3.5 訪問控制—權限中心  34
3.5.1 常見的權限設計模式  34
3.5.2 權限系統的實現  36
3.5.3 權限隔離設計  41
3.6 活動工廠—H5可視化搭建  44
3.6.1 元素區  45
3.6.2 設計區  45
3.6.3 配置區  47
3.6.4 頁面管理區  52
3.6.5 功能區  54
3.7 數據服務設計  56
3.7.1 組件服務  57
3.7.2 編譯服務  57
3.7.3 數據服務  58

第二部分 活動中台架構設計
第4章 微前端架構設計  63
4.1 微組件概述  63
4.1.1 Vue 單文件組件  64
4.1.2 構建 UMD 規範  64
4.1.3 構建微組件基座  67
4.2 微組件狀態管理  70
4.2.1 傳統EventBus方案  70
4.2.2 天然的解決方案Vuex  71
4.3 微組件基座設計  77
4.3.1 組件沙箱  77
4.3.2 沙箱通信  85
4.4 通用可視化中的微組件  91
4.4.1 擴展微組件  91
4.4.2 定制化基座  92
4.4.3 組件動畫  95
4.5 熱編譯微組件工程  100
4.5.1 微組件生成活動頁  100
4.5.2 服務端活動編譯加速  107
4.6 可視化搭建微信小程序  109
4.6.1 基於uni-app的微組件  110
4.6.2 微組件編譯微應用  124

第5章 H5 性能優化實踐  130
5.1 H5性能檢測  130
5.1.1 Lighthouse  130
5.1.2 關鍵指標解析  132
5.2 H5渲染加速優化  136
5.2.1 網絡層優化  136
5.2.2 圖像優化  140
5.3 圖片高效加載方案  142
5.3.1 圖片服務架構設計  142
5.3.2 實戰中WebP的應用  148
5.3.3 提升WebP的兼容性  150
5.4 網頁秒開探索  153
5.4.1 網頁渲染模式  153
5.4.2 WebView 秒開方案  157
5.5 H5跨屏動態適配方案  162
5.5.1 普適性佈局方案  162
5.5.2 H5在滿屏下的痛點  165
5.5.3 預設性的優化  167
5.5.4 預設規則的實現  170

第三部分 活動中台技術探索
第6章 Node.js在中台應用上的實踐  179
6.1 企業級 NPM 私服實踐  179
6.1.1 安裝部署Verdaccio  180
6.1.2?利用NRM來使用私有源  183
6.1.3 內置插件擴展私服能力  184
6.1.4 自定義tag管理多環境插件  185
6.2?Node.js數據持久層的探索  187
6.2.1 數據持久層現狀與思考  188
6.2.2?探索數據持久層  191
6.2.3 工程化體系加持下的未來  204
6.3 Node.js 應用全鏈路追踪技術  206
6.3.1 Node.js 全鏈路信息獲取的方式  207
6.3.2 zone-context方案設計  208
6.4 Node.js搭建自動化文檔工作流  216
6.4.1 自動化文檔生成器  217
6.4.2 自動化文檔部署  221

第7章 中台之上的低代碼開發平台  226
7.1 H5生產力的迷與思  226
7.1.1 低復用場景下的弊端  226
7.1.2 零代碼與低代碼  228
7.1.3 低代碼模式下的活動開發  230
7.2 構建本地低代碼工具  233
7.2.1 低代碼工具設計  233
7.2.2 基於Vue代碼的工程可視化工具  236
7.3 智能化的活動中台  247
後記  249