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

Proposal: make a minimum build for custom elements. #5464

Open
bmomberger-bitovi opened this issue Jan 27, 2020 · 4 comments
Open

Proposal: make a minimum build for custom elements. #5464

bmomberger-bitovi opened this issue Jan 27, 2020 · 4 comments
Labels

Comments

@bmomberger-bitovi
Copy link
Contributor

The smallest CanJS build is core.mjs, which includes model data, query logic, routing, and fixtures in addition to the web components-supporting parts. It's slightly over 100KB, minified + gzipped.

By contrast, Slim.js is under 4KB and hybrids is under 7KB (minified + gzipped). While we have better features than either of those, we are also up against React which is 41KB total for React and ReactDOM.

The reason why I bring this up is that if we want users to try our features for components, it's easier to make the case if they can see that adding our libraries will not incur much extra overhead (easier to show it with a file size than tell them how their production bundle might size up). It may be in our best interest, then, to give users who just want to do web components a small subset of our features in a mini rollup: StacheElement, types, bindings, Observables, and the infrastructure that would support them.

@justinbmeyer
Copy link
Contributor

I think there’s another issue about this

@bmomberger-bitovi
Copy link
Contributor Author

bmomberger-bitovi commented Jun 22, 2020

Preliminary tests show that the savings in size is 35%. Exporting:
can-observable-object
can-observable-array
can-stache
can-stache-element
can-stache-bindings
can-dom-data
can-dom-events
{ MaybeBoolean, MaybeDate, MaybeNumber, MaybeString } from can-data-types
can-namespace
can-reflect
can-reflect-dependencies
can-reflect-promise
can-type

Gives a minified, gzipped file 68.8KB in size, about 65% of the size of core.mjs. It seems infeasible, then, to make CanJS for custom elements small enough to be an add-on library in another project.

@justinbmeyer
Copy link
Contributor

Can you break down the weight? I assume most is in can-stache.

@bmomberger-bitovi
Copy link
Contributor Author

Taking out stache, stache-element, and stache-bindings yields a bundle 27.5KB in size, so taken together the stache bits are more than half of the weight. It wouldn't be easy to un-bundle the bundle for a more complete breakdown.

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

No branches or pull requests

3 participants