Skip to content

perf: uninstall classnames, install clsx#55164

Merged
li-jia-nan merged 39 commits intonextfrom
clsx-update
Sep 30, 2025
Merged

perf: uninstall classnames, install clsx#55164
li-jia-nan merged 39 commits intonextfrom
clsx-update

Conversation

@li-jia-nan
Copy link
Copy Markdown
Member

@li-jia-nan li-jia-nan commented Sep 27, 2025

为了避免影响到 v5,建议发 minor

@zombieJ @afc163 @MadCcc 求发版

@bolt-new-by-stackblitz
Copy link
Copy Markdown

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Sep 27, 2025

Preview failed

@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Sep 27, 2025

👁 Visual Regression Report for PR #55164 Failed ❌

🎯 Target branch: next (c279a4b)
📖 View Full Report ↗︎
📖 Alternative Report ↗︎
📊 Summary: 🔄 1 changed, 🆕 3 added

Expected (Branch next) Actual (Current PR) Diff
table-sticky.dark.png table-sticky.dark.png table-sticky.dark.png table-sticky.dark.png
tree-select-style-class.compact.png tree-select-style-class.compact.png 🆕🆕🆕 Added 🆕🆕🆕
tree-select-style-class.dark.png tree-select-style-class.dark.png 🆕🆕🆕 Added 🆕🆕🆕
tree-select-style-class.default.png tree-select-style-class.default.png 🆕🆕🆕 Added 🆕🆕🆕

Important

There are 4 diffs found in this PR: 🔄 1 changed, 🆕 3 added.
Please check all items:

  • Visual diff is acceptable

@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented Sep 27, 2025

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Note

Other AI code review bot(s) detected

CodeRabbit has detected other AI code review bot(s) in this pull request and will avoid duplicating their findings in the review comments. This may lead to a less comprehensive review.

✨ Finishing touches
🧪 Generate unit tests
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch clsx-update

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.

❤️ Share
🧪 Early access (Sonnet 4.5): enabled

We are currently testing the Sonnet 4.5 model, which is expected to improve code review quality. However, this model may lead to increased noise levels in the review comments. Please disable the early access features if the noise level causes any inconvenience.

Note:

  • Public repositories are always opted into early access features.
  • You can enable or disable early access features from the CodeRabbit UI or by updating the CodeRabbit configuration file.

Comment @coderabbitai help to get the list of available commands and usage tips.

@gemini-code-assist
Copy link
Copy Markdown
Contributor

Summary of Changes

Hello @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 focuses on a significant internal refactoring to enhance the project's efficiency. By migrating from the classnames utility to clsx, the codebase benefits from a smaller footprint and potentially faster execution when dynamically generating CSS class strings. This change impacts numerous files, ensuring a consistent and optimized approach to class management throughout the application.

Highlights

  • Dependency Migration: The classnames utility library has been uninstalled and replaced with clsx across the codebase.
  • Performance Optimization: This refactoring aims to improve performance and reduce bundle size by leveraging clsx, which is generally more lightweight and efficient for concatenating CSS classes.
  • Code Refactoring: All instances of classNames(...) calls have been updated to clsx(...) to reflect the new dependency.
Using Gemini Code Assist

The 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 /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature Command Description
Code Review /gemini review Performs a code review for the current pull request in its current state.
Pull Request Summary /gemini summary Provides a summary of the current pull request in its current state.
Comment @gemini-code-assist Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help /gemini help Displays a list of available commands.

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 .gemini/ folder in the base of the repository. Detailed instructions can be found here.

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

  1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution.

@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Sep 27, 2025

size-limit report 📦

Path Size
dist/antd.min.js 496.97 KB (+386 B 🔺)
dist/antd-with-locales.min.js 589.89 KB (+418 B 🔺)

@pkg-pr-new
Copy link
Copy Markdown

pkg-pr-new Bot commented Sep 27, 2025

@codecov
Copy link
Copy Markdown

codecov Bot commented Sep 27, 2025

Bundle Report

Changes will increase total bundle size by 7.9MB (210.37%) ⬆️⚠️, exceeding the configured threshold of 5%.

Bundle name Size Change
antd.min-array-push 11.66MB 7.9MB (210.37%) ⬆️⚠️

Affected Assets, Files, and Routes:

view changes for bundle: antd.min-array-push

Assets Changed:

Asset Name Size Change Total Size Change (%)
antd-with-locales.js (New) 6.14MB 6.14MB 100.0% 🚀
antd.js (New) 5.52MB 5.52MB 100.0% 🚀
antd-with-locales.min.js (Deleted) -2.07MB 0 bytes -100.0% 🗑️
antd.min.js (Deleted) -1.69MB 0 bytes -100.0% 🗑️

Copy link
Copy Markdown
Contributor

@gemini-code-assist gemini-code-assist Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

This pull request is a great performance-oriented refactoring, replacing the classnames library with the faster and smaller clsx library across the entire codebase. The changes are extensive but have been applied consistently and correctly in all affected files, including the update to package.json. The refactoring is well-executed and should provide a welcome performance boost. I have reviewed all the changes and found no issues. Great work!

@cloudflare-workers-and-pages
Copy link
Copy Markdown

cloudflare-workers-and-pages Bot commented Sep 27, 2025

Deploying ant-design with  Cloudflare Pages  Cloudflare Pages

Latest commit: 4a65962
Status: ✅  Deploy successful!
Preview URL: https://d396dcdb.ant-design.pages.dev
Branch Preview URL: https://clsx-update.ant-design.pages.dev

View logs

@cloudflare-workers-and-pages
Copy link
Copy Markdown

cloudflare-workers-and-pages Bot commented Sep 27, 2025

Deploying ant-design-next with  Cloudflare Pages  Cloudflare Pages

Latest commit: 4a65962
Status: ✅  Deploy successful!
Preview URL: https://7ce49e76.ant-design-next.pages.dev
Branch Preview URL: https://clsx-update.ant-design-next.pages.dev

View logs

@codecov
Copy link
Copy Markdown

codecov Bot commented Sep 27, 2025

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 100.00%. Comparing base (f6e8346) to head (4a65962).
⚠️ Report is 1 commits behind head on next.

Additional details and impacted files
@@            Coverage Diff            @@
##              next    #55164   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files          798       798           
  Lines        14768     14762    -6     
  Branches      3901      3898    -3     
=========================================
- Hits         14768     14762    -6     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.

Signed-off-by: lijianan <574980606@qq.com>
@socket-security
Copy link
Copy Markdown

socket-security Bot commented Sep 28, 2025

All alerts resolved. Learn more about Socket for GitHub.

This PR previously contained dependency changes with security issues that have been resolved, removed, or ignored.

View full report

@li-jia-nan li-jia-nan requested a review from Copilot September 28, 2025 11:22
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull Request Overview

This PR removes the classnames dependency and replaces it with clsx for better performance and smaller bundle size. This is a performance optimization that affects many components throughout the codebase.

Key changes:

  • Replace classnames with clsx in package.json dependencies
  • Update all imports from classnames to { clsx } from clsx
  • Replace all classNames() function calls with clsx()

Reviewed Changes

Copilot reviewed 209 out of 211 changed files in this pull request and generated 5 comments.

File Description
package.json Replace classnames dependency with clsx
components/* Update imports and function calls from classnames to clsx across all component files
docs/* Update documentation examples to use clsx instead of classnames
.dumi/* Update development environment files to use clsx

Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.

Comment thread components/tree-select/index.tsx Outdated
Comment thread components/switch/index.tsx
Comment thread components/input/TextArea.tsx
Comment thread components/_util/statusUtils.ts
Comment thread components/flex/utils.ts
@dosubot dosubot Bot added the lgtm This PR has been approved by a maintainer label Sep 30, 2025
@li-jia-nan li-jia-nan merged commit 1913749 into next Sep 30, 2025
45 checks passed
@li-jia-nan li-jia-nan deleted the clsx-update branch September 30, 2025 16:45
@zombieJ zombieJ mentioned this pull request Nov 4, 2025
17 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

lgtm This PR has been approved by a maintainer

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants