react.js

Flow Render: 像调用异步函数一样渲染 UI 组件Flow Render 提供了一种基于 Promise 的 UI 渲染方式，让你可以像调用异步函数一样渲染组件，并等待用户交互结果。

如何阅读 React 源码：系统化学习指南React 作为目前最流行的前端框架之一,其源码蕴含了丰富的设计思想和工程实践。阅读 React 源码不仅能够帮助我们深入理解框架的工作原理,还能学习到优秀的架构设计和工程化经验。本文将系统性地介绍如何从零开始阅读 React 源码,帮助开发者掌握高效的源码阅读方法。

React Native中自定义TabBar目前大部分应用的界面设计底部都有Tabbar，很多应用也会在底部tabbar整一些花活，也就是说我们在编写tabbar时需要更多的自定义空间，比如我的音乐播放器应用中，在tabbar的上面有一个简易播放器控制栏，包含正在播放的歌曲封面，歌曲名称和播放，下一曲，当前播放列表按钮，起初没有使用自定义tabbar方案，就只能将简易播放器控制栏以定位的方式定到tabbar上方，这时具体定位的位置值就需要动态计算，非常容易出现不同机型显示偏差，比如我的手机上和tabbar没有间隙，但是在模拟器上有间隙，很明显，如果

React 简单地图组件封装：基于高德地图 API 的实践（附源码）本文封装的 React 地图组件基于高德地图 JS API 2.0 开发，集成了地址搜索、经纬度定位、地图交互（点击 / 标记拖拽）、地址与经纬度互转等核心功能，同时提供了灵活的属性配置（如自定义地图高度、初始经纬度）和状态回调能力，可直接嵌入 React 项目实现基础的地图选点、地址解析需求。

easy-model 实战：跨组件通信、监听与异步加载，一库搞定 React 状态难题在 React 开发中，状态管理往往是痛点：Redux 太重，Zustand 太轻，MobX 学习成本高。今天分享一个平衡的选择：easy-model，一个基于类模型的工具集。它不仅简化了状态管理，还内置 IoC 和监听能力。让我通过几个实战场景带大家看看它的威力。

用户575730334624

JavaScript 事件循环：宏任务与微任务执行顺序一图搞懂面试高频考点：当面试官问“这段代码输出什么？”时，他们考察的不仅是语法，更是你对浏览器底层机制（Event Loop）的理解。本文通过一道综合例题，彻底拆解宏任务、微任务的执行顺序，并厘清它们与页面渲染、掉帧的关系。

HarmonyOS APP＜玩转React＞开源教程六：数据模型设计与实现数据模型是应用的骨架，定义了数据的结构和类型。本次课程将深入设计 React 学习教程 App 的完整数据模型，为后续功能开发奠定基础。

列表的拖动排序动画原理最终实现的效果如下，结尾有全部代码列表的拖动排序动画原理列表的拖动排序动画原理前端甜甜已关注分享点赞在看

【第二章-React面向组件编程（二】需求：定义组件实现以下功能。我们先从简单的需求开始做，也就是点击按钮“不活了”，能把组件从页面上卸载。

React Server Components 是什么？一文讲清 CSR、Server Components 与 Next.js 中的客户端/服务端组件在学习 React 的过程中，我们通常会先接触到“组件”“状态”“事件”“Hooks”这些概念。随着项目变大、对性能和 SEO 的要求越来越高，一个绕不开的话题就出现了：React 组件到底是在浏览器渲染，还是在服务器渲染？

前端进阶之旅

React 18 并发特性实战指南：提升大型应用性能的关键技术前端系统进阶 https://feinterview.poetries.top在本篇文章中，我们将从浅入深，和大家一起学习以下知识：

Next.js 16 缓存策略详解：从旧模型到 Cache Components在 Next.js 中，“缓存”从来不是一个附加能力，而是整个渲染模型的一部分。尤其到了 Next.js 16，随着 Cache Components 的引入，页面不再只是在“静态”与“动态”之间二选一，而是可以在同一个路由里同时包含静态外壳、未缓存的动态内容，以及带生命周期的缓存内容。官方文档对 Cache Components 的定义就是：在同一路由中混合静态、缓存和动态内容，并通过一个静态 HTML shell 先把页面展示出来，再逐步补充动态部分。

下北沢美食家

React面试题Fiber 是 React 16 引入的全新架构，旨在解决 V15 在处理大型组件树时产生的卡顿问题在 React V15 中，更新过程是同步且不可中断的。一旦开始比对 Virtual DOM，浏览器的主线程就会被一直占用，无法响应用户的输入或动画，导致掉帧和卡顿

极简的React 实现一JSX 本质是 JavaScript 的语法糖，让写 UI 更自然。我们知道，JSX并不是一种全新的语言，而是允许你在 JavaScript 代码中直接书写类似 HTML 的标签。

打小就很皮...

实现可交互的泳道图组件（React）泳道图这东西大家应该都见过，就是把流程图按角色分成好几行，每行是一个"泳道"，能清楚看到谁在什么时候干了啥。像公司里梳理业务流程、设计系统架构的时候特别好用。

HarmonyOS APP＜玩转React＞开源教程四：状态管理基础状态管理是构建交互式应用的核心。本次课程将学习 ArkUI 提供的各种状态装饰器，理解数据如何在组件间流动，并实现应用的主题切换功能。

weixin_44626085

提升开发效率的神器！快速选择编码上下文 — React Grab在现代前端开发过程中，提升工作效率成为了开发者们的一项重要追求。而今天，我们要介绍的开源工具——React Grab，正是为了帮助开发者们快速选择和复制上下文信息而设计的。

使用 React Hooks 优化组件性能的 5 个技巧在 React 开发中，Hooks 已经成为现代组件的标准写法。但很多开发者在使用 Hooks 时忽略了性能优化的细节，导致应用出现不必要的重渲染。本文将分享 5 个实用的 Hooks 性能优化技巧，帮助你的应用运行更流畅。

告别 Redux 的繁琐，试试这个基于类模型的 React 状态管理库：easy-model大家好，我是一名前端能工智人。最近在探索 React 状态管理的新方案时，写了一个很有趣的库：easy-model。它不是传统的 Redux/MobX/Zustand，而是围绕「类模型 + 依赖注入 + 精细化变更监听」构建的工具集。如果你厌倦了 action/reducer 的模板代码，或者想用更 OOP 的方式管理状态，这篇文章值得一看。

「前端何去何从」一直写 Vue ，为何要在 AI 时代去学 React「2」？理解 React 的交互模型，是从"会用"到"用好"的关键一步静态的 UI 只是开始。真正的应用需要响应用户操作：点击按钮、填写表单、切换选项卡。