🌿 性能优化的主要点： 1️⃣ 减少 DOM 的渲染频次 2️⃣ 减少 DOM 的渲染范围 3️⃣ 非必要的内容延后处理React 在组件触发刷新的时候，会深度遍历所有子组件。➡️ 父组件刷新，子组件跟着刷新。避免不必要的组件重新渲染，是提高程序性能的重要方式之一。缓存方式React.memoconst MemoizedComponent = memo
......
12
0
0
2024-11-18
一、 React19 中 context 的具体改动二、 use(context) 基础介绍三、 简单粗暴样式替换实现换肤四、 利用 css 变量实现换肤本文共 3219 字，阅读预计使用 5 分钟1、改动与之前的版本相比，在 React19 中，context 有一些细微的变化。主要体现在如下三个方面。!一、删除 旧版 Context 旧版本的 Conte
......
30
0
0
2024-10-24
有一段时间没更新了，花了点时间研究了下 React Native（后续用 RN 简称），同时也用该技术作为我的毕设项目(一个校园社交应用，仿小红书)，经过了这段时间的疯狂折腾，对 RN 生态有了一定的了解，我想是时候可以分享点一些东西了。代码仓库： https://github.com/kuizuo/youni为什么是 RN 而不是 Flutter？很简单
......
62
0
0
2024-10-20
Reactv19 已经发布 beta 版本，想要快速体验如何升级到 v19 版本尝鲜的朋友们可以查阅进行了解前言React 已于近日发布了 v19 的 beta 版本，同时为了帮助后续的 v19 升级，也同时发布了 v18.3.0的正式版， 与 v18.2 版本完全相同，但添加了弃用 API 的警告和其他为 React 19 所需的更改安装使用新版 JSX
......
46
0
0
2024-10-01
目录什么是并发它和 React 有什么关系中断和切换是如何工作的那 Suspense 呢？如何启动 transition结束语什么是并发并发是一种执行模型，它允许程序的不同部分可以不按顺序执行，而不影响最终结果。你可能听说过多线程或多进程。由于浏览器中的 JavaScript 只能访问一个线程（虽然 Web Workers 在单独的线程中运行，但它们和 Re
......
93
0
0
2024-08-17
前言Reack Hooks自从16.8发布以来，社区已经有相当多的讨论和应用了，不知道各位在公司里有没有用上这个酷炫的特性~今天分享一下利用React Hooks实现一个功能相对完善的todolist。特点：利用自定义hook管理请求利用hooks做代码组织和逻辑分离界面预览体验地址codesandbox.io/s/react-hoo…代码详解界面首先我们引
......
186
0
0
2024-05-12
React 知命境第 46 篇，原创第 160 篇这篇是年前最后一篇分享 React 知命境 的文章。到目前为止，知命境这个合集里已经包含了大量的内容，足够我们在 React 上成为成为一名高手，也有许多付费群里的朋友陆陆续续靠合集里的内容找到了更好的工作，也算是把之前对群友承诺的坑补齐了，延后了很久实在是抱歉。后续 React 知命境的内容会根据大家在群里
......
225
0
0
2024-05-11
摘要本文总结了 ReactNative 开发中常见问题及解决方法。从 ScrollView 在 TouchableOpacity 组件内滑动困难到 Xcode 编译路径设置，都有相应解决方案。此外，还介绍了热更新问题、高度获取、强制横屏UI适配、清理缓存等实用技巧。引言ReactNative 作为一种跨平台开发框架，尽管强大，但也常伴随着一些问题。本文收集并
......
207
0
0
2024-03-19
React 知命境第 35 篇，原创第 142 篇我们知道，Scheduler 是 React 提供的底层调度器。但是这个调度器具体是如何用的，可能大部分人都不太清楚了，好在 React 把内部的模块封装得都相对独立，因此，我们可以想个办法，单独把他的 Scheduler 或者 Reconciler 单独掏出来用。1怎么掏在 React 的 github 仓
......
221
0
0
2024-03-15
当前问题现在编译时间过长,镜像构建时长就达到了20分钟+通过项目依赖升级后,镜像构建时长大约3-5分钟修改内容之前的技术方案:roadhog(2.x)+antd(3.x)+React(16.x)+dva(2.x)现在的技术方案:[Create React App]craco(7.x)+antd(5.x)+React(18.x)+react-redux(9.x
......
197
0
0
2024-03-11
Suspense 组件想必大家都用过，一般是和 React.lazy 结合用，用来加载一些异步组件。比如这样一个组件：// src/Aaa.jsx
export default function Aaa() {
return <div>aaa</div>
}
就可以在另一个组件里用 lazy + Suspense 异步
......
468
0
0
2024-03-10
React 知命境第 31 篇在 React 中，有一个高大上的概念，叫做并发模式 Concurrent React。在并发模式中，引入了两个新概念：任务优先级、异步可中断。当一个任务正在 Reconciler 阶段执行时，如果此时 Scheduler 发现了一个优先级更高的任务，那么，React 可以把正在执行的任务中断，从 Scheculer 中把优先级
......
228
0
0
2024-03-04
引用方式第一种：内联方式可以使用变量或者传统的内联方式优点: 只生效于当前组件
缺点: 可能产生大量重复代码
import react, { Component } from "react";
const sty = {
width: "100px",
backgroundColor: "#FFFFFF", //注意：需要使用驼峰
......
190
0
0
2024-02-25
「React 知命境」第 29 篇在前面的章节中，我们学习了 context 的使用方式，基于它我们可以搞一个自己的状态管理库。不过，他存在性能上的问题，以致于虽然从功能的实现上来说，他非常不错，但是从性能上来说，context 的表现非常糟糕，虽然很少有 React 学习者关注到这个问题，但是如果你关注项目的整体架构，并且想要成为顶尖高手的话，这是你必须掌
......
196
0
0
2024-02-19
条件渲染和其它的语言一样的逻辑在 React 中,我们可以通过 JavaScript 里面咋用的它里面就咋用比如使用 JavaScript 的 if 语句、&& 和 ? : 运算符来选择性地渲染 JSX条件返回不同的 JSX我们定义一个水果集合组件,里面定义多个水果组件,每个物品可标记为打包与否接下来我们给 JSX 组件判断一下 true 为
......
210
0
0
2024-02-15