My fairly small web-app using compose html warns: ...

# compose-web

[Luca]

My fairly small web-app using compose html warns:

asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).
This can impact web performance.
Assets: 
  appWeb.js (1.76 MiB)
entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance.
Entrypoints:
  main (1.76 MiB)
      appWeb.js
webpack performance recommendations: 
You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.
For more info visit <https://webpack.js.org/guides/code-splitting/>
webpack 5.91.0 compiled with 3 warnings in 18281 ms

While I can hide the message with:

config.performance = {
    hints: false
}

Is there anything I can do get it smaller on a production build?

I tried:

config.optimization = {
    splitChunks: {
        chunks: 'all',
    },
};

But the site doesn’t load after that

[Konstantin Tskhovrebov]

short answer is NO.
Kotlin stdlib + coroutines + smth else and your app bundle is bigger than the recommended size.
kotlin tolling applies almost all possible optimizations here in a production build.
cc @Oleksandr Karpovich [JB]

[Konstantin Tskhovrebov]

and common advice: use the latest versions everywhere because we continuously make optimisations on all levels

[Oleksandr Karpovich [JB]]

is it (1.76MiB) for a production build?

[Luca]

Yup for a production build

[Oleksandr Karpovich [JB]]

Btw, have you tried k/wasm target by chance? wondering how it compares to k/js

[Luca]

But yeah, I have coroutines, compose-html, koin, ktor, voyager, and cryptography-kotlin w/ tailwind and a few screens, that’s about it

[Luca]

I've been playing with wasm

[Luca]

It's definitely smaller

[Luca]

But I need safari support. So can't use it yet really

[Luca]

And yeah everything is newest, on compose 1.6.2 w/ latest kotlin 2.0 beta

[Oleksandr Karpovich [JB]]

there is kotlin 2.0.0-RC1

[Luca]

Oh wait, I meant 2.0.0-RC1.

[Luca]

would enabling kotlin.js.ir.output.granularity=per-file theoretically help? I think I read that somewhere on here… I was trying but gave up because I couldn’t get tailwind to work with useEsModules

[Oleksandr Karpovich [JB]]

is there a per-file option?
as I remember there is 'per-module', which is enabled by default

[Luca]

https://youtrack.jetbrains.com/issue/KT-6168/Ability-to-generate-one-JS-file-for-each-Kotlin-source-file

[Luca]

yeah there’s an option. It was broken with kotlinx.serialization last time I tried pre-2.0 though

[Carter]

New in Kotlin 2.0, this will also help reduce JS size: https://kotlinlang.org/docs/js-project-setup.html#support-for-es2015-features

Note that Ktor isn’t compatible with this yet though.

[Luca]

@Carter oh cool. Thanks for the tip. I’m guessing ktor needs to be updated to 2.0? https://github.com/ktorio/ktor/pull/4054

[Carter]

There’s some other specific Ktor bug for this

[Carter]

On mobile so I can’t track it down right now

[Luca]

Brought it down from 1.7mb to 1.6mb so helped a little. But yeah ktor isn’t working. This is what I get from ktor when I enable it:
https://youtrack.jetbrains.com/issue/KTOR-6882/JS-browser-Error-HttpClientCall-expected-on-HTTP-request-when-targeting-es2015