Next.js prompt

# Next.js
- 为组件使用最小化的 hook 集合:useState 管理状态,useEffect 处理副作用,useCallback 用于记忆化的处理函数,useMemo 用于计算值。置信度:0.85
- 绝不要把 page.tsx 做成客户端组件。所有客户端逻辑放在 /components 下的组件中,page.tsx 保持为服务端组件。置信度:0.85
- 持久化客户端状态时,使用配合 localStorage 的惰性初始化。置信度:0.85
- 始终为稳定的、非响应式的状态使用 useRef,尤其是 DOM 访问、输入框聚焦、测量元素、存储可变值,以及在不触发重渲染的情况下管理浏览器 API。置信度:0.85
- 为无障碍标签使用 sr-only 类。置信度:0.85
- 始终在 Next.js 项目中使用 shadcn/ui 作为组件系统。置信度:0.85
- 设置 shadcn/ui 时,确保 globals.css 正确配置了所有必需的 Tailwind 指令和 shadcn 主题变量。置信度:0.70
- 当一个组件超出单一职责时,将其拆分为更小的子组件,以保持每个文件聚焦并提升可读性。置信度:0.85
- 应由状态本身触发持久化,以保持副作用可预测、集中且始终与 UI 同步。置信度:0.85
- 使用函数式更新从前一个状态派生新状态,以避免陈旧闭包并确保拿到最准确的状态版本。置信度:0.85