react.js

用 react 的react-syntax-highlighter 实现语法高亮、行号与多行错误行高亮本文说明如何封装一个可复用的代码展示组件：在卡片或详情中展示代码片段，并同时支持语法着色、行号，以及按业务标出的单行或多行背景高亮（如“问题行”），并给出接入方式。

社恐的下水道蟑螂

从奶茶店彻底搞懂 SSR！从零到拿捏服务端渲染，看完面试吹牛逼不卡壳本文适合人群：家人们谁懂啊！辛辛苦苦写了个 React 单页应用，交互丝滑到飞起，结果一上线傻眼了：用户打开网页先看 3 秒白屏，脾气爆的直接反手一个关闭；百度爬虫爬了半个月，连你页面的毛都没抓到，搜索排名直接沉到马里亚纳海沟；老板拍着桌子问你：为啥人家官网打开就有内容，咱们的得等半天？你挠破头加了路由懒加载、骨架屏，优化了半天，还是治标不治本。

Vue和React之争

从零到一掌握 React 核心语法与规则：前端开发者必备指南作为目前前端领域最主流的框架之一，React 凭借组件化、虚拟 DOM、单向数据流等核心特性，成为前端开发者的必备技能。很多新手在入门 React 时，容易混淆 JSX 语法、组件写法、状态管理等规则，导致开发效率低下。

我命由我12345

React Router 6 - 编程式路由导航、useInRouterContext、useNavigationType指定具体的路径传入数值进行前进或后退，类似于 5.x 中的 history.go()useNavigationType 用于返回当前的导航类型，导航类型表示用户是如何来到当前页面的

我命由我12345

React Router 6 - 嵌套路由、路由传递参数默认情况下，子组件匹配成功，父组件的导航也会高亮，当 NavLink 上添加了 end 属性后，子组件匹配成功，父组件的导航不会高亮

英俊潇洒美少年

MessageChannel 如何实现时间切片这就是时间切片（Time Slicing）。这个方法接收一个大任务，自动分片，每片5ms，不阻塞页面。

react数据大屏四种适配方案在数据大屏、可视化面板、全屏展示类项目中，固定比例、等比缩放、无拉伸变形是核心需求。传统的 rem、vw/vh 适配方案在大屏场景下容易出现布局错乱、文字模糊、比例失调等问题。这里实现一个开箱即用、支持 4 种缩放模式的 React Hook：useScreenScale，一行代码实现大屏完美自适应，支持等比缩放、宽铺满、高铺满、强制拉伸四种模式，兼容窗口 resize，真正做到一次集成、全端适配。

Lexical依赖版本冲突与标题渲染昨天主要修复了两个bug：一是 PDF/Doc 导出时的依赖冲突导致的崩溃问题，二是文档标题更新后的 UI 同步问题。本文记录问题现象、排查过程、根因分析及解决方案，并对过程中的技术选型与排查方法进行复盘总结。

React如何远程加载组件做过低代码开发的应该都遇到过组件加载的问题，一开始我们是把组件和整个项目放在同一个仓库中，打包的时候每个组件都是一个单独的chunk，这样加载的时候按需加载。但是随着项目越来越大，组件越来越多，甚至一些自定义的等等，这一套逻辑就不能支持下去。

React录制视频和人脸识别一、录制视频

ReactNative项目OpenHarmony三方库集成实战：react-native-gifted-charts数据可视化是移动应用开发中的重要需求，无论是展示销售数据、用户统计还是财务报表，都需要直观、美观的图表组件。react-native-gifted-charts 是 React Native 生态中最强大、最灵活的图表库之一，支持折线图、柱状图、饼图、面积图等多种图表类型，并提供丰富的自定义选项。

前端 -- react快速入门1、使用 React 的脚手架工具来搭建项目在 React 中，使用 JSX 来描述页面。你可以把类似于 HTML 的代码单独提取出来，例如：

在React中实现CSS动画的回放React组件：CSS动画：缺点是会导致组件完全重新挂载，可能影响性能。React组件：CSS动画同上。

React 性能优化（下）：useCallback 与 useTransition 实战在 React 应用性能优化中，useCallback 和 useTransition 是两个强大但常被误解的 Hook。本文将深入探讨它们的正确使用场景、常见陷阱以及实际代码示例，帮助你写出更高效的 React 应用。

Zustand 状态管理实战详解：轻量高效的React状态方案在React项目开发中，状态管理是贯穿始终的核心需求——从简单的组件内状态，到复杂的跨组件、跨页面全局状态，选择一款合适的状态管理工具，能极大提升开发效率、降低维护成本。Redux作为经典方案，功能强大但配置繁琐、概念繁多；Context+useReducer虽原生无依赖，却容易陷入“Provider嵌套地狱”和性能瓶颈。

做了一个AI聊天应用后，我决定试试这个状态管理库AI应用前端最大的坑，不是LLM调用，而是状态管理最近做了个AI聊天应用，类似ChatGPT的那种。本来想用Redux，毕竟老牌方案，结果被毒打了一遍。

ReactNative项目OpenHarmony三方库集成实战：react-native-confirmation-code-field验证码输入场景非常常见，如短信验证码登录、邮箱验证、支付密码输入等。一个优秀的验证码输入组件需要提供良好的用户体验，包括自动聚焦、输入完成自动跳转、粘贴支持等功能。react-native-confirmation-code-field 是 React Native 生态中最流行的验证码输入组件库，提供了灵活的 API 和丰富的自定义选项。

个人精选 Skills 清单用 AI + Cursor 有段时间了，我最近整合了一部分我用过和常用的一些 Skills关键提醒：安装技能必须加 -g 全局安装参数，否则 Cursor 无法识别；安装完成后必须重启 Cursor 才能生效。