Node.js 与前端开发实战 | 青训营笔记

60 阅读2分钟

这是我参与「第四届青训营 」笔记创作活动的第2天

Node.js 的应用场景

前端工程化

  • Bundle:webpack,vite,esbuild,parcel
  • Uglify:uglifyjs
  • Transpile:bablejs,typescript
  • 其他语言加入竞争:esbuild,parcel,prisma
  • 现状:难以替代

web服务端应用

  • 学习曲线平缓,开发效率较高
  • 运行效率接近常见的编译语言
  • 社区生态丰富及工具链成熟(npm,V8 inspector)
  • 与前端结合的场景会有优势(SSR)
  • 现状:竞争激烈,Node.js有独特优势

Electron跨端桌面应用

  • 商业应用:vscode,slack,discord,Zoom
  • 大型公司内的效率工具
  • 现状:大部分场景在选型时,都值得考虑

Node.js运行时结构

image.png

特点

  • 异步I/O
  • 单线程
  • 跨平台

单线程

  • JS单线程 实际:JS线程+uv线程池+V8任务线程池+V8 Inspector线 程
  • 优点:不用考虑多线程状态同步问题,也就不需要锁;同时还能比 较高效地利用系统资源;
  • 缺点:阻塞会产生更多负面影响 解决办法:多进程或多线程

跨平台

  • 跨平台(大部分功能、api)

  • Node.js跨平台+JS无需编译环境(+Web跨平台+诊断工具跨平台)

  • 开发成本低(大部分场景无需担心跨平台问题),整体学习成本低

编写Http Server

步骤:

  1. 安装Node.js
  2. 编写Http Server + Client,收发GET POST 请求

React SSR

SSR (server side rendering)的特点:

相比传统HTML模版引擎: 避免重复编写代码

相比 SPA (single page application): 首屏渲染更快, SEO友好

缺点: 通常 qps 较低,前端代码编写时需要考虑服务端渲染情况

部署

部署要解决的问题:

  • 守护进程:当进程退出时,重新拉起
  • 多进程:cluster便捷地利用多进程
  • 记录进程状态,用于诊断

容器环境:

  • 通常有健康检查的手段,只需考虑多核 cpu 利用率即可