perf: uninstall classnames, install clsx #763
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Walkthrough本次变更包含：忽略文件配置更新与锁文件调整；依赖版本更新与新增依赖；Form/List 组件中上下文与 memo 类型显式化；useWatch 内部表达式分组与 try/catch 语法微调；测试用例的类名与 key 生成格式规范化。 Changes
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Possibly related PRs
Suggested reviewers
Poem
Pre-merge checks and finishing touches❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✨ Finishing touches
🧪 Generate unit tests
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Summary of ChangesHello @li-jia-nan, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed! This pull request primarily focuses on a performance optimization by migrating from the Highlights
Using Gemini Code AssistThe full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips. Invoking Gemini You can request assistance from Gemini at any point by creating a comment using either
Customization To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a Limitations & Feedback Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here. You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension. Footnotes
|
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## master #763 +/- ##
=======================================
Coverage 99.53% 99.53%
=======================================
Files 19 19
Lines 1288 1289 +1
Branches 320 316 -4
=======================================
+ Hits 1282 1283 +1
Misses 6 6 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
This pull request introduces clsx as a replacement for classnames to improve performance, alongside several other enhancements. These include updating dependencies, improving TypeScript typings for better code safety, fixing a bug in a React hook's dependency array, and adopting best practices in test files. My review identifies two main issues: clsx is added as a dependency but not used, and the pnpm-lock.yaml file is being ignored by Git, which can lead to non-reproducible builds. The other changes are positive contributions to the project's maintainability and correctness.
|
Review the following changes in direct dependencies. Learn more about Socket for GitHub.
|
|
Warning Review the following alerts detected in dependencies. According to your organization's Security Policy, it is recommended to resolve "Warn" alerts. Learn more about Socket for GitHub.
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
src/List.tsx (1)
73-73: 移除 keyManager 依赖 — 因其引用稳定不会触发 memo 更新
keyManager 来源于ref.current，对象引用始终不变，内部属性的变更不会触发useMemo重新计算，建议将依赖数组恢复为[prefixName]。
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (6)
.gitignore(2 hunks)package.json(1 hunks)src/Form.tsx(2 hunks)src/List.tsx(3 hunks)src/useWatch.ts(2 hunks)tests/common/InfoField.tsx(1 hunks)
🧰 Additional context used
🧬 Code graph analysis (2)
src/List.tsx (2)
src/interface.ts (2)
InternalNamePath(6-6)InternalFormInstance(282-300)src/utils/valueUtil.ts (1)
getNamePath(15-17)
src/Form.tsx (1)
src/interface.ts (1)
InternalFormInstance(282-300)
🔇 Additional comments (12)
.gitignore (2)
9-9: LGTM！添加 pnpm-lock.yaml 到忽略列表是合理的，与已有的其他包管理器锁文件保持一致。
33-33: LGTM！修复 bun.lockb 的文件结尾换行符，符合代码规范。
src/Form.tsx (2)
17-18: LGTM！改进了类型导入组织。将类型导入与值导入分离是良好的 TypeScript 实践，有助于：
- 提高编译性能（类型导入可以被完全擦除）
- 增强代码可读性
- 避免潜在的循环依赖问题
189-195: LGTM！显式类型注解提升了类型安全性。为
useMemo添加显式的InternalFormInstance类型注解增强了类型推断和类型检查的可靠性。tests/common/InfoField.tsx (2)
21-21: LGTM！统一了字符串引号风格。将 className 的单引号改为双引号，与项目的字符串引号规范保持一致。
25-25: LGTM！改进了 React key 的生成方式。使用模板字符串
error-${index}和warning-${index}替代原始数字索引，提高了：
- key 的可读性和语义化
- 在开发工具中的调试体验
- 避免不同列表间可能的 key 冲突
Also applies to: 30-30
src/useWatch.ts (2)
18-24: LGTM！简化了异常处理。由于 catch 块中未使用错误对象，移除未使用的
err参数是合理的简化，符合 ESLint 最佳实践。
120-124: LGTM！增强了代码可读性。为三元表达式的结果添加显式括号，明确了运算优先级，提高了代码的可读性和可维护性。
src/List.tsx (4)
3-10: 导入类型明确化，符合最佳实践。新增的
InternalNamePath和InternalFormInstance类型导入使得后续的 memo 类型标注更加明确，提升了代码的可读性和类型安全性。
50-50: 格式优化，代码更简洁。将 keyRef 初始化合并为单行，提升了代码的简洁性。
54-57: 显式类型标注提升类型安全性。为
prefixNamememo 添加InternalNamePath类型标注，使返回值类型更加明确，符合 TypeScript 最佳实践。
59-62: fieldContext 类型化与依赖项更新正确。显式标注
InternalFormInstance类型，并更新依赖数组为[context, prefixName]，确保在上下文或前缀名称变化时正确重新计算。
Summary by CodeRabbit