Node.js Web 框架再进化 - 面向前端与未来标准

1. 第十六届 D 2 前端技术论坛 Node.js Web 框架再进化面向前端与未来标准淘系技术部 - Node.js 架构组 - 刘子健（繁易）

2. ! 刘子健 / 繁易 / Lxxyx " 淘系技术部 - 前端技术 - Node.js 架构 - 前端技术专家 # Node.js & Serverless & Web Framework Midway.js Core Member Node.js Core Collaborator Alibaba Delegate

3. Node.js & Web 框架简述目录 Midway - 面向前端的框架演进之路未来 - 面向标准 & 规划

4. Node.js & Web 框架简述

5. Node.js 可用于编写 CLI 处理数据 Restful Api 页面渲染 ……

6. Web 开发 & Web 框架 Web 框架功能 • 现代 Web 开发离不开 Web 框架 • Web 框架提供了高效开发 Web 应用的方式 Restful API 数据库 CRUD • Web 框架存在适用场景与规则约束页面渲染身份校验

7. Node.js Web 框架的三个阶段起步 & 轻量 • Node.js 刚起步 • 前端工程师尝鲜 • 验证 Node.js Web 场景可行性 • 主打：轻量 & 极简

8. 起步期 • 极简 & 易学 • 易于集成 • Express(Nest / Webpack) • Koa(Egg / Midway) • 生态繁荣 & 久经考验 • 缺乏规范 & 最佳实践 • 不利于团队协作 & 大规模开发 • Express 年久失修

9. Node.js Web 框架的三个阶段起步 & 轻量企业 & 架构 • Node.js 刚起步 • Node.js 规模化落地 • 前端工程师尝鲜 • 专业 Node.js 工程师出现 • 验证 Node.js Web 场景可行性 • 主打 • 主打：轻量 & 极简 • 企业级框架 & 架构 • 规模化 & 团队协作

10. 企业级框架 Express Fastify • 大而全，功能完善 • 规范 & 最佳实践明确，易于团队协作 • 社区生态活跃 Egg Koa Koa Midway Express Egg • 大而全，上手成本高 • 限制多，较难拓展

11. Node.js Web 框架的三个阶段起步 & 轻量面向前端企业 & 架构 • Node.js 刚起步 • Node.js 规模化落地 • Node.js 成熟 & 完善 • 前端工程师尝鲜 • 专业 Node.js 工程师出现 • 前端工程师人数跃升 • 验证 Node.js Web 场景可行性 • 主打 • 主打 • 主打：轻量 & 极简 • 企业级框架 & 架构 • 面向前端框架设计 • 规模化 & 团队协作 • 简洁 & 轻量

12. 全栈框架 • For 前端，全栈开发 • 简单易学 • 支持 Serverless 部署 • 后端功能弱 • 自定义拓展困难 • 强依赖于平台支持

13. Node.js Web 框架满意度调研（stateofjs 2020） Next.js 登顶 & Express.js 仍然备受关注

14. 总结 • Node.js Web 框架迭代与前端行业发展密切相关 • 前端应用场景多于纯 Node.js 后端场景 • 面向前端设计的全栈框架兴起，Node.js 用法回归简洁 & 轻量

15. Midway - 面向前端的框架演进之路

16. 2014 7

17. Midway @ 2018 - 从企业级起步 TypeScript 静态类型多人协作 IoC 复杂架构面向接口编程 Egg 统一框架复用生态 Midway Demo

18. Ali Node.js @ 2019 集团 1600+ Node.js 应用常年 cpu 利用率 < 10%，乃至 5% 前端维护乏力 Docker、进程，限流，日志、跨语言服务器利用率低传统应用的缺点限制了 Node.js 在阿里的进一步发展 DevOps 成本高前端业务诉求： “ 后端往大后台下沉，前端往小前台发力，提升生产力。 ” “ 前端同学希望将中台服务快速组合为各类业务接口，和端侧同步快速交付前台，以更快的响应业务需求变化来帮助业务试错。 ” 需要赋能前端，让云原生给前端降本增效

19. Node.js Serverless 搭建服务 Serverless 智能化 IDE 2019-2020 阿里经济体前端委员会四大技术方向

20. 挑战：用户群体割裂前端工程师 Node.js 工程师偶尔写接口希望简单易上手全职 Node.js 开发注重复杂场景的应对能力如何在一个框架下服务好两种用户？

21. 挑战：使用场景不同简单场景要求快速实现 CRUD、接口聚合可能演进为复杂场景企业级场景注重可维护性依赖注入、整洁架构如何在一个框架下支持两种场景？

22. 挑战：前端范式变更 React Hooks Vue Composition Api Class Component 向 Function + Hooks 转变

23. 挑战：前端范式变更同一个开发者，前后端思维不同框架有没有可能支持函数式开发，又能与 OOP 并存？

24. 解法：渐进式设计 Midway 一体化应用 Modern Web 场景化 API Schedule Message 一体化调用 Socket 组件生态生态编码范式服务生态 Task Cache Mongo Logger ORM Swagger Redis Validate Decorator 多平台支持 … 三方模板支持 Hooks CORE Midway 核心 BaseFramework Container App Hook Context hook RequestContainer 多工具链 … …

25. Hooks：函数即接口

26. Hooks：获取请求上下文获取 URL 查询参数自定义 Hooks

27. Hooks：面向全栈应用设计

28. Hooks：简化接口调用 1 导入函数 2 调用函数并使用返回值

29. 渐进式 - 像搭积木一样演进项目类型开发方式拓展组件触发器 IoC + 装饰器 Config HTTP 部署平台 Middleware WebSocket 纯接口项目 Server ORM 一体化项目 gRPC Swagger 函数式 Cache RabbitMQ FaaS

30. 渐进式 - 像搭积木一样演进项目类型开发方式拓展组件触发器 IoC + 装饰器 Config HTTP 部署平台 Middleware WebSocket 纯接口项目 Server ORM 一体化项目 gRPC Swagger 函数式 Cache RabbitMQ FaaS 前端一体化应用

31. 渐进式 - 像搭积木一样演进项目类型开发方式拓展组件触发器 IoC + 装饰器 Config HTTP 部署平台 Middleware WebSocket 纯接口项目 Server ORM 一体化项目 gRPC Swagger 函数式 Cache RabbitMQ FaaS 复杂的企业级应用

32. 渐进式 - 像搭积木一样演进项目类型开发方式拓展组件触发器 IoC + 装饰器 Config HTTP 部署平台 Middleware WebSocket 纯接口项目 Server ORM 一体化项目 gRPC Swagger 函数式 Cache RabbitMQ FaaS 随着时间流逝复杂度增加的应用

33. 落地情况 2020.04 2500+

34. 总结 • 企业内仍存在简单场景与复杂场景，框架设计应考虑到此问题 • Node.js Web 框架应关注开发者体验，面向前端工程师设计 • 云 + 端的研发模式将成为未来的主流研发模式

35. 未来 - 面向标准 & 规划

36. 类型安全 MySQL 生成 Prisma Client PostgreSQL SQLite

37. 类型安全从前端到后端再到数据库的全链路类型安全方案

38. 展望：云端融合 JS Module Blocks(Stage 2) JS Module Fragments(Stage 1)

39. 展望：云端融合 - 与前端委员会标准化小组推进 TC39 提案 - 反馈场景 & 谋求推进至 Stage 2 Github tc39/proposal-module-fragments/issues/14

40. 让 Node.js Web 开发更简单 & 有趣 Thanks