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

105 阅读2分钟

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

image.png

前言

学习nodejs有两点好处,一是学习的成本比较低,能提高我们的开发效率;二是社区生态丰富工具链成熟;该篇笔记记录的是初步认识node.js和其前端开发实战

一、nodejs的介绍

简单的说 Node.js 就是运行在服务端的 JavaScript。

Node.js 是一个基于 Chrome JavaScript 运行时建立的一个平台。

Node.js 是一个事件驱动 I/O 服务端 JavaScript 环境,基于 Google 的 V8 引擎,V8 引擎执行 Javascript 的速度非常快,性能非常好。

Node.js的应用场景

i. 前端工程化

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

ii.Web服务端应用

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

iii.Electron跨端桌面应用

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

Node.js运行时结构

image.png
  • V8:javaScript Runtime,诊断调试工具(inspector)
  • libuv:eventloop(事件循环),syscall(系统调用)

异步I/O

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

image.png

JS单线程

实际:JS线程+uv线程池+V8任务线程池+V8 inspector线程

优点: 不用考虑多线程状态同步问题,也就不需要锁;同事还能比较高效的利用系统资源

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

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

跨平台

Node.js跨平台+JS无需编译环境(+Web跨平台+诊断工具跨平台) = 开发成本低,学习成本低

服务端渲染(Server Side Render)的特点和缺点

  • 相比较传统的HTML模板引擎,避免重复编写代码
  • 相比SPA:首屏渲染更快,SEO友好

缺点:维护性较差。不利于二次开发。

SSR难点

  1. 需要处理打包代码
  2. 需要思考前端代码在服务端运行的逻辑问题
  3. 移除对服务端无意义的副作用,或者重置环境