排序
理解React服务端组件(RSC)
原文链接:Understanding React Server Components 原文作者:Alice Alexandra Moore 前言及简单介绍:Vercel(Next.js背后公司)关于最新的React Server Components(React服务端组件)的介绍...
关于 Antd Table 报错 ”ResizeObserver loop completed with undelivered notifications“
背景 在 sentry 里发现线上发现一个报错 ”ResizeObserver loop completed with undelivered notifications“ ,于是调查了一下,大概是因为 antd 的 table 组件(v4.20.x)(其实下拉框组件也...
5 分钟教你用阿里 Formily.js 快速做复杂表单
1. Formily 是什么? Formily 是 alibaba 开源表单框架,抽象了表单领域模型的 MVVM 表单解决方案。 这里引用官网的介绍: 众所周知,表单场景一直都是前端中后台领域最复杂的场景,它的复杂度...
使用 next-themes 两行代码为 Next.js 项目添加暗黑模式
之前写过文章介绍 React 暗黑模式的实现方式,其原理基本和目前主流的暗黑模式实现方案相似,主要用到的技术有:CSS Variables, 媒体查询, window.matchMedia, React Context 等。但是每个项目...
轻松实现!用SVG打造简洁实用的柱形图和折线图,让数据一目了然
前言 今天分享一种非常酷炫的数据可视化方式——使用SVG创建简洁实用的柱形图和折线图!SVG是一种使用XML标记语言描述矢量图像的技术。与传统的栅格图像不同,SVG图像可以无损缩放,保持清晰度...
简单讲解怎么用pnpm搭建一个monorepo开源react项目(Vite 和 TypeScript)
背景 本人正在做一个开源截图、录屏和录像的跨平台桌面软件——pear-rec(梨子录像),本项目是基于Electron、React和Vite搭建的,一开始是使用vite-react-electron脚手架快速搭建的,但是随着项...
React key属性:性能列表的最佳实践
重点内容: key只在重新渲染时生效 key一致时,React不会移除,重新挂载DOM。也就不会触发组建的render和mounted事件。同时组件内部维护的state也能维持。只会根据props更新DOM的显示内容 key不...
用 React+ts 实现无缝滚动的走马灯
最近在工作中用到了走马灯,自己折腾一些时间,踩了一点小坑,所以想整理一篇文章,需要的伙伴可以参考一下,有什么建议欢迎在评论区提哦~ 一、走马灯的作用 走马灯是一种常见的网页交互组件,...
Next.js SSR优化总结
前言 前段时间使用Next.js(13.x)开发一个展示类型的官网,功能比较简单。正式上线前,使用Lighthouse 评测,并做了些性能优化,整体评分达到了90+ ,在此简单总结下。 在开始说优化之前,我们首...
?VuePress-theme-hope2 搭建个人网站,万字长文保姆级教程,包含自动部署、评论、搜索等功能
文章同步在公众号:萌萌哒草头将军,欢迎关注 我的博客地址:mmdctjj.github.io/blogs2/ 对应仓库地址:github.com/mmdctjj/blo… VuePress 是一个以 Markdown 为中心的静态网站生成器。好处是...
2023金秋版:基于Vite4+React的Chrome插件开发教程
Chrome浏览器插件(Chrome Extension,简称CRX)大家已经非常熟悉了。目前的Chrome Extension开发应该按照Manifest V3的规范。按照谷歌官方的通知,2023年6月开始,将不允许发布Manifest V2的Ch...
React&Vue 系列:简述 Vue 中 的 JSX
背景:作为使用三年 react.js 的搬运工,目前正在积极学习 vue.js 语法,而在学习的过程中,总是喜欢和 react.js 进行对比,这里也不是说谁好谁坏,而是怀有他有我也有,他没我还有的思想去学习...
制作一个响应式头部导航栏(Tailwind CSS + Headless UI)
头部导航栏几乎是每个网站必备的元素,可以提供快速的页面跳转和主要信息展示。在移动设备为主的当前环境下,制作一个网站首先需要考虑移动端用户的体验,那么使用响应式方案来实现就是首选方案...
为什么用 React 一定要配合框架(Next,Remix)使用?
Hi,大家好我是 ssh,今天我看到 Leerob 分享的 Why You Should Use a React Framework,讲述了他关于为什么要使用 React 框架(如 Next,Remix,Gastby),而不是直接裸用 React 的一些见解,...
从零开始打造基于Module Federation的微前端架构(一)——Monorepo架构与远程模块集成
前言 本篇开始,一起讨论一下,基于Module Federation的微前端架构的架设方案。内容主要涉及到以下几个方面: 把单体应用,拆分为多个微应用,不可能一拆了之。微前端解决单体应用痛点的同时,...
从 React 源码中学习数据结构
学习卡卡颂老师的 React 源码课程,通过自己写一个 小型 React 来学习其中的思想,对其中涉及到数据结构相关部分的内容有所感悟,跟大家分享一下。 React 基本原理 现代前端框架的原理基本都可...
跳槽准备,总结了点面试题刷刷
一、HTML与CSS 1.什么是盒模型?说一说你对它的理解! 盒模型Box Model是指在网页设计中用于描述和布局 HTML元素的一种模型。 它将每个HTML元素看作是一个矩形的盒子,由以下几个部分组成 内容(co...
从零搭建React脚手架(Webpack5+Typescript+Eslint)
前言 React是当前最流行的前端开发框架之一,React可以使前端开发更加便利,有着组件化,虚拟dom,高性能,单向数据流,生态系统丰富等优势。因此应运而生的react脚手架也有很多,一些官方推荐...
React18内核探秘:手写React高质量源码迈向高阶开发
手写 React 高质量源码,迈向高阶开发 核心代码,注释必读 // download:3w ukoou com React 18中的新内容 React 18中的突破性变化 一个重要的版本如果没有突破性的变化会是什么?嗯,这个版本...
手写React Hooks并逐行分析
前言 哈喽大家好,我是Lotzinfly,一位前端小猎人。欢迎大家来到前端丛林,在这里你将会遇到各种各样的前端猎物,我希望可以把这些前端猎物统统拿下,嚼碎了服用,并成为自己身上的骨肉。当我们...