peiiii 前端代码优化
定位
这是显式前端治理任务的诊断入口，不是所有前端改动的生命周期 owner。本 skill 只识别最高收益的结构问题并选择一个当前专项 owner；阶段推进、验证、Review 和交付由当前生命周期负责。
诊断顺序
- 找出用户可见行为和稳定业务事实。
- 判断当前对象是展示组件、业务容器、adapter、manager/store/presenter 还是生命周期 owner。
- 查重复状态、重复 action、宽 props、组件内业务编排、effect 状态迁移和重复 UI 骨架。
- 按收益排序：事实双写/错误 owner > 业务透传 > 生命周期不安全 > 重复实现 > 单纯文件偏长。
- 每次只选择一个可验证 vertical slice，不同时启动所有前端专项治理。
专项选择
- 状态归属、MVP、store/manager/presenter、prop drilling：View Logic 解耦。
- React key、动态组件、streaming DOM、焦点/选区/iframe/editor 连续性：渲染生命周期安全。
- 样式 owner、响应式、基础组件可移植性：样式封装。
- 操作语义、状态反馈、键盘可达性、tooltip/menu：交互质量。
- 文件和 feature root 变化：文件组织治理。
同一判断只加载一个上述专项；完成该 slice 后再决定是否需要下一项。
实施原则
- 先删重复计算、重复状态、重复入口和无语义中间组件。
- 业务状态与动作收敛到最近 owner，展示组件只接展示合同。
- 不因文件长机械拆分；按变化原因、生命周期、不变量和真实复用拆分。
- 不用新 ViewModel/Presenter/Manager 包装混乱；新 owner 必须减少参数面或删除旧职责。
- 必要的清晰增长允许存在，不为行数门槛扩大无关重构。
输出
审计时给出 findings、证据、正确 owner、优先级和最小 slice。实施时只汇报当前 slice、主要验证和是否出现新的结构风险，不自动加载主观 review 或完整治理全家桶。