Bundle sizes of compose-web are very concerning. m...
# compose-web
b
Bundle sizes of compose-web are very concerning. my mock sandbox app (that doesn't do anything really..) comes up as 7+MB as production executable. I'm attaching the output if anyone's interested. The source is here. Development bundle is going at 26MB.
🤨 1
m
That's weird, my production executable for my project (a very simple one, but has multiple screens) that includes ktor (which is a big pain when including in a Kotlin/JS project due to its size) only uses ~1.7MB
By the way, one of the reasons that JS seems incredibly big, is because you are including FontAwesome's icon SVGs in your code, so the SVGs are embedded in the JS file
👍 1
b
Ah, that must be it. And I'm guessing that's not getting treeshaken by webpack, is it?
m
If it is in the production executable, then I guess they aren't 😛
😁 1
If you want to take a look, search for
var p={
and you will find all the references related to the FontAwesome stuff It is a key -> value map containing the FontAwesome icon name -> SVG data
b
After switching to explicit SVGs from FA, js file size dropped to 3.8MB, which is still alarming, but definitelly an improvement.
👀 1
c
Using TailwindCSS+React+Ktor, my project is ~2MB, so ~3.5MB for a Compose app sounds believable
It's a shame that Kotlin JS takes that much space, but hopefully that'll improve in the future
b
I suspect MDC css contributes to most of the bloat
c
It could be interesting to setup PurgeCSS then
b
Is it like treeshaking, but for css? What does it take as an entrypoint?
c
Yep pretty much. It takes your code (where you use CSS classes) and removes all classes that are unused from your CSS declaration. I haven't used it with Compose yet, but it should be doable with some Webpack config. https://purgecss.com/
It's not perfect though and has some big limitations, that might make it unusable for Compose. I don't know.
l
26MB: That would have taken almost 4 minutes to download with my 1Mbps download home internet connection (ADSL 2+) 4-5 years ago 😬