馬天琦-探索類型友好的 Node.js Web 框架（GOTC深圳會場）（48頁）.pdf

1、大前端新趨勢專場馬天琦 2021年08月01日本期議題：探索類型安全的 Node.js Web 框架自我介紹馬天琦字節跳動 Web Infra 團隊成員Farrow 核心開發者探索類型安全的 Node.js Web 框架探索類型安全的 Node.js Web 框架 類型安全 Node.js Web 框架現狀現狀 當前 API 設計中的類型問題 Farrow 的類型安全方案 Farrow 未來的規劃 總結類型安全 What&Why?類型安全什么是類型安全定義：變量的行為與它的類型相匹配，不存在運行時的類型錯誤例子 0：訪問 null 的屬性（null.foo()）例子 1：將 string 類型

2、當作 number 類型做運算例子 2：調用對象中不存在的方法類型安全為什么要追求類型安全Well typed programs cannot go wrong.A Theory of Type Polymorphism in ProgrammingRobin Milner 1978.盡可能在編譯期通過類型檢查提前捕獲可能的程序錯誤，提高代碼的健壯性配合編輯器類型提示，類型檢查是比單元測試反饋更快、更早、覆蓋更全面的實時測試符合類型安全準則的代碼，往往是設計更合理、質量更高、編寫更優雅的、表達更清晰的Node.js Web 框架現狀現狀Node.js Web 框架當前 API 設計中的類型問題

3、Express類型問題Hanging Request可以不響應可以遠遠掛起請求無法在編譯期得到約束和提醒類型問題Wrong Response無法在編譯期約束 header-body 的響應次序無法在編譯期約束只發送一次 body類型問題Monkey Patching修改 req/res 污染全鏈路中間件的類型動態追加屬性或方法，與靜態標注的類型有本質矛盾靜態類型決定能否賦值給屬性，而非屬性賦值決定是否包含特定類型類型問題No Runtime ValidationTypeScript 類型在編譯后都被抹去在 Input/Output，parse/stringify 中需要運行時類型檢查類型問題P

4、oor Type Inference類型推導不友好自動類型轉換不友好需要編寫繁瑣的類型轉換和防御邏輯類型問題總結Hanging Request（請求意外掛起）Wrong Response（錯誤響應內容）Monkey Patching（篡改對象屬性）No Runtime Validation（無運行時驗證）Poor Type Inference（不友好的類型推導）etc.類型問題總結Hanging Request（請求意外掛起）Wrong Response（錯誤響應內容）Monkey Patching（篡改對象屬性）No Runtime Validation（無運行時驗證）Poor Type I

5、nference（不友好的類型推導）etc.只靠*.d.ts，并不能獲得充分的類型友好和類型安全特性類型問題總結基于 Express/Koa 可以用打補丁的方式解決一兩種類型問題，但不能從根本上解決問題Fastify 提供了基于 JSON Schema 的運行時校驗請求內容的方案，但方案與類型系統不貼合要充分解決系統性問題，則需要基于 TypeScript 做全盤的思考類型優先開發（Type-First Development）類型驅動開發（Type-Driven Development）類型問題類型安全的服務端框架設計目標Prevent Hanging Request（阻止請求意外掛起）Re

6、fuse Wrong Response（拒絕錯誤響應內容）No need to Monkey-Patching（無需篡改對象屬性）Embedded Runtime-Validation（內置運行時驗證）Excellent Type Inference（出色的類型推導）etc.類型問題類型安全的服務端框架設計目標Prevent Hanging Request（阻止請求意外掛起）Refuse Wrong Response（拒絕錯誤響應內容）No need to Monkey-Patching（無需篡改對象屬性）Embedded Runtime-Validation（內置運行時驗證）Excellen

7、t Type Inference（出色的類型推導）etc.Farrow作者：做到之前做不到的，做好之前能做到的Farrow 作者介紹工業聚前端架構師函數式編程愛好者開源實踐者 react-lite:React v15.0 的輕量級實現(2016)react-imvc：React SSR 框架(2017)graphql-bff：基于 GraphQL 的 BFF 框架(2019)pure-model:面向 Model 層的邏輯跨端框架(2020)farrow：類型安全的 Node.js Web Framework(2021)Farrow 的類型安全方案類型安全方案：farrow-httpPreve

8、nt Hanging Request&Refuse Wrong ResponseResponse as Return Type類型安全方案：farrow-httpPrevent Hanging Request&Refuse Wrong ResponseTypeScript 能夠檢查函數返回值類型是否滿足約束忘記響應或者響應錯誤的類型，都能得到類型檢查類型安全方案：farrow-httpPrevent Hanging Request&Refuse Wrong Response類型安全方案：farrow-httpPrevent Hanging Request&Refuse Wrong Respon

9、se類型安全方案：farrow-httpPrevent Wrong Response新的響應對象模型Response.text 等方法構造數據，多次使用將合并最終統一按照正確方式處理 header 和 body類型安全方案：farrow-httpNo need to Monkey-Patching新的請求對象結構request 參數并非原生 req 對象，而是從中提取的 plain datanext(newRequest)可以向后傳遞新的 request 對象，無需修改原對象類型安全方案：farrow-httpNo need to Monkey-Patchingnext()返回下游中間件的 r

10、esponse 對象無需修改 responseImmutable 比 Mutable 更加類型友好類型安全方案：farrow-httpNo need to Monkey-PatchingContext+Hooks跨中間件傳遞 Context Data無需掛載到 req/res 對象利用 Async Hooks 讓 Context+Hooks 更強大的 類型安全方案：farrow-httpEmbedded Runtime-Validation&Excellent Type Inference提供基于 Schema 的 Runtime Validation 機制通過 Schema 描述 reque

11、st 的 Shape通過 type infer 推導出 request type類型安全方案：farrow-httpEmbedded Runtime-Validation&Excellent Type Inference基于 TypeScript 4.1 的 Template Literal Type從 URL 模式中提取類型自動識別 params 和 query自動將 String 轉換成標記的 Int、Boolean 等類型類型安全方案：farrow-httpFarrow 運用 Type-First Development 思想和 React 啟發的函數式/immutable 理念，系統性

12、地提升了 Web Framework 的類型安全水平Prevent Hanging Request（阻止請求意外掛起）Refuse Wrong Response（拒絕錯誤響應內容）No need to Monkey-Patching（無需篡改對象屬性）Embedded Runtime-Validation（內置運行時驗證）Excellent Type Inference（出色的類型推導）etc.類型安全方案新的挑戰以上方案只優化了 Service Side 的類型安全，只解決了一半問題End-to-end Typing 將是一個新問題Client Side 如何復用 Service Side

13、的類型？Client Side 類型如何跟 Service Side 保持一致和同步？類型安全方案新的挑戰重新思考 BFF（Backend For Frontend）應該為前端提供什么？傳統 BFF：為前端提供 Data現代 BFF：為前端提供 Data 和 Type下一代 BFF：為前端提供 Data，Type 和 Code類型安全方案：farrow-api新的挑戰Introspection+Codegen提供類似 GraphQL 的 Introspection 機制支持拉取 API 的 Schema 數據通過 Codegen 生成 Typescript Type 和 HTTP Client

14、 Code類型安全方案：farrow-apiIntrospection+Codegen生成類型安全方案：farrow-api定義 Schema類型安全方案：farrow-api開發接口類型安全方案：farrow-api客戶端調用類型安全方案：farrow-api客戶端生成代碼類型安全方案：farrow-api客戶端調用Farrow 的未來規劃未來規劃 業務框架現狀 豐富 Middleware/Hooks Demo+最佳實踐 Playground生態基礎能力 Federation 接口聚合 結合 ORM，進一步提升類型安全 提供強大便捷的 Mock 能力類型安全方案Bonus:farrow-express&farrow-koa通過 adapter 可復用 Express/Koa 等生態farrow-express：將 Farrow 運行在 Express App 上farrow-koa：將 Farrow 運行在 Koa App 上總結 類型安全的定義及其價值 當前 Node.js Web 框架中存在的類型問題 Farrow 如何通過類型優先和函數式的思路，系統性地改善類型問題 Farrow 如何貫通前后端類型 現在立刻能就在 Express/Koa 等應用中使用 Farrow 的方式 Farrow 以及其它追求類型安全的框架將來要解決的問題THANKS