Performance issue on wasm with large (2MB) images

[oblakr24]

Describe the bug
Using a standard AsyncImage with a string url, when the image itself is larger (i.e. more than 2MB), there is a very significant stutter while the image is rendered.
It happens when the image is already loaded or in cache, every time it enters composition.
Does not happen on other platforms (Android, iOS, desktop JVM).
Happens on Chrome, Safari, Firefox.

To Reproduce

@Composable
fun imageLoader(): ImageLoader {
    val ctx = LocalPlatformContext.current
    return remember {
        val defaultMemCache = MemoryCache.Builder()
            .maxSizePercent(ctx)
            .build()    

        ImageLoader(ctx).newBuilder()
            .memoryCache(defaultMemCache)
            .crossfade(true)
            .logger(
                DebugLogger()
            ).build()
    }
}

@Composable
fun UrlImage(url: String, modifier: Modifier = Modifier, contentScale: ContentScale = ContentScale.Inside) {
    AsyncImage(
        model = url,
        contentDescription = null,
        imageLoader = loader,
        modifier = modifier,
        contentScale = contentScale,
    )
}

Version
3.0.4

[colinrtwhite]

@oblakr24 Does the issue also occur if you render the image without Coil (i.e. from Compose resources)?

[colinrtwhite]

I see the same lag in the WASM sample, however if I display the same images without Coil I also see the same lag when drawing the image. I think will likely need to be optimized inside CMP/Skiko.

[oblakr24]

@colinrtwhite
To answer the question - yes, same stutter when loading the image from disk.
I still think this is an issue, where should it be submitted then? I think this is quite significant for web projects.

The wasm sample above also stutters heavily on a top-spec M3 Max MBP, so I think this is definitely something to be tracked in the right place.

[mipastgt]

I'd report it without Coil on Jetbrains Youtrack for Compose and see what happens.

[colinrtwhite]

@oblakr24 Yep your best bet it to file an issue with Compose Multiplatform or likely the Skiko issue tracker. Skiko is the library that Coil and Compose Multiplatform use to render the images.

[oblakr24]

Reported on Skiko issue tracker:
SKIKO-998 Performance issue when rendering larger images (2MB) on WASM