排序
这个交互式个人博客能让你眼前一亮✨? ?
从构思到上线的全过程,开发中遇到一些未知问题,也都通过查阅资料和源码一一解决,小记一下望对正在使用或即将使用Nextjs开发的你们有所帮助。 那些年我开发过的博客 就挺有意思,域名,技术栈...
React进阶(三):React项目文件结构介绍
在《React进阶(二):构建第一个React应用》博文中,介绍了React开发环境搭建及建立第一个React应用。本篇博文继续探讨React项目中合理的文件结构。 初次创建React项目,一般选择使用脚手架工...
React 实现响应式tag列表
前言 最近ui小姐姐又给我出了一个难题,首先有一个tag列表,像下面这样 我们要做的呢就是让这些tag只显示第一行,其余的显示数字,就像这样 这可把我给难住了啊,我只是个组件的搬运工?,为什么要承受...
React18性能优化指南
原文地址:vercel.com/blog/how-re… 本文带你了解Transitions、Suspense和React Server Components等并发功能如何提高应用程序性能。 熟悉React的实现思路 学习React框架的进化思路 React18引...
Web Worker没有使用场景?那只是你没有用到而已???
前几天的一场面试中,被面试官吐槽了一下,我在我项目中直接使用 Prettier 来做代码格式化,首先加载该依赖包就需要一定的成本了,况且格式化的过程中可能需要一些计算,会导致阻塞整个浏览器。...
2023金秋版:基于Vite4+React的Chrome插件开发教程
Chrome浏览器插件(Chrome Extension,简称CRX)大家已经非常熟悉了。目前的Chrome Extension开发应该按照Manifest V3的规范。按照谷歌官方的通知,2023年6月开始,将不允许发布Manifest V2的Ch...
用 React+ts 实现无缝滚动的走马灯
最近在工作中用到了走马灯,自己折腾一些时间,踩了一点小坑,所以想整理一篇文章,需要的伙伴可以参考一下,有什么建议欢迎在评论区提哦~ 一、走马灯的作用 走马灯是一种常见的网页交互组件,...
微前端与Monorepo架构实践
1.什么是微前端? 1.1 微前端简介 微前端是一种将不同的前端应用聚合到一个整体应用中的方法。 这样的设计思路来源于微服务架构,即将一个大型的后端应用拆分成一系列小型、独立的服务。微前端...
”高级女秘书“ —— webpack 创建一个 React 应用
webpack webpack 简介 有说 webpack 是打包机,也有人说它是加工厂,我总感觉它像一个高级的女秘书。今天的故事又开始了: 话说有位上世纪80年代下海创业成功的大老板,但是呢,文化程度不高,...
新版React官方文档解读(五)- Hooks 之 useId 和 useSyncExternalStore
大家好呀,我是小肚肚肚肚肚哦! React 官网出了 beta 版的新版本,仍旧没有中文版。对于国内不少开发者来说增加了不少麻烦。我这里以前端开发的角度归纳总结一下,把其中大家重点使用的部分介...
React 实现文件分片上传和下载
React 实现文件分片上传和下载 在开发中,文件的上传和下载是常见的需求。然而,当面对大型文件时,直接的上传和下载方式可能会遇到一些问题,比如网络传输不稳定、文件过大导致传输时间过长等...
重读React文档
这篇结合自己的理解,将React文档中一些更细节的内容进行整理,便于快速查阅。 PS:这篇文章的组织方式是发散的,初学React的小伙伴还是建议直接读原文档哦。有React开发经验的小伙伴,如果针对...
React的基本知识与常见hooks的用法
1. 渲染一个基本组件 以下一个小demo用来展示第一个用react语法来编写的组件 // main文件 import React from 'react'; import ReactDOM from 'react-dom/client'; import App from './App.tsx';...
关于React初始化加载组件会渲染两次的问题
React组件在初始加载时渲染两次: import React from 'react' export default function App() { console.log('被加载') return <div>App</div> } 如上在控制台我们会看到输出了两次...
图解 history api 和 React Router 实现原理
Router 是开发 React 应用的必备功能,那 React Router 是怎么实现的呢? 今天我们就来读一下 React Router 的源码吧! 首先,我们来学一下 History API,这是基础。 什么是 history 呢? 就是...
从零开始打造基于Module Federation的微前端架构(一)——Monorepo架构与远程模块集成
前言 本篇开始,一起讨论一下,基于Module Federation的微前端架构的架设方案。内容主要涉及到以下几个方面: 把单体应用,拆分为多个微应用,不可能一拆了之。微前端解决单体应用痛点的同时,...
来嘛来嘛~在React中感受动态水波进度条的美妙~
前言 好久好久没有更文,也好久没有通过文章来讲述近况了。今天有点空余时间,不想吹牛皮就想着来写一篇文章,毕竟闲下来还是要多总结总结,这样才能稳步前进呀。 这次要聊的是前段时间经历的一...
JSX如何转成react-fiber的?
什么是fiber? 一个fiber本质上是一个Fiber类的实例,以下是实例中的各个属性。可以看出,每一个Fiber节点之间通过指针相互关联,并找到下一个Fiber节点。因此,所有的Fiber节点相互关联就形成...
React–Hooks全系列
为什么需要Hook Hook 是 React16.8 的新增特性,可在不编写 class 组件的情况下,使用 state 以及其他 React 特性 class 组件相对于函数式组件的优势 从状态维护角度来说: class 组件可以定义 ...
React–Router(6.x版本)
路由概念 核心: 改变 URL ,但是页面不进行整体的刷新 作用:维护 URL 和渲染页面的映射关系 目的: 通过 JavaScript 监听 URL 的改变,并且根据 URL 的不同重新渲染页面 改变 URL 但不刷新页...