这是我参与「第五届青训营」伴学笔记创作活动的第 4 天

一、本堂课重点内容：

• Node.js 的应用场景
• Node.js 运行时结构
• 编写 Http Server

二、详细知识点介绍：

Node.js 的应用场景

前端工程化

• Bundle：webpack，vite，esbuild，parcel
• Uglify：uglifyjs
• Transpile：bablejs，typescript

Web 服务端应用

• 学习曲线平缓，开发效率较高
• 运行效率接近常见的编译语言
• 社区生态丰富及工具链成熟（npm，V8 inspector）
• 与前端结合的场景有优势（SSR）

Electron 跨端桌面应用

• 大型公司内的效率工具
• 商业应用：vscode，slack，discord，zoom

Node.js 运行时结构

• V8：JavaScript Runtime，诊断调试工具
• libuv：eventloop，syscall

特点

异步 I/O

当 Node.js 执行 I/O 操作时，回在响应返回后恢复操作，而不是阻塞线程并占用额外内存等待

单线程

• JS 单线程

  • JS 线程 + uv 线程池 + V8 任务线程池 + V8 Inspector 线程

• 优点：不用考虑多线程状态同步问题，也不需要锁；同时还能比较高效地利用系统资源

• 缺点：阻塞产生更多负面影响

跨平台

• Node.js 跨平台 + JS 无需编译环境（+ Web 跨平台 + 诊断工具跨平台）
• 开发成本低，整体学习成本低

编写 Http Server

安装 Node.js

• Mac，Linux 推荐使用 nvm，可进行多版本管理

• Windows 推荐 nvm4w 或者官方安装包

• 安装慢，可以设置安装源

  • NVM_NODEJS_ORG_MIRROR=npmmirror.com/mirrors/nod… nvm install 16

Http Server

const http = require('http')

const port = 3000

const server = http.createServer((req, res) => {
    res.end('hello')
})

server.listen(port, () => {
    console.log('server listens on: ${port}')
})

Promisify

使用 Promise + async await 重写

将 callback 转换成 promise

Promise 主要运用在只调用一次的回调函数上

function wait(t) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve()
        }, t)
    })
}

wait(1000).then(() => { console.log('called') })

React SSR

SSR 特点

• 相比传统 HTML 模板引擎：避免重复编写代码
• 相比较 SPA：首屏渲染更快，SEO 更加友好
• 缺点：通常 QPS 较低，前端代码编写时需要考虑服务端渲染情况

SSR 难点

• 需要处理打包代码
• 需要思考前端代码在服务端运行时的逻辑
• 移除对服务端不意义的副作用，或重置环境

部署

• 守护进程
• 多进程
• 记录进程状态，用于诊断