Make sure the output can be treeshaked #259
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Deploying compound-web with
|
| Latest commit: |
01d435d
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://651be320.compound-web.pages.dev |
| Branch Preview URL: | https://quenting-treeshakable.compound-web.pages.dev |
sandhose
commented
Oct 7, 2024
| @@ -5,10 +5,11 @@ | |||
| "type": "module", | |||
| "main": "./dist/compound-web.js", | |||
| "module": "./dist/compound-web.js", | |||
| "sideEffects": false, | |||
There was a problem hiding this comment.
This tells downstream bundlers that there is no side-effect importing compound, which lets them actually treeshake stuff out
Comment on lines
+11
to
+12
| "require": "./dist/index.cjs", | ||
| "import": "./dist/index.js", |
There was a problem hiding this comment.
Because we changed the fileName pattern, the output files match the input files structure in src/
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Fixes element-hq/compound#318
This tells rollup/vite to preserve the file structure of the source directory instead of bundling everything into a single file.
This means that as a downstream package, you'll only import what you need, and the rest will be tree-shaken for you.
Compound itself is rather small, but it has a few dependencies that only a handful of components use.
This means that if you only import a few components, it will be much smaller as it won't include
@radix-ui/*and@floating-ui/*stuff.Here is the diff on a quick hello-world project bundle analysis, which just imports a
Button:Before
Total gzipped size: 89.15kB
After
Total gzipped size: 46.60kB
In MAS, it means it can code-split way better, putting a lot of compound components out of the main bundle: