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

CSSReactJavaScriptOAuth

#12 前端月刊

Jul 31, 2024

React

理解 React Compiler

React19 正在 beta 中,上上期有提到过 React 编译器 这篇官方的文章,主要告诉你有什么功能如何使用。这篇让你理解 React Compiler 的功能原理。

通过构建 suspense-enabled 的库来学习 Suspense

我相信你一定了解过 Suspense,但大部分情况都是在使用 React.lazy 懒加载页面/组件时使用的,当我们做接口请求时,该如何使得 Suspense 可用(即请求接口时,使得页面展示 Suspense 的 fallback)呢?

这是一篇非常详细的文章,通过构建一个 useFetch 来学习如何触发 Suspense。也是 Suspense 的浅显的实现原理。也是 React Query 库的浅显的实现原理。

另外,还在过程中发现了React 19 的 API use 的实现。

通往更干净的 React 架构

这是一个系列的文章,5 月刊整理过一个章节。

他的架构思路来源于 The Clean Architecture 。

img

他的核心思想是关注点分离、单独功能方便单元测试等等,当然这个架构也有一些缺陷,比如需要一些学习成本,有一些样板代码等等。

下面是他的一步一步抽离的文章,非常值得学习。

  1. 共享 API client
  2. API 层与请求函数
  3. API 层与数据转换
  4. 领域实体与DTO
  5. 基础设施服务和依赖注入以实现可测试性
  6. 业务逻辑分离
  7. 领域逻辑
  8. 更新中...

指南

如何取消 Promise

我们知道我们可以用 xhr.abort() 或者 fetch 的 signal 进行取消请求,但是如何取消常规的 Promise 呢。这个提供了 Promise.withResolvers 和 AbortController 两个思路来取消 Promise。

读写 Nodejs 流的指南

Nodejs 流允许你逐步处理数据并优化内存使用,这篇文章可以帮助你了解如何利用流进行实时数据处理、内存管理和构建可扩展的应用程序。

版本更新

ECMAScript 2024

TL;DR

ECMAScript 2024 语言规范获得了批准。以下是新功能简介:

  • Map.groupBy() Object.groupBy() 将数组元素进行分组
  • Promise.withResolvers() 上一次有提到过,创建 Promise 的新方式
  • 新的正则表达式标识 /v 用来匹配 Unicode 字符串,由多个编码组成的 emoji
  • ArrayBuffers 可以通过 resize 调整大小,transfer 转移方法
  • String.isWellFormed() String.toWellFormed 处理字符串的 lone surrogates
  • Atomics.waitAsync() 用于在共享内存位置上异步等待并返回 Promise

TypeScript 5.5 发布,这是一个最重要的版本之一

TL;DR

  • 支持推断类型谓词,比如 filter 方法可以正确的过滤数组的类型
  • jsdoc 支持顶部导入类型 /** **@import** { SomeType } from "some-module" */ ,这样就可以直接使用 import
  • 支持正则表达式检查
  • 支持 最新的 ECMAScript 2024 中提到的 Set 方法类型定义
  • 独立的申明,增加 isolatedDeclarations 标识,这个详细看 Isolated Declarations in TS 5.5: State of the feature
  • 引入模板变量 ${configDir} 处理 extends 不同位置的 tsconfig 时,被 extends 的 tsconfig 中配置的路径是相当于自身的./xxx,用户可能想让他变成相对于当前的。
  • ... 还有其他很多小功能改进&bugfix
Previous

前端月刊

Next

前端月刊

You Might Also Like

  • 前端月刊Jul 31, 2024
  • 前端月刊Jun 30, 2025
  • 前端月刊Nov 30, 2025