这是我参与「第五届青训营 」笔记创作活动的第5天。
一、重点内容
- Node.js介绍
- SSR介绍
二、详细知识点介绍
Node.js介绍
应用场景
- 前端工程化
在浏览器之外跑js的代码,利用操作系统的API来帮完成一些任务。 - Web服务端应用
运行效率接近编译语言。
社区生态丰富及工具链成熟。(npm,v8 inspector)
与前端结合的场景。(SSR:期望把前端的代码用在模板渲染,让他自动生成html,基本只有用Node.js)(BFF:) - Electron跨端桌面应用
(例:vscode)
Node.js运行时结构
v8引擎:诊断调试工具
libuv:事件循环,跨平台的ui操作
特点:
1.异步I/O
当执行i/o操作时,会在响应返回后恢复操作,而不是阻塞线程并占用额外内存等待。相比多线程内存占用少。
2.单线程
指的是js主线程是单线程的。实际JS线程+uv线程池(四个,避免对主线程产生比较大的阻塞:例如加密解密)+V8任务线程池+V8 Inspector线程(例如调试工具)。
优点:不用考虑多线程状态同步(不需要锁);比较高效地利用系统资源。(但要考虑异步的问题)
缺点:对延时非常敏感的场景不适合用。
3.跨平台
Node.js跨平台+JS无需编译环境(+Web跨平台+v8诊断工具跨平台)所以学习和开发成本低。
SSR介绍
- 相比传统HTML模板引擎:避免重复编写代码。
- 相比SPA:首屏渲染更快。相比SEO:更友好。
- 缺点:通常qps较低,前端代码编写时需要考虑服务端渲染情况。
- SSR难点: 1.需要处理打包代码。例如写的时候想要用common JS的require语句把css文件加载,最终webpage动态的把css的文件加载进来。可能要改一下,或者绕过。 需要思考前端代码在服务端运行时的逻辑是否符合预期。例:我们从服务端拉数据然后来渲染。拉数据的操作应该在什么时候做呢。 3.移除对服务端无意义的副作用,或重置环境。例:因为一些应用场景的需要,把数据挂到全局windows对象上,但在node往global上挂的,要从window拿出来渲染其实是没有关联的,要考虑这些副作用的问题。
三、实践例子
Node.js编写Http Server
技巧:promise(只适合被调用一次的)+async await代替callback
Node.js编写简单的静态服务器
拿到url 更高性能、更可靠的服务: 1.CDN:缓存+加速 2.分布式储存
四、个人总结
Node.js是前端无论如何绕不开的一个重要知识点,这节课只是对它有了一个初步的学习认识,需要课下多理解底层的逻辑并且在后续的学习中进一步加深对它的认识和理解。