Embla-carousel: Question: Is this package side effect free?

[wopian]

I found this on Reddit and saw it exports as an EcmaScript Module, but doesn't have a sideEffects property in package.json.

Details on the sideEffects property: https://webpack.js.org/guides/tree-shaking/#mark-the-file-as-side-effect-free

_It's a link to the Webpack guides, but it's the most in-depth explanation on sideEffects with examples that applies to Javascript itself and other bundlers used by consumers._

[davidcetinkaya]

Hello James @wopian,
Thank you for your question. I'll take a look at it and get back to you when I have something.

Kindly,
David

[davidcetinkaya]

Hi again James @wopian,

Please forgive me if I'm misunderstanding this question after speed reading the docs 😊, but Embla Carousel should be tree shakable, according to Bundlephobia:

So to help Webpack we should add the sideEffects: false property to package.json right? Do you have any further thoughts about this, like if there are other aspects of this that I may have missed?

Best,
David

[wopian]

@davidcetinkaya sideEffects is kind of a short circuit for tree-shaking. Bundlers will check the property instead of evaluating the code (much slower and less accurate) to check if there are no side effects when the property is not present, before they will drop the unused code from the consumer's bundle.

In the bundlephobia example, it wasn't able to analyse the exports due to this property not being present.

As bundlephobia says it's tree-shakeable (via evaluation) it's likely safe to add sideEffects: false, but I havent read the source code to verify.

[davidcetinkaya]

Hi again @wopian,

Thank you for the explanation, it was clear and concise and better than the Webpack explanation 😉. Feel free to submit a PR adding this to package.json after analyzing the code if you want to contribute. Otherwise I'll dig into this as soon as possible.

[dipiash]

Hello. I have just investigated this question with bundle analyzer - checked library size after app build with everything examples. Size it not depends if exist sideEffects option or not.

[davidcetinkaya]

Hello @wopian and @dipiash,

Yesterday I used this package to analyze Embla Carousel and the vanilla-js package passed but the react package failed on the variable that stores a bool indicating if the window object is present.

Thank you for the PR @wopian. I'll take a look at it soon 👍.

Best
David

[davidcetinkaya]

Released with v3.0.28 🎉 .