8.7 Node.js 与前端开发实战

这是我参与「第四届青训营 」笔记创作活动的第15天。 这节课主要介绍了Node.js开发的一些基础知识和应用。

应用场景

首先是前端工程化的场晨。 随着模块化、transpile逐渐成熟、需求逐渐增多，对后端能力的需求也逐新强烈。 反过来说，也正是Node.js赋子了js开发者在浏览器外运行代码的能力，加速催生了这些项目的出现。

第二个常见的场景是使用Node,js开发Web服务端应用，也就是后端服务。这里我们特别提一下vercel这家公司

最后要再说下Electron应用，这里不只是指electron,还包括nw,j小s；这个场晨在较大的企业里面非常常见。

前端工程化

前端工程化的常用工具--

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

Web服务端应用

SSR 服务端渲染

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

Electron跨端桌面应用

运行时结构

N-API通过js无法满足的需求，可能需要用更Native的语言于js通信

libuv 操作系统的API

zlib 常见的文件压缩

c-ares DNS查询

llhttp http协议的解析

OpenSSL 网络层面的加密解密工具

V8, libuv

V8 JS运行时

• 解释型语言效率比较高，基于V引擎

libuv

• 封装操作系统的API, 跨平台的I/O操作

特点

异步、单线程、跨平台

异步

单线程

⚓ Node.js的文件操作支持同步调用和异步调用，根据Libuv官网的介绍，我们知道它没有跨平台的异步文件IO可以使用，所以它的异步文件IO是通过在线程池中执行同步文件IO实现的。 生产者消费者模型。Libuv的线程包括2部分，一个是主线程，一个是线程池。主线程的一部分工作是描述任务并将其提交给线程池，线程池进行处理。拿异步文件操作为例，**主线程**生成一个描述文件操作的对象，将其提交到**任务队列**；**线程池**从任务队列获取该对象进行处理。其中主线程是生产者，线程池中的线程是消费者，任务队列是生产者和消费者之间的桥梁。

跨平台

React SSR

SSR 即(server side rendering) SSR的特点：

• 相比传统HTML模版引擎：避免重复编写代码
• 相比SPA(single page application):首屏渲染更快，SEO友好 缺点：
• 通常qps较低，前端代码编写时需要考虑服务端渲染情况

难点：

• 需要处理打包代码
• 需要思考前端代码在服务端运行时的逻辑
• 移除对服务端无意义的副作用，或重置环境

More

诊断追踪

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

难点：

• 需要了解Node,js底层，需要了解操作系统以及各种工具
• 需要经验