react

,大家好，我卡颂。,继​​Hooks​​​的发明者「Sebastian Markbåge」后，又一名​​React​​​核心成员「Andrew Clark」加入​​Vercel​​​，从事​​Next...

,大家好，我是前端西瓜哥。,最近做的新功能有性能问题，所以我想尝试优化一下 React 组件的性能。下面我们来好好学习一下 React.memo 的用法。,当某个组件里的状态发生改变时，React 会...

,提到react fiber，大部分人都知道这是一个react新特性，看过一些网上的文章，大概能说出“纤程” “一种新的数据结构” “更新时调度机制”等关键词。,但如果被问：,本文将从两个框架的响应式...

本文是深入浅出 ahooks 源码系列，这个系列的目标主要有以下几点：,加深对 React hooks 的理解。,学习如何抽象自定义 hooks。构建属于自己的 React hooks 工具库。,培养...

,首先，我们有React Bootstrap。这是较旧的 React UI 库之一，这意味着您为 UI 设计奠定了良好的基础。,此示例将创建一系列的样式按钮：,,总的来说，React Bootstra...

,大家好，我卡颂。,React Server Component（后文简称RSC）是React近几年最重要的特性。虽然他对React未来发展至关重要，但由于：,所以虽然体验Demo[1]已经发布3年了...

,大家好，我卡颂。,不知道大家在用React开发时，有没有注意到react与react-dom这两个包中有个很奇葩的属性__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WIL...

作者 | 刘皇逊(恪语,本篇文章主要讲解如何从一个空目录开始，建立起一个基于webpack + react + typescript的标准化前端应用。,在项目开发中，我们可以使用create-reac...

先从 React 最基本的条件类型来看。如果有数据就显示组件，如果没有数据就不显示任何内容。posts 为需要渲染的列表：,这种形式会生效的原因就是我们会提前返回，如果满足条件(posts 值不存在...

本文目标主要有以下几点：,加深对 React hooks 的理解。,学习如何抽象自定义 hooks。构建属于自己的 React hooks 工具库。,培养阅读学习源码的习惯，工具库是一个对源码阅读不错...

2013 年 5 月 29 日，React 正式开源，至今已过去了十年！自发布以来，React 已经成为前端开发领域中最受欢迎的技术之一，其生态系统越来越丰富，Github 累计获得了 208k St...

​译者 | 赵青窕,审校 | 孙淑娟,创建二维码生成器(Quick Response Code Generator)就是将图像格式转换为文本格式进行转换。二维码(QR code)是利用图像数据来代表文...

译者 | 吴河东,审校 | 孙淑娟 梁策,​​Next.js​​ - 用于生产的 React 框架，可以轻松地启动全栈应用程序。,​​Cosmic​​ - 无头部 CMS工具，它实现了数据(内容)层的...

大家好，我卡颂。 5月30日刚好是React10周年纪念日。 我顺手拉了下React最新代码，这一看不要紧，居然已经有22个hook了。 其中： react包导出了21个。 react-dom包导出了...

前段时间社区上大肆讨论「前端已死」，各种唱衰前端的言论此起彼伏，真是闻者落泪，听者伤心。,最近又听说某大厂取消大前端部门，前端被拆分到各个业务组。很多前端高 P 或离职，或被裁，或转后端。,这是前端的...

大家好，我是前端西瓜哥。今天我们看看React 中使用 Redux 的 4 种写法。,Redux 是一种状态容器 JS 库，提供可预测的状态管理，经常和 React 配合来管理应用的全局状态，进行响应...

大家好，我是 CUGGZ，明天就是端午节啦，提前祝大家端午节快乐鸭!,今天来分享20个很棒的 React 仓库，助你成为 React 大师！,关于 React 生态系统的一系列很棒的资源。,Githu...

现在的网站很多时候都需要面对世界过个地区的人们访问，如果针对每个地区的人都单独构建一个网站的话，这样会非常费时费力，因此最好的解决办法就是根据用户的访问来对网站的内容进行翻译，这种翻译一般是通过从数据...

​大家好，我是前端西瓜哥。,React.js 是被广泛使用的用于构建用户界面的 JS 库。下面给大家介绍一下学习 React 需要了解的一些概念。,在 React 这类框架流行之前，我们更新 UI，都...

我们都知道, Vue和React是构建客户端应用程序的框架。默认情况下，可以在浏览器中输出自定义组件，进行生成 DOM 和操作 DOM, 也就是我们常说的客户端渲染, 并且我们大部分主流的场景都是SP...

,大家好，我是 CUGGZ。,在面向对象编程（OOP）中，SOLID 原则是设计模式的基础，它的每个字母代表一种设计原则：,下面就来看看每个原则的含义以及如何在 React 中应用 SOLID 原则...

作者 | Ankit Patel, 译者 | 翟珂, 编译丨Noe, 常说工欲善其事必先利其器。对于那些想要提高用户体验的企业来说，这一点尤其正确。在我们所处的数字世界中，给予UI或用户界面更多关注...

React 是当今最受欢迎的 JavaScript 框架之一，它的创新之一就是引入了虚拟 DOM，但很多现代框架已经不再采用这种方案，其在某些情况下会影响应用的性能。Svelte 的创建者 Rich ...

我已经使用 React 多年，我确信我非常了解它，但最近我的老板对我说，“你根本不知道 React，你对它一无所知。”,我很生他的气，但他指出了我程序中的三个漏洞。我现在把它记录下来，也分享给还不知道...

随着越来越多的用户转向全渠道方法，拥有无缝的用户体验非常重要。实现这一目标的一种方法是拥有一个完全响应的应用程序，以确保用户在跨平台时获得最佳体验。,,有许多 JavaScript 库可用于创建移动...

大家好，我是 CUGGZ。 浏览器的开发者工具为我们提供了强大的调试系统，可以用来查看DOM树结构、CSS样式调试、动画调试、JavaScript代码断点调试等。今天我们就来看看console调试的那...

Visual Studio Code 是由微软开发的一款免费的、针对于编写现代Web和云应用的跨平台源代码编辑器。它包含了一个丰富的插件市场，提供了很多实用的插件。下面就来分享 2023 年前端必备的...

,大家好，我卡颂。,对于长期迭代的React项目，性能是不能忽视的问题。通常我们通过：,检测运行时性能瓶颈。,实际上，React本身就内置了性能检测组件 —— Profiler，可以很方便的检测Rea...

Hi，我是 ssh，在我做前端的过程中，TypeScript + React 迅速的风靡起来，新项目越来越多的默认启用 TypeScript 做类型保护，它的各种好处对于长期维护的项目已经无需多言。那...

,大家好，我卡颂。,回想下你学新技术的主要途径是什么？看书？看技术文档？看博文？看视频？,归纳起来，无外乎「文字」、「视频」两种形式。,从纸媒时代到互联网时代，再到移动互联网时代，虽然信息的载体发生变...

本文将探究 React API 的演变及其背后的心智模型。从 mixins 到 hooks，再到 RSCs，了解整个过程中的权衡。我们将对 React 的过去、现在和未来有一个更清晰的了解，便于深入研...

,大家好，我是前端西瓜哥。今天来过一下 React 类函数的生命周期。,React 中类组件的生命周期函数，分为挂载、更新、卸载三种：,相关的拦截器：,更新状态的方法：,旧版生命周期：,,新版生命周期...

2020 年底，React 公布了一个全新的特性：Server Components，当时它还处于调研和试验阶段，并没有正式发布，随着 React 18.0 版本的正式发布，Server Compon...

,大家好，我卡颂。,逞着对React内部运行流程还记得住，业余时间尝试复刻一个React —— big-react[1]。,即然是复刻一个React，那肯定得跑通部分官方的测试用例。,在跑一个用例时遇...

,大家好，我卡颂。,针对「前端框架」，长期存在着各种纷争。其中争论比较大的是下面两项：,比如，各大新兴框架都会掏出benchmark​证明自己优秀的运行时性能，在这些benchmark中React通常...

Vite使用 esbuild 预构建依赖。由于esbuild是一个用Go编写的JavaScript(和TypeScript)绑定器，这也是它快速的原因之一。 ​​ 通常，当用React构建一个新项目...

大家好，我是前端西瓜哥。,最近公司的项目用的 React 从 16 升到了 17 版本，选择升级的原因是想以后将项目迁移到 Nextjs 上。,结果发现因为 React 的行为不一致导致了一些看得见的...

,每个学习 React 的程序员在学习过程中都会犯大量的错误。 有时他们甚至不知道自己犯了这些错误。 如果您精通 React，则需要避免这些错误并根据最佳实践进行编码。 所以，我想展示你们所做的错误并...

,大家好，我是前端西瓜哥，今天来学习 React 中的列表渲染要加 key 的原因。,在 React 中我们经常需要渲染列表，比如展示好友列表。,常用写法是用 Arrary.prototype.map...

,大家好，我是 ssh。,React Router 是 React 生态系统中最受欢迎的第三方库之一，近一半的 React 项目中使用了 React Router。,React Router 创建于 ...

本文是深入浅出 ahooks 源码系列文章的第一篇，这个系列的目标主要有以下几点：,注：本系列对 ahooks 的源码解析是基于 v3.3.13。自己 folk 了一份源码，主要是对源码做了一些解读...

大家好，我卡颂。 请思考一个问题：如果有一个HTML标签，React围绕他专门出了2个hook，那这个标签对React未来的发展一定非常重要，这没毛病吧？ 这个标签就是 —— form。 React围...

,大家好，我卡颂。,一些同学喜欢在useEffect中请求初始数据，类似这样：,但​​React18​​并不推荐这种方式。,这么写有什么问题？如果不推荐这种方式，那么推荐的方式是什么呢？,本文来看看​...

,本文不是要辩论 Vue 好还是 React 好，而是要看看这两个框架在低层次上是如何选择的。,我知道有些开发者在选择框架之前会倾向于看基准。然而，这并不是最关键的方面，因为99%的性能都来自于你写的...

,,不知不觉 react-router 已经到了 v6 版本了，可能很多同学发现，v6相比之前的 v5 有着翻天覆地的变化，因为最近接触到了 React 的新项目，用到了 v6 版本的 react-r...

做为一名前端开发人员,掌握vue/react/angular等框架已经是必不可少的技能了,我们都知道,vue或react等MVVM框架提倡组件化开发,这样一方面可以提高组件复用性和可扩展性,另一方面也...

【51CTO.com快译】许多基于Web的项目最终必须考虑的一个常见问题是如何处理用户身份验证。我们都熟悉网站登录页面后隐藏与用户相关的数据和流程；用户如果拥有一个帐户，则登录；如果没有，则可以创建一...

作者丨Rojan Maharjan, 译者 | 涂承烨, React团队在useEffect钩子中做出的设计选择仍然是一个热议的话题。有些人喜欢，有些人不喜欢。, 如果你不是来自React世界，这听...

https://github.com/TanStack/query,图3,简而言之，React Query 可以使在 React 中获取数据体验更好。其是一个处理异步服务器状态的状态管理库，通过提供了...

这是一个可怕的问题，在 React 中，我们经常会编写条件语句来显示不同的视图，比如这个简单的例子。,但是，当项目的代码量足够大并且有很多 JSX 条件时，事情很快就会失控。 代码变得非常混乱且可读性...

大家好，我是 CUGGZ。,在 React 项目开发过程中，一套好用的 React Hooks 库是必不可少的，使用这些 React Hooks 库可以大大提升开发效率，避免重复造轮子！今天就来分享1...

我们经常需要在React的useEffect中监听键盘事件、鼠标事件等，但是我们经常忘记删除它们。,是的，当我们回到这个组件的时候，scroll事件又会被监听。,换句话说，我们可能会将数千个 wind...

最近在一个 React 项目中，使用到了 socket.io 处理即时消息，这里面有几点容易被忽视的问题，例如：在 React 单页面应用中如何防止出现多个 socket 实例、在任意的的组件内如何方...

,大家好，我是前端西瓜哥。,Jest 是一款轻量的 JavaScript 测试框架，它的卖点是简单好用，由 facebook 出品。本文就简单讲讲如何使用 Jest 对 React 组件进行测试。,单...

React Tetris 是一个使用 React、Redux、Immutable 制作的俄罗斯方块游戏。它是一个非常不错的 React 练手项目，小小的“方块”还是有很多的细节可以优化和打磨。项目的官...

,大家好，我是 CUGGZ。,今天来推荐 8 个简单又好用的前端拖拽排序库！,react-beautiful-dnd 是一款美观且简单易用的 React 列表拖拽库。其动画效果自然，性能优秀，简洁而强...