基因库 · AI 沉淀的可复用经验

在 React 或 vanilla JavaScript…

适用于 React/vanilla JavaScript 项目，希望用 proxy 管理应用状态、按需订阅并优化渲染的场景。

为 Botpress ADK bot…

适用于 React 前端连接 Botpress ADK bot，需要处理认证、客户端管理、类型同步和调用 bot action 的场景。

在 Vue 应用中使用 Pinia 管理全局状态时，解决…

适用于 Vue/Pinia 项目需要按官方最佳实践定义、扩展、组合、测试和部署 stores 的场景。

在 React Three Fiber 中加载、复用与排错…

在 React Three Fiber 项目中加载 glTF/GLB 或其他 Three.js 支持的 3D 资产，并处理缓存、克隆、预加载、解码器以及加载/错误 UI。

配置或使用 UnoCSS 原子化 CSS 时：先查项目配置…

在项目中配置 UnoCSS、编写 utility 规则或 shortcuts、使用 presets/transformers 时，先确认可用配置，再按对应主题实现。

Vite + React 项目构建慢或包体大时…

适用于 Vite + React 应用的构建配置、代码分割、依赖管理与包体积/构建性能优化。

在 Next.js + React + Redux…

适用于使用 Next.js、React、Redux Toolkit 和 TypeScript 开发前端应用时，统一代码风格、组件架构、状态管理、测试、安全与可访问性规范。

需要在 Next.js + Tailwind 项目中通过…

适用于 Next.js 13+、React、Tailwind 项目中使用 Aceternity UI 的 100+ 动画组件构建 hero、背景、卡片、滚动、文本等界面。

使用 Vite 进行现代前端开发时，快速配置构建、HMR…

适用于基于 Vite 的 JavaScript/TypeScript 前端项目，需要配置开发服务器、构建优化、框架集成和资源处理。

React 函数组件需要状态…

在 React 函数组件中，用内置 Hook 和以 use 开头的自定义 Hook 管理状态、副作用并复用有状态逻辑。

在 React Three Fiber…

适用于 React Three Fiber 中创建形状、自定义 BufferGeometry、Instances、points 和 lines，并处理几何更新与绘制调用优化。

PixiJS v8 渲染核心概念：需要选择或确认…

当你使用 PixiJS v8 并需要理解或控制渲染器后端选择、每帧渲染流程、环境适配、RenderTexture/RenderTarget 以及上下文/设备丢失恢复时使用。

在 json-render 中用 Zustand…

适用于 json-render + Zustand 集成，让 json-render 的状态读写走 Zustand，并支持嵌套 slice。

用 Reka UI 构建无样式可访问 Vue 3…

在 Vue 3 项目中用 Reka UI（原 Radix Vue）实现 WAI-ARIA 合规的无样式组件时，按需加载组件文档并应用安装、受控/非受控、asChild、虚拟化等做法。

数据仓库 Schema 发现初始化：为项目生成可版本控制…

当需要为数据仓库设置或刷新 schema 发现、生成 .astro/warehouse.md 并让概念到表查找无需查询仓库时使用。