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

星倦756
45 阅读3分钟

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

一、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-20230131194952839.png

引用自：github.com/joyeecheung…

特点

  1. 异步：比如setTimeout。
  2. 单线程：node.js从12开始，worker_thread可以起独立线程，但每个线程的模型没有太大变化。
  3. 跨平台：使用linux下的socket

单线程

JS单线程

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

跨平台

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

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

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

三、编写Http Server

本节目标：

  1. 安装Node.js
  2. 编写Http Server + Client,收发GET, POST请求
  3. 编写静态文件服务器
  4. 编写React SSR服务
  5. 适用inspector进行调试、诊断
  6. 部署简介

安装Node.js

  • Mac, Linux推荐使用nvm。多版本管理。
  • Windows推荐nvm4w或是官方安装包。
  • 安装慢，安装失败的情况，设置安装源。
NVM_NODEJS_ORG_MIRROR=https://npmmirror.com/mirrors/node nvm install 16

问题：SSR (server side rendering)有什么特点?

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

  • 相比SPA (single page aplication) :首屏渲染更快，SEO 友好

  • 缺点:

    • 通常qps较低，前端代码编写时需要考虑服务端渲染情况。

部署：

  • 部署要解决的问题

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

  • 容器环境

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

四、 延伸话题

Node.js贡献代码

  • 快速了解Node.js代码

    • Node.js Core贡献入门]

  • 好处:

    • 从使用者的角色逐步理解底层细节，可以解决更复杂的问题;
    • 自我证明，有助于职业发展;
    • 解决社区问题，促进社区发展;

  • 难点:

    • 花时间

编译Node.js

为什么要学习编译Node.js

  • 认知：黑盒到白盒，发生问题时能有迹可循
  • 贡献代码的第一步

如何编译

  • 参考：Maintaining the build files
  • ./configure &&make install
  • 演示：给net模块添加自定义属性

WASM,NAPI

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