Skip to main content

2024/08/18

“React 框架的问题是，它的关注重点不是让事情变得简单，而是扩张主义——征服新的知识前沿” -- DHH，Ruby on Rails 框架的作者

ok，时隔几个月又重新更新了。前面几个月顺利把健身这个习惯培养起来了，体重顺利增到 130 以上，初步达成今年目标

接下来准备把健身时间收一收，多点时间放在跳槽和技术上，还有年内其他的计划，比如 fe-explorer 这个可以期待的开源项目

Node.js 正在衰退?​

根据 StackOverflow 的调查，Node.js 是最受欢迎的技术，这种成功依赖于 Node.js 和 npm 的强大组合，明显这种说法还为时过早， Node.js 这几年其实也在积极迭代，比如：

  • Promise 重写了很多常用的异步模块
  • 采用了 ECMAScript 模块（ESM）
  • 提供工作线程 Worker
  • 内置 Fetch API
  • 引入了核心模块和用户引入模块的明确区分，比如 node:assets
  • 强化 Watch，自带热更新，之前常用 nodemon
  • AsyncLocalStorage/WebCrypto/...
  • 更多开箱即用的二进制工具模块 Utils.ParseArgs()/util.styleText(format, text)
  • 内置环境变量支持 loadEnvFile

综上，其实 Node.js 在变得越来越强大，以满足现代 Web 开发的需求，衰退论似乎站不住脚

React 19 Beta​

这个版本针对 Actions 提供了几个新钩子和增加了一些其他有用的功能，详细内容参见 https://zh-hans.react.dev/blog/2024/04/25/react-19#new-hook-useactionstate

  • Actions，使用异步过渡的函数被称为 "Actions"，一个常见的用例是执行数据变更，然后响应更新状态。例如，当用户提交一个表单来更改他们的名字，你会发起一个 API 请求，然后处理响应。React19 自动化了处理挂起状态、错误和乐观更新等任务，从而减少了样板代码并提高了开发者的工作效率
    • 支持在 Transition 中使用异步函数的支持来自动处理挂起状态、错误、表单和乐观更新
    • useActionState 管理 Actions
    • useOptimistic 管理乐观更新
    • 在 react-dom 中我们添加了 <form> Actions 来自动管理表单和 useFormStatus 来支持表单中 Actions 的常见情况
    • useFormState
  • 资源加载优化 -- React v19 通过优化资源加载来提高性能。图像和其他文件现在在用户浏览页面时在后台加载，从而减少了等待时间并增强了用户体验。此外，React 引入了资源生命周期 Suspense，确保了平滑的过渡并消除了视觉故障
  • React Forget 编译器，自动检测出需要使用 useMemo 和 useCallback 的场景，降低开发者对于优化重复渲染的心智负担。参考https://medium.com/rewrite-tech/what-is-react-forget-00fdd742636c
  • 新的 API: use，用于在渲染中读取资源，但是注意不支持在渲染中创建的 promises
  • 可以在函数组件中将 ref 作为 prop 进行访问
  • 服务器组件