當前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

狼叔直播 Reaction《学习指北：Node.js 2022 全解析》

發布時間：2023/12/9 编程问答 36 豆豆

生活随笔收集整理的這篇文章主要介紹了狼叔直播 Reaction《学习指北：Node.js 2022 全解析》小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

大家好，我是若川。持續組織了6個月源碼共讀活動，感興趣的可以點此加我微信 ruochuan02?參與，每周大家一起學習200行左右的源碼，共同進步。同時極力推薦訂閱我寫的《學習源碼整體架構系列》?包含20余篇源碼文章。歷史面試系列

本文是狼叔在 2 月 16 日在掘金直播《學習指北：Node.js 2022 全解析》的 Reaction，狼叔的直播干貨很多，本文盡量保證原內容的同時，額外加入了一些相關資料和鏈接，方便你學習。

Node.js 2021

Node 2021 開發者報告鏈接^[1]

Node 2021 開發者報告解析

Node.js 好像不是很火了？其實不然。

從 Node.js 源碼更新內容來看，Node.js 正在健康平穩的發展、從可用到好用在轉變，在易用性上有很大提升。性能的牌打完了，開始打“用戶體驗”的牌。

核心產出 async_hooks、profiling、tracing、dump debug、report 等。讓開發者能以更低的門檻提升 Node.js 應用的開發體驗。

1.開發框架變化較大，造輪子變少，TS 變多，使用企業級框架變多

Egg.js 在國內使用普及率很高，而 Midway 和 Nest 增長較快，和 TypeScript 普及有一定關系。

2.版本更新變化較大，升級比較積極

去年主要是使用 Node12，2021 年 Node14 占比將近一半，更新還是較快的。

(如果你想優化性能，最好的辦法就是升級 Node 版本：）)

3.吐糟變多，意味著用的人變多，趨于成熟

“世界上只有兩種語言，一種是沒有人用的語言，一種是被抱怨的語言。”

4.出圈：年齡分布較去年比變大，使用工種也變得比較豐富

整個 Node 社區不再只是圍繞前端工程師去做，后端、全棧工程師、架構師甚至運維、技術總監都有一定的接觸，在校生和實習生也有一定的使用量。

5.使用困惑：性能優化，內存泄漏以及 npm 依賴

6.未來：從業經驗越高則越關注性能和 Serverless

從業經驗越高則越關注 WebAssembly (WASI) 和 N-API。
越年輕的同學越關注 Serverless。

好東西里藏著的趨勢

1.clipanion

clipanion 倉庫鏈接^[2]

class?FooCommand?extends?Command?{static?paths?=?[[`foo`]];async?execute()?{this.context.stdout.write(`Foo\n`);} }class?BarCommand?extends?Command?{static?paths?=?[[`bar`]];async?execute()?{this.context.stdout.write(`Bar\n`);} }

TS + 面向對象 + 模板模式十分優雅。

clipanion 是一個沒有運行時依賴的類型安全 CLI 庫。Yarn v2 版本^[3] berry 源碼中用到了它。包括 Node.js 中新增的 Corepack(包管理器的管理器，用來管理 npm、yarn、pnpm、cnpm等) 也采用了它。

可以看出社區對它的看重，雖然它的 Star 數不高，但還是十分值得學習的。

對比一下常見的 CLI 庫 Commander.js^[4] 和 cac^[5]，它們的寫法是函數式的，通過定義一個函數，使用 option 傳入參數。

看你喜歡哪種寫法，它們都是不錯的選擇。

//?Commander.js const?{?program?}?=?require('commander');program.option('--first').option('-s,?--separator?<char>');program.parse();const?options?=?program.opts(); const?limit?=?options.first???1?:?undefined; console.log(program.args[0].split(options.separator,?limit));//?examples/basic-usage.js const?cli?=?require('cac')()cli.option('--type?<type>',?'Choose?a?project?type',?{default:?'node', })const?parsed?=?cli.parse()console.log(JSON.stringify(parsed,?null,?2))

2.TS 相關的 10 個項目推薦

CLI 模塊：clipanion^[6]
測試模塊：uvu^[7]
Web 模塊(express 替代品)：tinyhttp^[8]
數據庫模塊：typeorm^[9]
Web 應用：midway^[10]、daruk^[11]、loopback^[12]、nest^[13]、ssr^[14]
react 全家桶：umi^[15]

2.1 find-my-way

find-my-way^[16]

const?http?=?require('http') const?router?=?require('find-my-way')()router.on('GET',?'/',?(req,?res,?params)?=>?{res.end('{"message":"hello?world"}') })const?server?=?http.createServer((req,?res)?=>?{router.lookup(req,?res) })server.listen(3000,?err?=>?{if?(err)?throw?errconsole.log('Server?listening?on:?http://localhost:3000') })

受 Go 語言中 echo 框架的路由實現所啟發，具體實現基于基數樹^[17]。部分代碼從 trekjs^[18]提取。

性能

基準測試 all together 中 find-my-way 是 525,798 ops/sec，koa-router 是 161,220 ops/sec。每秒能夠處理的請求數差距還是非常明顯的，基數樹的這種方式遠遠比正則快的多。

=======================find-my-way?benchmark ======================= short?static:?10,102,066?ops/sec static?with?same?radix:?3,887,679?ops/sec dynamic?route:?1,637,929?ops/sec mixed?static?dynamic:?2,289,554?ops/sec long?static:?5,403,719?ops/sec wildcard:?3,037,119?ops/sec all?together:?525,798?ops/sec======================koa-router?benchmark ====================== short?static:?1,004,122?ops/sec static?with?same?radix:?1,029,369?ops/sec dynamic?route:?1,015,635?ops/sec mixed?static?dynamic:?968,784?ops/sec long?static:?1,027,857?ops/sec wildcard:?1,033,432?ops/sec all?together:?161,220?ops/sec

下圖來自于 Fasify 的基準測試^[19]

Fastify 和 Restify 都是基于 find-my-way 實現的路由，Restify 早期版本基于 express 的路由，Fastify 能處理的每秒請求數比原生的還高。從數據結構角度來進行優化是未來提升性能比較重要的一點。

Radix Tree 原理^[20]
path-to-regexp^[21]

2.2 性能優化的 4 個建議

fast-json-stringify^[22]

2.3 測試框架演進

idea

造輪子：把 junit 的 API 搬進 TS。

實現路徑

ts-import vs typescript-require

這二者的性能還是差一些，后面準備用 Rust 或者 Go 的編譯器重寫。

xv

在造輪子的過程中，發現了一個有意思的庫 xv。作者還有 json-server、lowdb 等作品。

源碼只有 40 幾行，無需定義任何測試語法。

https://github.com/typicode/xv^[23]

uvu

uvu^[24] 的源碼值的學習。

常見的 Node 測試框架：

ava^[25]
jest^[26]
mocha^[27]
tape^[28]
uvu^[29]

vitest

會替代掉 jest，也會越來越流行。

vitest^[30]

2.4 easy-monitor

easy-monitor^[31] 是近年來性能監控的最好方案。

監控痛點

一些痛點對開發者門檻要求比較高，但是 easy-monitor 已經幫我們做好了。

性能調優，永不過時

基于 addon，沒有版本依賴。各種內存泄漏分析工具與 Coredump 分析工具，絕對有你的知識盲點

對閱讀 node 源碼和深入理解服務器有非常大的幫助

對理解 libuv，以及 c++ 也有幫助

源碼基于 egg 和 vue，都是非常成熟的技術

作者一定要靠譜

完善的應用故障定位步驟

2.5 rushstack

Turborepo 對于 Lerna 是競品，而目前還對標不上 rushstack^[32]，rushstack 適用于超大型項目。微軟的全系列產品也都在使用 rushstack 全家桶。在未來有超大型項目挑戰的時候 rushstack 是一個非常好的實踐借鑒。

總結

八大類 Web 框架

Jamstack，下一代 Web 建站技術棧？^[33]

架構演進

這一趴主要引用了 Node 地下鐵的一次分享，原文鏈接如下。

JavaScript 全棧?效研發在語雀中的實踐^[34]

前端 3.0

重新思考前后端的關系

BFF vs FFB

前端代碼里的膠水代碼太多了，本質上講，從數據庫到 API 字段，然后到前端渲染，應該是一個非常純凈的過程。但是由于業務發展或者是各種情況，數據庫里面的字段不能拿出來直接用，前后端的溝通成本又導致了中間加了額外的各種邏輯。這就導致了前端的復雜度一直在上升。

更多內容可以參考狼叔在社區中的回答^[35]

參考資料

[1]

Node 2021 開發者報告鏈接: https://nodersurvey.github.io/reporters/

[2]

clipanion 倉庫鏈接: https://github.com/arcanis/clipanion

[3]

Yarn v2 版本: https://github.com/yarnpkg/berry

[4]

Commander.js: https://www.npmjs.com/package/commander

[5]

cac: https://github.com/cacjs/cac

[6]

clipanion: https://github.com/arcanis/clipanion

[7]

uvu: https://github.com/lukeed/uvu

[8]

tinyhttp: https://github.com/tinyhttp/tinyhttp

[9]

typeorm: https://github.com/typeorm/typeorm

[10]

midway: https://github.com/midwayjs/midway

[11]

daruk: https://github.com/darukjs/daruk

[12]

loopback: https://github.com/strongloop/loopback

[13]

nest: https://github.com/nestjs/nest

[14]

ssr: https://github.com/ykfe/ssr

[15]

umi: https://github.com/umijs/umi

[16]

find-my-way: https://github.com/delvedor/find-my-way

[17]

基數樹: https://en.wikipedia.org/wiki/Radix_tree

[18]

trekjs: https://github.com/trekjs/trek

[19]

Fasify 的基準測試: https://github.com/fastify/fastify/blob/main/README.md#benchmarks

[20]

Radix Tree 原理: https://ivanzz1001.github.io/records/post/data-structure/2018/11/18/ds-radix-tree

[21]

path-to-regexp: https://github.com/pillarjs/path-to-regexp

[22]

fast-json-stringify: https://github.com/fastify/fast-json-stringify

[23]

https://github.com/typicode/xv: https://github.com/typicode/xv

[24]

uvu: https://github.com/lukeed/uvu/blob/master/src/index.js

[25]

ava: https://github.com/avajs/ava

[26]

jest: https://github.com/facebook/jest

[27]

mocha: https://github.com/mochajs/mocha

[28]

tape: https://github.com/substack/tape

[29]

uvu: https://github.com/lukeed/uvu

[30]

vitest: https://github.com/vitest-dev/vitest

[31]

easy-monitor: https://github.com/hyj1991/easy-monitor

[32]

rushstack: https://github.com/microsoft/rushstack

[33]

Jamstack，下一代 Web 建站技術棧？: https://zhuanlan.zhihu.com/p/281085404

[34]

JavaScript 全棧?效研發在語雀中的實踐: https://www.yuque.com/summ/colacake/js_fullstack

[35]

更多內容可以參考狼叔在社區中的回答: https://www.zhihu.com/question/493891614/answer/2264072484

·················?若川簡介?·················

你好，我是若川，畢業于江西高校。現在是一名前端開發“工程師”。寫有《學習源碼整體架構系列》20余篇，在知乎、掘金收獲超百萬閱讀。
從2014年起，每年都會寫一篇年度總結，已經寫了7篇，點擊查看年度總結。
同時，最近組織了源碼共讀活動，幫助3000+前端人學會看源碼。公眾號愿景：幫助5年內前端人走向前列。

識別上方二維碼加我微信、拉你進源碼共讀群

今日話題

略。分享、收藏、點贊、在看我的文章就是對我最大的支持~

總結

以上是生活随笔為你收集整理的狼叔直播 Reaction《学习指北：Node.js 2022 全解析》的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。