Hey, general question about the intent of compose-...

# compose-web

[Paul]

Hey, general question about the intent of compose-web and compose-desktop. When I first read about it, I though it would be a set of tools that would allow me to share UI code across web and desktop targets. But it looks like the web and desktop are quite divergent, and only the very base concepts are shared between. I even noticed that the web widgets (which seemed to be a step in that direction) was deprecated.

Is it the intent of these projects to remain divergent, or will they ever converge?

[Paul]

I guess as I scroll up and read more, I see that this is intentional and that maybe in the future there may be some shared UI components. Its a bit of a bummer as I really like the composable concepts, but I have never liked web based layouts. I was really hoping for a killer solution to be able to create both web targets and desktop targets with one simple codebase. Bummer.

[ribesg]

You’re just far too early but it seems to be the goal now: common UI that renders the same on all platforms with the same code, while still allowing “real native” UI (DOM on Web instead of a canvas). Jetpack Compose (for Android) is basically the part that seems ready for production, Compose Desktop looks alpha, and Compose Web is just a useless toy right now

[Michael Paus]

For the record. The new direction was just recently announced here and I am quite happy with that decision:
https://kotlinlang.slack.com/archives/C01F2HV7868/p1640344426333700

[David Herman]

Just an FYI that depending on your use-case, it may be impossible to ever have the "share UI code" across web and desktop. If you're literally just making a web app that doesn't really take advantage of HTML / CSS concepts, then you're fine (and honestly many solutions might fit this space), but if you want things like hyperlinks, robot crawling, and the ability to debug your app using browser dev tools, it gets tricky. I wrote a bit more about that in my project's README: https://github.com/varabyte/kobweb#what-about-multiplatform-widgets

[Paul]

Not share 100% of course. I realize that there are significant differences between the capabilities of the platforms, but that is exactly what Kotlin with its "common", "desktop", "native" and "web" codebases excels at. The ability to abstract common things and lift them up to the appropriate level, while specialties are handled in the platform specific code.

I was just hoping for one more layer of abstraction where the primitive building blocks where shared, like Column, Row, Text, Button. But alas, I'll look else ware.

[David Herman]

Yes I hoped for something like that too at first. But it's not possible here for various fundamental reasons (except by taking over the whole rendering pipeline and rendering to a web canvas like they're doing)

[David Herman]

That said, if you look at my project I do have Row, Column, Text, and Button

[David Herman]

The API is not "common" though, I had to diverge from Jetpack Compose. So actually it won't work for you if you want to share with desktop and I don't think it ever can while also being compatible with html / css.

[Paul]

I'll check it out. Thanks. I also found another project going the web canvas route called Doodle. But it looks still pretty early days, and not a huge community yet. https://github.com/nacular/doodle

[David Herman]

Yeah if you want a canvas solution probably waiting for JB to implement it is your best bet I'd guess. I gave up on that approach for what I need though and am embracing html / css (but as I concluded in my readme there's room for both solutions)

[Michael Paus]

@David Herman Obviously any judgement on this depends very much on where you come from and what your concrete goals are. I, for example, can only agree with your last statement. “there’s room for both solutions”

[David Herman]

Yes, the tools should be chosen depending on what your goals are

[David Herman]

I'm just saying originally I wanted a common API that could be shared with Jetpack Compose AND target the html / css DOM and I've come to the conclusion that it can't

[David Herman]

I'm guessing a majority of users will be fine with the canvas solution

[Paul]

Yeah, seeing blog headlines like "Compose Multiplatform Goes Alpha, Unifying Desktop, Web, and Android UIs" maybe oversold the platform a bit. Now that I understand its current limitations, I'll wait patiently, and/or look elseware. 🙂

[Colton Idle]

Most of the confusion comes from the fact that compose is multiple things, and the UI part (arguably) should be called something else.

https://jakewharton.com/a-jetpack-compose-by-any-other-name/

[corneil]

The https://github.com/mpetuska/kmdc project should provide a sophisticated set of HTML WebComponents.

[ribesg]

Yeah I keep seeing “html/css” and feel like it’s usually sold as an old thing compared to React/Angular and all that, but Web Components are actually a modern and viable solution that you can use in Kotlin/JS “just fine”

[Nick]

Doodle actually renders to the DOM when used for web. But this is an internal detail and it can easily target Canvas for web as well. This means apps get the benefits of html (accessibility, link behavior, SEO, etc.) while using a canvas abstraction and sharing logic with desktop. Desktop support is definitely still early, but apps already share the same components for both platforms, and this remains the long term goal. You can see this with the tutorial apps: https://github.com/nacular/doodle-tutorials. They are all written almost entirely in common code. Yet, they run on both platforms.