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

59 阅读4分钟

这是我参与⌈第四届青训营⌋笔记创作活动的第13天。以下内容主要从从为什么要应用、什么是以及如何使用Node.js三方面来描述。

Node.js的应用场景(why)

实现什么效果,达到什么目的、为什么要学习这个

应用

  • 前端工程化

    image.png

  • Web服务端应用

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

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

Node.js运行时结构(what)

本身特点、判断什么场景使用这个及优劣势

image.png

这里重点介绍,nodejs组成部分:v8 engine, libuv, builtin modules, native modules以及其他辅助服务。

v8 engine:主要有两个作用 :①虚拟机的功能,执行js代码(自己的代码,第三方的代码和native modules的代码)②提供C++函数接口,为nodejs提供v8初始化,创建context,scope等。

libuv:它是基于事件驱动的异步IO模型库,我们的js代码发出请求,最终由libuv完成,而我们所设置的回调函数则是在libuv触发。

builtin modules:它是由C++代码写成各类模块,包含了crypto,zlib, file stream etc 基础功能。(v8提供了函数接口,libuv提供异步IO模型库,以及一些nodejs函数,为builtin modules提供服务)。

native modules:它是由js写成,提供我们应用程序调用的库,同时这些模块又依赖builtin modules来获取相应的服务支持

简单总结一下:如果把nodejs看做一个黑匣子,起暴露给开发者的接口则是native modules,当我们发起请求时,请求自上而下,穿越native modules,通过builtin modules将请求传送至v8,libuv和其他辅助服务,请求结束,则从下回溯至上,最终调用我们的回调函数。

特点

  • 异步IO

    image.png

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

    image.png

  • 单线程

    image.png

    JS单线程——实际:JS线程+uv线程池+V8任务线程池+V8 Inspector线程

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

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

    • 解决办法:多进程或多线程
  • 跨平台

    image.png

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

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

编写Http Server(how)

使用最多的一个场景,如何使用去完成一些任务

安装Node.js

image.png

编写Http Server+Client,收发GET,POST请求

Http Server

image.png image.png

Client

image.png

编写静态文件服务器

image.png

与高性能、可靠的服务相比,还差①CDN(缓存+加速)②分布式储存、容灾

外部服务:cloudflare、七牛云、阿里云、火山云...

编写React SSR服务器

SSR特点

  • 相比传统HTML模板引擎,避免重复编写代码
  • 相比SPA(Single Page Application),首屏渲染更快,SEO友好

缺点

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

SSR难点

  • 需要处理打包代码

    image.png

  • 需要思考前端代码在服务端运行的逻辑

    image.png

  • 移除对服务端无意义的副作用,或重置环境

适用Inspector进行调试、诊断
部署简介

部署要解决的问题

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

容器环境

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

延伸话题

基本了解后应该继续朝哪方向去探索

  • Node.js贡献代码

    参考:github.com/joyeecheung…

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

    • 认知:黑盒到白盒,发生问题时能有迹可循
    • 贡献代码的第一部=步
  • 诊断或追踪

    • 诊断是一个低频、重要同时也相当有挑战的方向,是企业衡量自己能否依赖一门语言的重要参考
    • 技术咨询行业中的热门角色
  • WASM,NAPI

    image.png