React团队是技术领域的旋转门么? ,大家好,我卡颂。,继Hooks的发明者「Sebastian Markbåge」后,又一名React核心成员「Andrew Clark」加入Vercel,从事Next... 网站建设# js# next# react 4年前390
一篇带给你 React.memo 如何使用? ,大家好,我是前端西瓜哥。,最近做的新功能有性能问题,所以我想尝试优化一下 React 组件的性能。下面我们来好好学习一下 React.memo 的用法。,当某个组件里的状态发生改变时,React 会... 网站建设# dom# memo# react 4年前390
有 React fiber,为什么没有 Vue fiber? ,提到react fiber,大部分人都知道这是一个react新特性,看过一些网上的文章,大概能说出“纤程” “一种新的数据结构” “更新时调度机制”等关键词。,但如果被问:,本文将从两个框架的响应式... 网站建设# fiber# react# vue 5年前390
Ahooks 中那些控制“时机”的 Hook 都是怎么实现的? 本文是深入浅出 ahooks 源码系列,这个系列的目标主要有以下几点:,加深对 React hooks 的理解。,学习如何抽象自定义 hooks。构建属于自己的 React hooks 工具库。,培养... 网站建设# ahooks# hooks# react 5年前390
2023 年八个优秀 React UI 组件库和框架 ,首先,我们有React Bootstrap。这是较旧的 React UI 库之一,这意味着您为 UI 设计奠定了良好的基础。,此示例将创建一系列的样式按钮:,,总的来说,React Bootstra... 网站建设# blueprint# bootstrap# react 3年前380
React Server Component 从理念到原理 ,大家好,我卡颂。,React Server Component(后文简称RSC)是React近几年最重要的特性。虽然他对React未来发展至关重要,但由于:,所以虽然体验Demo[1]已经发布3年了... 网站建设# react# rsc# 前端 3年前380
React:不要动,否则你会被炒鱿鱼 ,大家好,我卡颂。,不知道大家在用React开发时,有没有注意到react与react-dom这两个包中有个很奇葩的属性__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WIL... 网站建设# hook# react# 包中 4年前380
从0到1使用Webpack5 + React + TS构建标准化应用 作者 | 刘皇逊(恪语,本篇文章主要讲解如何从一个空目录开始,建立起一个基于webpack + react + typescript的标准化前端应用。,在项目开发中,我们可以使用create-reac... 网站建设# babel# react# 我们 4年前380
在 React 中实现条件渲染的七种方法 先从 React 最基本的条件类型来看。如果有数据就显示组件,如果没有数据就不显示任何内容。posts 为需要渲染的列表:,这种形式会生效的原因就是我们会提前返回,如果满足条件(posts 值不存在... 网站建设# posts# react# 显示 4年前370
那些关于DOM的常见Hook封装,你知道几个? 本文目标主要有以下几点:,加深对 React hooks 的理解。,学习如何抽象自定义 hooks。构建属于自己的 React hooks 工具库。,培养阅读学习源码的习惯,工具库是一个对源码阅读不错... 网站建设# addeventlistener# eventtarget# hooks 5年前370
我们一起聊聊 React 发布十周年! 2013 年 5 月 29 日,React 正式开源,至今已过去了十年!自发布以来,React 已经成为前端开发领域中最受欢迎的技术之一,其生态系统越来越丰富,Github 累计获得了 208k St... 网站建设# Canary# react# 前端 3年前350
如何使用React创建QR code生成器 译者 | 赵青窕,审校 | 孙淑娟,创建二维码生成器(Quick Response Code Generator)就是将图像格式转换为文本格式进行转换。二维码(QR code)是利用图像数据来代表文... 网站建设# code# react# 二维码 4年前350
使用 Next.js 12 和 Cosmic 构建一个可以上线的餐厅网站 译者 | 吴河东,审校 | 孙淑娟 梁策,Next.js - 用于生产的 React 框架,可以轻松地启动全栈应用程序。,Cosmic - 无头部 CMS工具,它实现了数据(内容)层的... 网站建设# cms# cosmic# js 3年前340
不数不知道,React已经有22个Hook了 大家好,我卡颂。 5月30日刚好是React10周年纪念日。 我顺手拉了下React最新代码,这一看不要紧,居然已经有22个hook了。 其中: react包导出了21个。 react-dom包导出了... 网站建设# hook# react# 前端 3年前330
前端没了?也许是刚开始 前段时间社区上大肆讨论「前端已死」,各种唱衰前端的言论此起彼伏,真是闻者落泪,听者伤心。,最近又听说某大厂取消大前端部门,前端被拆分到各个业务组。很多前端高 P 或离职,或被裁,或转后端。,这是前端的... 网站建设# react# 前端# 意思 3年前330
在 React 中使用 Redux 的四种写法 大家好,我是前端西瓜哥。今天我们看看React 中使用 Redux 的 4 种写法。,Redux 是一种状态容器 JS 库,提供可预测的状态管理,经常和 React 配合来管理应用的全局状态,进行响应... 网站建设# react# redux# 写法 4年前330
20个GitHub仓库助你成为React大师 大家好,我是 CUGGZ,明天就是端午节啦,提前祝大家端午节快乐鸭!,今天来分享20个很棒的 React 仓库,助你成为 React 大师!,关于 React 生态系统的一系列很棒的资源。,Githu... 网站建设# com# github# https 3年前320
多语言站点React前端框架i18next 现在的网站很多时候都需要面对世界过个地区的人们访问,如果针对每个地区的人都单独构建一个网站的话,这样会非常费时费力,因此最好的解决办法就是根据用户的访问来对网站的内容进行翻译,这种翻译一般是通过从数据... 网站建设# react# 网站# 翻译 4年前320
学习 React.js 需要了解的一些概念 大家好,我是前端西瓜哥。,React.js 是被广泛使用的用于构建用户界面的 JS 库。下面给大家介绍一下学习 React 需要了解的一些概念。,在 React 这类框架流行之前,我们更新 UI,都... 网站建设# js# react# 写法 4年前320
快速在你的Vue/React应用中实现Ssr(服务端渲染) 我们都知道, Vue和React是构建客户端应用程序的框架。默认情况下,可以在浏览器中输出自定义组件,进行生成 DOM 和操作 DOM, 也就是我们常说的客户端渲染, 并且我们大部分主流的场景都是SP... 网站建设# react# spa# vue 5年前320
如何在React中应用SOLID原则? ,大家好,我是 CUGGZ。,在面向对象编程(OOP)中,SOLID 原则是设计模式的基础,它的每个字母代表一种设计原则:,下面就来看看每个原则的含义以及如何在 React 中应用 SOLID 原则... 网站建设# react# solid# 原则 5年前320
7款好用的前端框架,试试就知道 作者 | Ankit Patel, 译者 | 翟珂, 编译丨Noe, 常说工欲善其事必先利其器。对于那些想要提高用户体验的企业来说,这一点尤其正确。在我们所处的数字世界中,给予UI或用户界面更多关注... 网站建设# asp# js# net 4年前310
高中生打破React性能极限,将React性能提升70%! React 是当今最受欢迎的 JavaScript 框架之一,它的创新之一就是引入了虚拟 DOM,但很多现代框架已经不再采用这种方案,其在某些情况下会影响应用的性能。Svelte 的创建者 Rich ... 网站建设# dom# js# million 3年前300
我老板:你根本不懂 React! 我已经使用 React 多年,我确信我非常了解它,但最近我的老板对我说,“你根本不知道 React,你对它一无所知。”,我很生他的气,但他指出了我程序中的三个漏洞。我现在把它记录下来,也分享给还不知道... 网站建设# ampamp# react# 操作数 3年前300
ReactJS 开发人员应该具备的 12 项基本技能 随着越来越多的用户转向全渠道方法,拥有无缝的用户体验非常重要。实现这一目标的一种方法是拥有一个完全响应的应用程序,以确保用户在跨平台时获得最佳体验。,,有许多 JavaScript 库可用于创建移动... 网站建设# react# web# 响应 5年前300
你需要知道的 19 个 Console 实用调试技巧! 大家好,我是 CUGGZ。 浏览器的开发者工具为我们提供了强大的调试系统,可以用来查看DOM树结构、CSS样式调试、动画调试、JavaScript代码断点调试等。今天我们就来看看console调试的那... 系统教程# console# log# react 2年前290
2023年最新最全 VSCode 插件推荐! Visual Studio Code 是由微软开发的一款免费的、针对于编写现代Web和云应用的跨平台源代码编辑器。它包含了一个丰富的插件市场,提供了很多实用的插件。下面就来分享 2023 年前端必备的... 网站建设# code# react# 开发人员 4年前290
如何方便的检测React项目的性能? ,大家好,我卡颂。,对于长期迭代的React项目,性能是不能忽视的问题。通常我们通过:,检测运行时性能瓶颈。,实际上,React本身就内置了性能检测组件 —— Profiler,可以很方便的检测Rea... 网站建设# profiler# react# 性能 3年前280
老板说,给我把这个 JS React 项目迁移到 TypeScript Hi,我是 ssh,在我做前端的过程中,TypeScript + React 迅速的风靡起来,新项目越来越多的默认启用 TypeScript 做类型保护,它的各种好处对于长期维护的项目已经无需多言。那... 网站建设# javascript# react# typescript 3年前280
一个被忽略的前端细分领域 ,大家好,我卡颂。,回想下你学新技术的主要途径是什么?看书?看技术文档?看博文?看视频?,归纳起来,无外乎「文字」、「视频」两种形式。,从纸媒时代到互联网时代,再到移动互联网时代,虽然信息的载体发生变... 网站建设# react# 交互式# 博文 5年前280
React API 和代码重用的演变! 本文将探究 React API 的演变及其背后的心智模型。从 mixins 到 hooks,再到 RSCs,了解整个过程中的权衡。我们将对 React 的过去、现在和未来有一个更清晰的了解,便于深入研... 网站建设# js# react# 前端 3年前270
React 的生命周期函数有哪些? ,大家好,我是前端西瓜哥。今天来过一下 React 类函数的生命周期。,React 中类组件的生命周期函数,分为挂载、更新、卸载三种:,相关的拦截器:,更新状态的方法:,旧版生命周期:,,新版生命周期... 网站建设# react# 周期函数# 挂载 5年前270
React:我们即将和后端 API 告别? 2020 年底,React 公布了一个全新的特性:Server Components,当时它还处于调研和试验阶段,并没有正式发布,随着 React 18.0 版本的正式发布,Server Compon... 网站建设# components# hooks# react 3年前260
实现React过程中一次有趣的问题排查经历 ,大家好,我卡颂。,逞着对React内部运行流程还记得住,业余时间尝试复刻一个React —— big-react[1]。,即然是复刻一个React,那肯定得跑通部分官方的测试用例。,在跑一个用例时遇... 网站建设# jsx# react# typeof 3年前260
前端框架:性能与灵活性的取舍 ,大家好,我卡颂。,针对「前端框架」,长期存在着各种纷争。其中争论比较大的是下面两项:,比如,各大新兴框架都会掏出benchmark证明自己优秀的运行时性能,在这些benchmark中React通常... 网站建设# api# benchmark# react 5年前260
如何在 React 中使用 Vite 构建工具? Vite使用 esbuild 预构建依赖。由于esbuild是一个用Go编写的JavaScript(和TypeScript)绑定器,这也是它快速的原因之一。 通常,当用React构建一个新项目... 网站建设# esbuild# react# vite 3年前250
React 16 升级到 17 的一个坑:组件销毁时 Ref 可能会被重置为Null 大家好,我是前端西瓜哥。,最近公司的项目用的 React 从 16 升到了 17 版本,选择升级的原因是想以后将项目迁移到 Nextjs 上。,结果发现因为 React 的行为不一致导致了一些看得见的... 网站建设# react# 弹窗# 销毁 3年前250
每个初级 React 开发人员都会犯的八个错误 ,每个学习 React 的程序员在学习过程中都会犯大量的错误。 有时他们甚至不知道自己犯了这些错误。 如果您精通 React,则需要避免这些错误并根据最佳实践进行编码。 所以,我想展示你们所做的错误并... 网站建设# react# 开发人员# 我们 5年前250
React 中的列表渲染为什么要加Key ,大家好,我是前端西瓜哥,今天来学习 React 中的列表渲染要加 key 的原因。,在 React 中我们经常需要渲染列表,比如展示好友列表。,常用写法是用 Arrary.prototype.map... 网站建设# dom# key# react 3年前240
React 最新的路由库,玩出了什么花样? ,大家好,我是 ssh。,React Router 是 React 生态系统中最受欢迎的第三方库之一,近一半的 React 项目中使用了 React Router。,React Router 创建于 ... 网站建设# react# router# 使用 4年前240
大家都能看得懂的源码之 Ahooks 整体架构篇 本文是深入浅出 ahooks 源码系列文章的第一篇,这个系列的目标主要有以下几点:,注:本系列对 ahooks 的源码解析是基于 v3.3.13。自己 folk 了一份源码,主要是对源码做了一些解读... 网站建设# ahooks# hooks# react 4年前240
Form 元素是 React 的未来 大家好,我卡颂。 请思考一个问题:如果有一个HTML标签,React围绕他专门出了2个hook,那这个标签对React未来的发展一定非常重要,这没毛病吧? 这个标签就是 —— form。 React围... 网站建设# Next.js# react# 前端 3年前230
官方答:在React18中请求数据的正确姿势(其他框架也适用) ,大家好,我卡颂。,一些同学喜欢在useEffect中请求初始数据,类似这样:,但React18并不推荐这种方式。,这么写有什么问题?如果不推荐这种方式,那么推荐的方式是什么呢?,本文来看看... 网站建设# react# useeffect# 框架 3年前230
为什么Vue(默认情况下)比React性能更好 ,本文不是要辩论 Vue 好还是 React 好,而是要看看这两个框架在低层次上是如何选择的。,我知道有些开发者在选择框架之前会倾向于看基准。然而,这并不是最关键的方面,因为99%的性能都来自于你写的... 网站建设# jsx# react# vue 4年前220
「React 进阶」react-router v6 通关指南 ,,不知不觉 react-router 已经到了 v6 版本了,可能很多同学发现,v6相比之前的 v5 有着翻天覆地的变化,因为最近接触到了 React 的新项目,用到了 v6 版本的 react-r... 网站建设# react# router# v 3年前190
基于Jsoneditor二次封装一个可实时预览的Json编辑器组件(React版) 做为一名前端开发人员,掌握vue/react/angular等框架已经是必不可少的技能了,我们都知道,vue或react等MVVM框架提倡组件化开发,这样一方面可以提高组件复用性和可扩展性,另一方面也... 网站建设# json# jsoneditor# react 5年前190
5步创建一个具有Serverless用户身份验证的React项目 【51CTO.com快译】许多基于Web的项目最终必须考虑的一个常见问题是如何处理用户身份验证。我们都熟悉网站登录页面后隐藏与用户相关的数据和流程;用户如果拥有一个帐户,则登录;如果没有,则可以创建一... 网站建设# react# serverless# 开发 3年前180
为什么useEffect不适合进行API调用 作者丨Rojan Maharjan, 译者 | 涂承烨, React团队在useEffect钩子中做出的设计选择仍然是一个热议的话题。有些人喜欢,有些人不喜欢。, 如果你不是来自React世界,这听... 网站建设# react# useeffect# 循环 3年前180
2023年提升您React项目的五个库 https://github.com/TanStack/query,图3,简而言之,React Query 可以使在 React 中获取数据体验更好。其是一个处理异步服务器状态的状态管理库,通过提供了... 网站建设# https# query# react 3年前170
六个在 React 中使用的小技巧 这是一个可怕的问题,在 React 中,我们经常会编写条件语句来显示不同的视图,比如这个简单的例子。,但是,当项目的代码量足够大并且有很多 JSX 条件时,事情很快就会失控。 代码变得非常混乱且可读性... 网站建设# ampamp# react# 三元 4年前170
效率宝典:10个超实用的React Hooks库 大家好,我是 CUGGZ。,在 React 项目开发过程中,一套好用的 React Hooks 库是必不可少的,使用这些 React Hooks 库可以大大提升开发效率,避免重复造轮子!今天就来分享1... 网站建设# github# hooks# https 4年前160
四个非常有用的 React 技巧 我们经常需要在React的useEffect中监听键盘事件、鼠标事件等,但是我们经常忘记删除它们。,是的,当我们回到这个组件的时候,scroll事件又会被监听。,换句话说,我们可能会将数千个 wind... 网站建设# react# 我们# 显示 5年前160
如何在 React 中正确的使用 socket.io 客户端? 最近在一个 React 项目中,使用到了 socket.io 处理即时消息,这里面有几点容易被忽视的问题,例如:在 React 单页面应用中如何防止出现多个 socket 实例、在任意的的组件内如何方... 网站建设# io# react# socket 3年前150
Jest:给你的 React 项目加上单元测试 ,大家好,我是前端西瓜哥。,Jest 是一款轻量的 JavaScript 测试框架,它的卖点是简单好用,由 facebook 出品。本文就简单讲讲如何使用 Jest 对 React 组件进行测试。,单... 网站建设# jest# react# 单元测试 4年前150
Github上八个优秀的React项目 React Tetris 是一个使用 React、Redux、Immutable 制作的俄罗斯方块游戏。它是一个非常不错的 React 练手项目,小小的“方块”还是有很多的细节可以优化和打磨。项目的官... 网站建设# github# react# tetris 5年前130
简单好用的前端拖拽排序库 ,大家好,我是 CUGGZ。,今天来推荐 8 个简单又好用的前端拖拽排序库!,react-beautiful-dnd 是一款美观且简单易用的 React 列表拖拽库。其动画效果自然,性能优秀,简洁而强... 网站建设# beautiful# github# react 4年前80