Simon Logo
WritingMonthlyProjects
Simon Logo

Thanks for reading!

CC BY-NC-SA 4.0© 2019-2026 Simon Wong.

Contact

GitHubGithubXTwitterZhihu知乎WeChat微信公众号RSSRSS

Legal

隐私策略服务条款
CC BY-NC-SA 4.0© 2019-2026 Simon Wong.

On this page

On this page

NodeTypeScriptReactBun

#01 前端月刊

Aug 31, 2023

最佳实践

node 最佳实践 2023版

JS & Node 测试最佳实践 2023 版

学习文档

简洁的 TypeScript Book

全面而简洁的概述了 TS 的功能,涵盖了最新版本的所有内容,从类型系统到高级功能都包含了。略扫了一眼,比较适合初学者对整个 TS 有个了解。有中文翻译版本。

TypeScript 类型体操姿势合集

当然想要精通 TS,实践必不可少

component party

通过各个框架的实现对比快速上手其他框架。

工具

Npm Graph

npm 依赖图,帮助了解你工程的依赖情况

React

客户端渲染(CSR):浏览器加载 JS 资源渲染页面组件

服务端渲染(SSR):专注于初始页面的加载

  • 将预渲染的页面发送到浏览器(可以看到页面)
  • 跟下载好的 JS 进行水合(可以进行交互)

服务器组件(RSC):

  • 作用:

    • 在服务端获取数据并直接渲染好流给客户端,无缝的合并到现在 DOM 中(可以和客户端组件、SSR 混合使用,可以存在某一层的组件树中)
    • 相比于 SSR,不需要下载额外的 JS,不需要水合
  • 局限性:

    • 代码都是序列化的,不能使用生命周期,比如 useEffect、useState
    • 不支持连续的更新,比如使用 websocket

RSC

Understanding React Server Components

理解 React 服务器组件

RSC From Scratch. Part 1: Server Components

从 0 开始实现服务器组件 - Dan

Everything I wish I knew before moving 50,000 lines of code to React Server Components

将 5 万行代码迁移到服务器组件的经验

实践

实现一个简洁的 confrim 弹窗的 React 组件测试

新鲜玩意儿

million

是一个非常快速的轻量化的虚拟 DOM,可以提升 React 70% 的速度。

使用了块虚拟 DOM (block virtual DOM.)技术。可以看这篇文章 Virtual DOM: Back in Block 。

  • 静态分析:对虚拟 DOM 进行静态分析,动态虚拟 DOM 部分放到 Edit Map 中
  • 脏检查:比较状态来确定发生了什么变化,而不是虚拟 DOM 树。状态发生变化时直接编辑 Edit Map

bun

Bun 是一个 all-in-one 的 JS 运行时,以及工具包。开发、测试、运行、打包 JS 和 TS 都可以在 Bun 上完成。

速度比 node 、deno 都快很多。进程启动速度比 node 快 4 倍。

bun 的包管理器比 pnpm 都要快上 17 倍。

同时兼容 esm 和 cjs。

他是基于 JavaScriptCore 拓展的,而不是 V8

Bun's Roadmap

推荐网站

css tricks

css 技巧网站

Hello 算法

算法动画图解网站,算法源代码皆可一键运行

Next

前端月刊

You Might Also Like

  • 前端月刊Aug 31, 2023
  • 前端月刊Nov 30, 2025
  • 前端与 AI 月刊Dec 31, 2024