原文: What's New in React 19

React 19 刚刚发布,为这个流行的 JavaScript 库带来了大量新功能和增强功能。对于希望保持领先地位的开发人员来说,了解这些更新至关重要。本课程旨在帮助你了解 React 19 的最新变化,从数据变更处理到有助于改善用户体验的创新型新 API。

我们刚刚在 freeCodeCamp.org YouTube 频道上发布了一门课程,该课程将向你介绍 React 19 中令人兴奋的新功能。其中包括处理 Actions、乐观更新、表单状态、新的 use() API 等的内置方法。React 19 中包含大量改进,可简化开发流程并提高应用程序性能,对于 React 开发者来说是重大的更新。

来自 Scrimba 的 Bob Ziroll 开发了本课程。他是世界上最受欢迎的 React 讲师之一。

自 2022 年 React 18 发布以来,React 已经两年多没有重大版本更新了。在 React 19 中,有许多特性可以简化对数据变更的处理,同时提供 API 通过乐观更新来增强用户体验。这些更新旨在使应用程序更快、反应更灵敏,即使在执行复杂的数据操作时也是如此。此外,React 团队还发布了新的开源编译器,他们已经开发了多年,旨在管理许多与性能相关的幕后细节,使开发者能够更多地专注于构建功能,而不是优化。

课程概览

参与这个综合课程,我们将深入研究 React 19 最新和最强大的功能。本课程包括对 React 18 中重要概念的复习,以及对 React 19 中新功能的深入介绍。以下是你将学习的内容:

Transition(复习 React 18)

我们先快速回顾一下 Transition,这是 React 18 中引入的一个关键特性,有助于更顺畅地管理 UI 更新。

React 编译器

了解新的 React 编译器,这是一个强大的工具,可自动处理性能优化,让开发者编写出更简洁、更高效的代码。

表单 Actions

探索新的表单 Actions 特性,简化表单状态管理,更有效地处理用户交互。

useActionState()

了解如何使用 useActionState() 这个新 Hook,以更直观的方式管理异步 Actions 的状态。这部分内容分为三个部分进行深入探讨。

Actions 中的错误处理

掌握 Actions 中改进的错误处理方式,以创建更强大的应用程序。

useOptimistic()

了解 useOptimistic() 这个 Hook 如何帮助你乐观更新用户界面,在等待服务器确认期间立即呈现更改,提供更好的用户体验。

useFormStatus

了解如何使用 useFormStatus 这个新 Hook 来更有效地追踪表单状态。

ref 作为 prop

了解将 ref 用作 prop 的新方法,这种方法增强了组件的交互和操作。

use()

深入了解 use() API 这个新增功能,它进一步简化了 React 应用中的对异步代码的管理。

其他改进

我们还将介绍其他一些改进,例如增加了对元数据标签的支持,从而带来更流畅、更高效的开发体验。

课程目录

  • React 19 有什么新特性?

  • React 18 回顾 - useTransition (1)

  • React 18 回顾 - useTransition (2)

  • React 编译器

  • 表单 Actions

  • React 中的错误和加载状态

  • useActionState() - 第 1 部分

  • useActionState() - 第 2 部分

  • useActionState() - 第 3 部分

  • useOptimistic()

  • useFormStatus()

  • ref 作为 prop

  • use()

  • 其他改进 - 元数据标签

  • 总结

无论你是经验丰富的 React 开发者还是刚刚入门,本课程都能提供充分利用 React 19 潜力所需的知识技能。在 freeCodeCamp.org YouTube 频道上观看完整课程(总共 1 小时)。

你也可以在 bilibili 观看这个视频