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

用户8554144141688
116 阅读3分钟

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

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

1 Node.js的应用场景（why)

01 前端工程化

  • 模块化（js 模块化、css 模块化、资源模块化）

  • 组件化（复用现有的 UI 结构、样式、行为）

  • 规范化（目录结构的划分、编码规范化、接口规范化、文档规范化、Git 分支管理）

  • 自动化（自动化构建、自动部署、自动化测试）

（Node.js在前端工程化方面的地位难以撼动）

02 Web服务端应用

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

03 Electron 跨端桌面应用

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

Node.js在字节跳动的应用：

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

2 Node.js运行时结构(what)

image.png

Node.js运行时结构—— V8，libuv

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

Node.js运行时结构—— 特点

1） 异步I/O

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

image.png

异步I/O好处：执行I/O操作时不需要等待，不需要阻塞整个线程的执行，可以去做别的事情，内存占用会更少，对于JS这种有垃圾回收的语言来说就有更多的内存可以用，就不需要频繁地去释放空间，效率高。

2） 单线程

worker_thread可以起独立线程，但每个线程的模型没有太大变化

  • JS单线程：

    实际：JS线程 + uv线程池 + V8任务线程池 + V8 Inspector线程

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

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

    解决办法：多进程或多线程

3） 跨平台

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

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

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

3 编写Http Server (how)

0）安装Node.js

Mac,Linux 推荐使用nvm。多版本管理。
Windows 推荐nvm4w或是官方安装包。
安装慢，安装失败的情况，设置安装源。

1）编写 Http Server + Client,.收发GET,POST请求

2）编写静态文件服务器

3）编写React SSR服务

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

5）部署简介

编写Http Server-部署

部署要解决的问题：

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

容器环境

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

4 延伸话题 - WASM，NAPI

  • Node.js(因为V8)是执行WASM代码的天然容器，和浏览器WASM是同一运行时，同时Node.js支持WASI。
  • NAPI执行C接口的代码(C/C++/Rust……),同时能保留原生代码的性能。
  • 不同编程语言间通信的一种方案。

5 个人总结与体会

通过本节课，我学习到了有关Node.js在前端开发中的重要知识，Node.js的应用场景、Node.js运行时结构，以及老师还带领我们进行了编写Http Server的实战演练，使我对于Node.js有了更深的理解，收获了非常多有用的知识！

avatar
文章
阅读
粉丝