A la carte components -> reduce code size

[skbach]

Is there any way to only include certain components from the library, or is it all or nothing?

For example, in material-ui, you can

import Button from 'material-ui/Button';

instead of

import { Button } from 'material-ui';

Will I need to build my own version using npm and include it manually to get this behavior?

[njordhov]

Alternatively eliminate dead code by compiling with :optimizations :advanced

[skbach]

:optimzations :advanced does very little to help. Still results in a 1.4MB file before gzip, which is insanely huge, considering the rest of my stack (Clojurescript, React, Rum, Datascript) comes out to 1/6 that size, and those libraries are monsters as well. Icons and Components I'm not using remain in the file, probably because the library isn't Closure module aware?? Hence my idea of using rollup/webpack manually and then just including a script tag and externs.

[madvas]

Solution for this is a new cljs feature :npm-deps, which allows to include npm packages directly and enables dead code elimination. But it's in first stages, still bit buggy, can't compile everything. I've been trying to compile material-ui, almost all good, but there few errors, that won't enable dead code elimination. I'm in contact with Antonio and working to resolve this.

Read more here:
https://anmonteiro.com/2017/03/requiring-node-js-modules-from-clojurescript-namespaces/