Grsmto / simplebar

Custom scrollbars vanilla javascript library with native scroll, done simple, lightweight, easy to use and cross-browser.

Home Page:http://grsmto.github.io/simplebar/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Improve bundle size

TheHolyWaffle opened this issue · comments

simplebar is lovely, but it's big. Incredibly big! https://bundlephobia.com/result?p=simplebar@5.0.2

I'd like to request to shave some unnecessary bloat from this package if possible:

  • core-js is not needed in normal circumstances
  • resize-observer-polyfill should not be included by default, it's up to the end developer to include polyfills where needed

Hi,
Thanks for your report,

Unfortunately I believe the unecessary bloat you are mentionning is not:

  • core-js is needed because we support certain browsers by default and babel-preset-env is defining what ES features need to be polyfilled thanks to core-js based on our browserlist config
  • resize-observer-polyfill is included because the whole point of SimpleBar is to provide a solution for crossbrowser support, so if it doesn't support at least every modern browsers, it has absolutely no purpose and you could just customise scrollbars with CSS directly (on Chrome & Firefox).

However I agree that we could not include it in the bundle and just have it as an optional dependency (npm install simplebar resize-observer-polyfill). But I'm worried people skip it and report issues for things to not work as intended.

That would be a major release bump anyway as it's a breaking change. What do you think?

Also I might close this as it's a duplicate of #372

The UMD bundle is huge, I'm not sure why. That's what bundlephobia is parsing I suppose.
However the ESM one should be much smaller and if you use Webpack or a module bundler (hopefully most of the people using this lib), it should fine.

@Grsmto Bundlephobie is actually correct here. The simplebar.esm.js bundle is already at 34kb, and that doesn't include the core-js imports yet. In total it adds up to being 60kb uncompressed.

For my end users, I'd like to only target modern browsers. So core-js inherently duplicates the size. And as far as I know, firefox still lacks some proper scrollbar customization these days.

As for the resizer polyfill, I don't think we should treat developers as donkeys :) With some proper explanation on readme they will know about this caveat.

I don't think we should treat developers as donkeys :)

It's not about treating people as donkeys but as it's not currently working this way, people might upgrade to the latest version without necesarily reading the README again...It's a tricky one.

For sure, such a change would be breaking and and thus results in an increment of the MAJOR version of the package.

I agree. Letting consumers polyfill whatever they need, and removing resize-observer-polyfill from simplebar in a major release, would be the right call here.

Is there any news about this? Using 2.3.3 and it's still pulling in the core-js deps

Hello @Grsmto any update on this?

I think the README needs to be updated. 6kb looks like the unbundled size of the main JS file, bundled, the ES file is 26kb gzipped

Yeah the README is really out of date about this. This issue is major and I worked on solving it in v6 but never had time to actually release it.
It would be great to release v6 but I need some time to work on it. In the meanwhile I will update the README.