Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore: replace classnames with clsx #7245

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Conversation

wojtekmaj
Copy link
Contributor

@wojtekmaj wojtekmaj commented Nov 19, 2024

Description

clsx is a drop-in replacement for classnames, a tad (~200B) smaller, and a bit more popular (overtook classnames 1.5 yr ago). A no brainer, really.

Validation

The only errors could be me forgetting to change some classnames imports to clsx (which would have triggered a lint error), or forgetting to update some classNames() calls to clsx() (which would have triggered a lint error). So as long as ESLint is happy, I am too!

Related Issues

Check List

  • I have read the Contributing Guidelines and made commit messages that follow the guideline.
  • I have run npm run format to ensure the code follows the style guide.
  • I have run npm run test to check if all tests are passing.
  • I have run npx turbo build to check if the website builds without errors.
  • I've covered new added functionality with unit tests if necessary.

@wojtekmaj wojtekmaj requested a review from a team as a code owner November 19, 2024 20:48
Copy link

vercel bot commented Nov 19, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated (UTC)
nodejs-org ✅ Ready (Inspect) Visit Preview Nov 19, 2024 8:50pm

@RedYetiDev
Copy link
Member

I honestly don't see a difference between the packages, 200B during build really isn't too much imo, but we'll see what other members say

Copy link
Member

@canerakdas canerakdas left a comment

Choose a reason for hiding this comment

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

+1 to @RedYetiDev , I think I am in favor of using whatever is best for newcomers

Also, It would be nice to add why we use this utility package to COLLABORATOR_GUIDE

@@ -61,7 +61,7 @@
"@vercel/otel": "~1.10.0",
"@vercel/speed-insights": "~1.1.0",
"autoprefixer": "~10.4.20",
"classnames": "~2.5.1",
"clsx": "^2.1.1",
Copy link
Member

Choose a reason for hiding this comment

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

Suggested change
"clsx": "^2.1.1",
"clsx": "~2.1.1",

IMO we should keep ~; https://github.com/nodejs/nodejs.org/blob/main/DEPENDENCY_PINNING.md?plain=1#L23

@bmuenzenmeyer
Copy link
Collaborator

I'm ambivalent about this change unless there is appreciable:

  • difference in license: both MIT
  • API benefit - identical enough
  • size difference - negligible
  • security - neither have a policy in place

@RedYetiDev
Copy link
Member

I feel like if I personally had a choice, I would choose classnames, as:

  1. It's releases are certified by Github Actions (more secure)
  2. It's relied on by 4x the dependencies (44,000 vs 11,000)
  3. It has double the stars (17k vs 8k)

but those arguments aren't very persuasive, as 8k stars is still a lot, ditto for deps.

@ovflowd
Copy link
Member

ovflowd commented Nov 20, 2024

I feel like if I personally had a choice, I would choose classnames, as:

  1. It's releases are certified by Github Actions (more secure)
  2. It's relied on by 4x the dependencies (44,000 vs 11,000)
  3. It has double the stars (17k vs 8k)

but those arguments aren't very persuasive, as 8k stars is still a lot, ditto for deps.

You mean classnames is used by more people?

Copy link

github-actions bot commented Nov 20, 2024

Lighthouse Results

URL Performance Accessibility Best Practices SEO Report
/en 🟢 99 🟢 100 🟢 100 🟢 91 🔗
/en/about 🟢 99 🟢 100 🟢 100 🟢 91 🔗
/en/about/previous-releases 🟢 100 🟢 100 🟢 100 🟢 92 🔗
/en/download 🟢 96 🟢 100 🟢 100 🟢 91 🔗
/en/blog 🟢 100 🟢 100 🟢 96 🟢 92 🔗

Copy link

Unit Test Coverage Report

Lines Statements Branches Functions
Coverage: 92%
90.66% (631/696) 72.58% (188/259) 94.48% (120/127)

Unit Test Report

Tests Skipped Failures Errors Time
137 0 💤 0 ❌ 0 🔥 5.367s ⏱️

@RedYetiDev
Copy link
Member

You mean classnames is used by more people?

Yes.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants