build(performance): rolldown-vite integration

[matthewgallo]

Closes #7953

This PR introduces rolldown-vite into our storybook build configuration. The initial benchmark comparison between build times looks like a solid improvement:

Performance comparison

Build times for @carbon/ibm-products

Default vite config (v7)	rolldown-vite	Default vite config (v7) local machine	rolldown-vite local machine
~1 minute 50 seconds	~1 minute 30 seconds	~32.25 seconds	~23.5 seconds

~20% decrease in total build times (in CI environment)

What did you change?

• Renamed all *.js files containing jsx syntax to *.jsx
• Added *.jsx file extension to any import of a file that hasn't migrated to *.tsx yet
• Removed unsupported css syntax @property --some-property { initial-value: 1px }, lightningcss which is used by rolldown-vite is not able to process this syntax Updated @property { syntax } to length

How did you test and verify your work?

Ran storybook locally and successfully built ibm-products locally

PR Checklist

As the author of this PR, before marking ready for review, confirm you:

• Reviewed every line of the diff
• Updated documentation and storybook examples
• Wrote passing tests that cover this change
• Addressed any impact on accessibility (a11y)
• Tested for cross-browser consistency
• Validated that this code is ready for review and status checks should pass

More details can be found in the pull request section of
our contributing docs.

[netlify]

✅ Deploy Preview for ibm-products-web-components ready!

Name	Link
🔨 Latest commit	083f196
🔍 Latest deploy log	https://app.netlify.com/projects/ibm-products-web-components/deploys/68af1a4fb703e4000806ae73
😎 Deploy Preview	https://deploy-preview-7956--ibm-products-web-components.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[netlify]

✅ Deploy Preview for carbon-for-ibm-products ready!

Name	Link
🔨 Latest commit	083f196
🔍 Latest deploy log	https://app.netlify.com/projects/carbon-for-ibm-products/deploys/68af1a4f8f7f6b00083bbf41
😎 Deploy Preview	https://deploy-preview-7956--carbon-for-ibm-products.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[codecov]

Codecov Report

❌ Patch coverage is 17.94872% with 32 lines in your changes missing coverage. Please review.
✅ Project coverage is 85.62%. Comparing base (1c4fa62) to head (083f196).
⚠️ Report is 228 commits behind head on main.

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #7956      +/-   ##
==========================================
+ Coverage   79.38%   85.62%   +6.24%     
==========================================
  Files         474      354     -120     
  Lines       20340    16868    -3472     
  Branches     5006     3986    -1020     
==========================================
- Hits        16146    14444    -1702     
+ Misses       4194     2424    -1770     

Components	Coverage Δ
ibm-products	84.39% <80.53%> (+3.81%)	⬆️
ibm-products-web-components	87.51% <67.56%> (+10.79%)	⬆️

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[TheAlexLichter]

Hey 👋🏻

The perf improvements seem rather low, which is strange 🤔

You also want to make sure to enable native plugins for improved performance in the Vite configs.

I suppose beyond the storybook time (where there is a lot of things to improve in storybook itself by replacing rollup or esbuild), replacing the existing build script with either tsdown or plain rolldown could be worth it too (but that is another PR of course) - and also get rid of the slow babel parts!

[matthewgallo]

Hey @TheAlexLichter, thanks for the insights, super helpful! I'll take a look at enableNativePlugin. I wasn't entirely sure what to expect in terms of overall performance improvements, maybe enableNativePlugin will help.

And yeah, I definitely agree that replacing the actual project build script is something we'll want to look at next.

[TheAlexLichter]

@matthewgallo In general, build perf should be way better - but given that there are a lot of optimizations that can be (and have to be) done on the Storybook side, the difference is rather small right now. We are looking into PRs and issues to improve the situation there.

The builds script migration should speed up things way more for that part.

[anamikaanu96]

Hey @matthewgallo, Can you resolve the merge conflict?

[matthewgallo]

This PR got quite stale, going to open a new one.