Minimizing JS with kotlin-frontend plugin

JavaScript
1

Hi,

I’m using the kotlin-frontend-plugin, and trying to minimize the final javascript. I got a smaller bundle when I set mode = "production"…

webpackBundle {
    ...
    mode = "production"
}

But I’m not sure if there is more minimization possible. The frontend plugin page mentions “additional scripts” like minify.js but I don’t know what that script is or where to get it. The docs for webpack say that it will minify your code already in production mode.

My bundle JS file is now 638KB. I’m using kotlinx serialization, coroutines, html, and of course the standard lib. Some code appears to be minimized, and some - I’m not sure.

Looks minified: ...function ee(){ne=this,this.ref_0=new wr}...

Not so much: ...prototype.decodeSerializableValue_w63s0f$=...

Are people doing something else to get more minimization?

2

Hi

I use the kotlin-dce-js https://kotlinlang.org/docs/reference/javascript-dce.html Gradle plugin together with closure-webpack-plugin on webpack. Works perfectly for me.

You can find one of my projects with this configuration on agon-application · master · Michel Werren / agon · GitLab

Hope it help

1 Like
3

I’m also using that kotlin-dce-js plugin. How big are your final JS bundles? Maybe it’s hard to compare since it depends what our apps are using, but I’m curious - are you getting better than 600K?

thanks,
Rob

4

KVision’s Hello World app bundle is 450K (with dce + uglifyjs-webpack-plugin). It uses stdlib and serialization but no coroutines. So your 640K sounds alright.

1 Like
5

My final bundle is around 1,2 MB. But with Coroutines, React, MomentJS and Material components. So i am think it’s okay, as with deflate 330KB get transfered.