话题框架与类库 › React

框架与类库:React

React 开发使用单一职责原则

单一职责原则是 React 组件设计的关键。每个组件应专注于单一功能,避免承担过多职责。通过分离数据和展示、创建专注的组件、使用组合和逻辑复用,以及分层思考,我们可以构建更易维护、测试和扩展的应用。当组件功能因不同原因变化时,应及时拆分,确保“只有一个引起变化的原因”。这样,代码结构更清晰,开发效率更高。

React 开发中使用开闭原则

在React中,遵循开闭原则意味着组件应易于扩展而无需修改。通过使用组合、props和高阶组件,可以创建对扩展开放的组件,同时保持基础组件不变。自定义Hook也能通过这种方式实现可重用性。React团队提倡的“组合优于继承”与开闭原则吻合,确保组件灵活性和可维护性。结合SOLID原则,能构建出易于扩展和维护的健壮架构。

React Server Components 和 Server Action 构建实践

本文介绍了 React 中 RSC(React Server Components)和 Server Action 的构建实践,包括它们的概念、渲染方式、在 webpack 中的打包流程,以及 Turbopack 是如何在一个模块图中完成打包多个环境模块的。简单介绍下 RSC在 RSC 之前,React 只有 Client Component,你可以在 Client Component 中使用…

How to use Server-Sent Events with FastAPI, React, and Langgraph

Learn all you need to implement streaming in production using SSE and how to handle streaming errors.

解析 React 渲染原理

当我们使用React框架编写代码时,无论是组件的更新、状态的改变,还是父子组件......

谈谈 React Context 的性能优化

在 react 应用中,大家一定使用过 Context[1] 来管理状态以解决 props drilling

React 组件设计-避免条件渲染

“新的” React 文档中有一个关于 “以 React 方式思考” 的很棒的部分,其中强调第一步应该始终是将用户界面分解为组件层次结构。我认为我们做得还不够,这就是为什么许多应用程序在某个点上停止了组件组合,然后继续使用它的天敌:条件渲染。

How to control a React component with the URL

"Can we make this screen shareable via the URL?"It's a common feature request. Surprisingly, it also leads to one of the most common causes of bugs in React applications.Take this searchable table. If…

React Native 在「Soul App」的实践 - 拆包与热更新

动态化是 React Native 的核心特点之一。在使用 React Native 的过程中,动态化是一个不可回避的话题。随着业务开发的快速迭代和新业务线的不断加入,子工程的体积不断增加,导致主工程的体积也随之增大。如果热更新以全量包的形式进行,会大大增加用户更新时的流量消耗,因此业务拆包势在必行。

React事件机制的源码分析和思考

在浏览器中,JavaScript是非阻塞的,事件就是一种用来通知正在发生的相关事情的机制,表示基本的用户交互以及其他浏览器内部的事情,JavaScript在接收到这个通知后才会执行相关的事件处理函数,避免阻塞主流程。不管使用什么样的前端框架来开发,与事件打交道都是不可避免的,但是前端框架可能会对浏览器原生的事件机制进行一些封装和改造,例如React就在浏览器原生事件机制的基础上,实现了一套事件机制,将浏览器原生的事件合成为React抽象的SyntheticEvent,并实现了一套模拟浏览器原生事件冒泡和事件捕获的React事件机制。

本文将分别分析原生的事件机制和React事件机制,来了解React事件机制的实现原理以及使用时的一些注意事项。

React 中的接口隔离原则

本文主要介绍 接口隔离原则 在 React 开发中的应用。

React Native在移动端落地实践

在移动互联网产品迅猛发展的今天,技术的不断创新使得企业越来越注重降低成本、提升效率。为了在有限的开发资源下迅速推出高质量、用户体验好的产品,以实现公司发展,业界催生了许多移动端跨平台解决方案。这些方案不仅简化了开发流程,还极大地提升了产品的兼容性和可维护性,确保企业能够在最短时间内,以最经济的成本,将卓越的产品体验带给广大用户。

React 的正确使用方法:ref 篇

你真的用对了 useRef 吗?在与 TypeScript 一起使用、以及撰写组件库的情况下,你的写法能够避开以下所有场景的坑吗?

How Airbnb Smoothly Upgrades React

Incrementally modernizing our frontend infrastructure to roll out the latest React features without downgrades.

Enhancing The New York Times Web Performance with React 18

How upgrading to React 18 energized The New York Times website — and how we tackled some of the challenges we faced along the way.

Balancing Old Tricks with New Feats: AI-Powered Conversion From Enzyme to React Testing Library at Slack

In the world of frontend development, one thing remains certain: change is the only constant. New frameworks emerge, and libraries can become obsolete without warning. Keeping up with the ever…

Home - Wiki
Copyright © 2011-2025 iteam. Current version is 2.142.0. UTC+08:00, 2025-02-19 14:13
浙ICP备14020137号-1 $Map of visitor$