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

101 阅读4分钟

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

​一∶Node.js应用场景

1.前端工程化

2.​Web服务端应用

​3.Electron跨端桌面应用

Bundle:webpack,vite,esbuild,parcel

Uglify:uglifyjs

Transpile:bablejs,typescript

其他语言加入竞争: esbuild,parcel,prisma

现状: 难以替代

Node.js的应用场景-Web服务端应用

1.学习曲线平缓,开发效率较高

2.运行效率接近常见的编译语言

3.社区生态丰富及工具链成(npmV8inspector)

4.与前端结合的场景会有优势(SSR)

5.现状:竞争激烈,Node.js有自己独特的优势

Node.js的应用场景-Electron 跨端桌面应用

商业应用:vscode,slack,discord,zoom

大型公司内的效率工具

现状:大部分场景在选型时,都值得考虑

Node.js的应用场景-Node.js在字节

BFF应用、SSR应用,举例:Modern.j

服务端应用,举例:头条搜索,西瓜视频,懂车帝

Electron 应用:飞连,飞书

每年新增1000+Node.js应用

二∶Node.js运行时的结构

V8:JavaScript Runtime诊断调试工具(inspector)

libuv:eventloop(事件循环),syscall(系统调用)

举例:用node-fetch发起请求时...

特点∶

​异步I/O

​单线程(指node.js加速的线程是单线程)

​跨平台(一般不用考虑,node.js基本都会完成)

Node.js 运行时结构-异步 IO

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

Node.js运行时结构-单线程

JS单线程

  实际:JS线程+UV线程池+V8任务线程池+V8Inspector线程

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

缺点:阻塞会产生更多负面影响 解决办法:多进程或多线程

Node.js运行时结构-跨平台

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

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

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

三∶编写http sercer

编写Http Server - SSR

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

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

​相比SPA (single page application):首屏渲染更快,SEO友好

​缺点:通常qps较低,前端代码编写时需要考虑服务端渲染情况

编写 Http Server-Debug

V8 Inspector:开箱即用、特性丰富强大、与前端开发一致、跨平台

1.node --inspect

2.​ppen http://localhost:9229

场景:

1.查看 console.log 内容

2.​breakpoint

3.​高CPU、死循环:cpuprofile

4​.高内存占用:heapsnapshot

5.​性能分析

编写HttpServer -部署

部署要解决的问题

1.守护进程:当进程退出时,重新拉起

​2.多进程:cluster 便捷地利用多进程

​3.记录进程状态,用于诊断

容器环境∶

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

四.延伸话题

延伸话题-Node iS贡献代码

快速了解 Node.js代码

Node.js Core 贡献入门

好处

1.从使用者的角色逐步理解底层细节,可以解决更复杂的问题;

​2.自我证明,有助于职业发展;

​3.解决社区问题,促进社区发展;

难点: 花时间

延伸话题-编译 Node.js

为什么要学习编译 Node.js

1.认知:黑盒到白盒,发生问题时能有迹可循

​2.贡献代码的第一步

如何编译

1.参考:Maintaining the build files

2​./configure &&make install

3.​演示:给net 模块添加自定义属性

延伸话题-诊断/追踪

诊断是一个低频、重要同时也相当有挑战的方向。是企业衡量自己能否依赖一门语言的重要参考。

​技术咨询行业中的热门角色。

​难点:

1.需要了解Node.js底层,需要了解操作系统以及各种工具

2.需要经验

延伸话题-WASM, NAPI

Node.js(因为V8)是执行WASM代码的天然容器,和浏览器WASM是同一运行时,同时Node.js支持WASI。

​NAPI执行C接口的代码(C/C Rust...),同时能保留原生代码的性能。

​不同编程语言间通信的一种方案。