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

01.Node.js的应用场景（why）

前端工程化

Bundle：webpack, vite, esbuild, parcel
Uglify：uglifyjs
Transpile：bablejs, typescript
其他语言加入竞争：esbuild（go）, parcel（rust）, prisma
现状：难以替代

Web服务端应用

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

Electron跨端桌面应用

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

Node.js在字节

BFF应用、SSR应用，举例：Modern.js
服务端应用，例如：头条搜索，西瓜视频，懂车帝
Electron应用：飞连，飞书
每年新增1000+ Node.js应用

02.Node.js运行时结构（what）

V8,libuv

V8：JavaScript Runtime，诊断调试工具(inspector)
libuv：eventloop(事件循环)，syscall (系统调用)
举例：用node-fetch发起请求时...

特点

异步IO

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

单线程

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

跨平台

跨平台(大部分功能、api)
Node.js跨平台+JS无需编译环境(+ Web 跨平台+诊断工具跨平台)
- = 开发成本低(大部分场景无需担心跨平台问题)，整体学习成本低

03.编写Http Server（how）

0.安装Node.js

Mac,Linus推荐使用nvm。多版本管理。 Windows推荐nvm4w或是官方安装包。

1.编写Http Server+Client，收发GET、POST请求

编写Http Server：

Hello，World

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}')
})

json：

const server = http.createServer((reg,res)=>{
  const bufs =[]
  req.on('data', data=> { 
    bufs.push(data)
})
req.on('end',() => {
  let reqData = {}
  try { 
    reqData = JSON.parse(Buffer.concat(bufs).toString())
    } catch (err){
// receive invalid json data
}
res.setHeader('Content-Type', 'application/json')
res.end(JSON.stringify({
  echo: reqData.msg || 'Hello",
  ))
 })
})

Http Client：

Promisify：

用Promise + async await重写这两个例子。技巧：将callback转换成promise

2.编写静态文件服务器

const http = require("http")
const fs = require("fs")
const path = require("path")
const url = require("url")
const port = 3000

const server = http.createServer((req,res)=>{
    const info = url.parse(req,url)
    const file = fs.createReadStream(path.resolve(__dirname,".",info.pathname))
    file.pipe(res)
})

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

与高性能、可靠的服务相比，还差什么？

CDN：缓存+加速
分布式储存，容灾

3.编写React SSR服务

SSR (server side rendering)特点：
- 相比传统HTML模版引擎: 避免重复编写代码
- 相比 SPA (single page application): 首屏渲染更快, SEO友好
- 缺点: 通常 qps 较低，前端代码编写时需要考虑服务端渲染情况
HTML例子
替换成React

4.适用inspector进行调试、诊断

debug

5.部署简介

部署要解决的问题：
- 守护进程：当进程退出时，重新拉起
- 多进程：cluster便捷地利用多进程
- 记录进程状态，用于诊断
容器环境
- 通常有健康检查的手段，只需要考虑多核cpu利用率即可

04.延伸话题

Node.js贡献代码

快速了解Node.js代码
- Node.js Core贡献入门
好处:
- 从使用者的角色逐步理解底层细节，可以解决更复杂的问题；
- 自我证明，有助于职业发展；
- 解决社区问题，促进社区发展；
难点:
- 花时间

编译Node.js

为什么要学习编译Node.js
- 认知:黑盒到白盒，发生问题时能有迹可循
- 贡献代码的第一步
如何编译
- 参考:Maintaining the build files
- ./configure && make install
- 演示:给net模块添加自定义属性

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