Here some thoughts about Compose-Web. In my opinion it’s irrelevant if it’s DOM-based or Skia-based. What I believe the goals should be: • the smallest file size • SEO-friendly

Hey folks! During one of the JetBrains Hackathons we tried to adapt Jetpack Compose for the JavaScript world. The main idea was to allow you to share code/expertise between platforms and to build web applications in pure Kotlin. And we would like to collect your feedback before continuing our experiments with this technology. Please take a look at the compose-for-web-demos and join the #compose-web channel. Note: Please read the description and disclaimer carefully.

This repository contains only the sources of the demo apps. Are the sources of the framework itself (compiler plugin, libraries) available somewhere?

Looks like above repo makes use of snapshot version of

multiplatform

plugin...is that definitely also needed to get this to work?

The disclaimer on the Github Page says: "and the JetBrains team doesn't have any plans to support or develop it", but at the bottom is written "P.S. JetBrains plans to continue experimenting with this technology and we are looking for UI Framework Developer". I find this a bit confusing

@bashor and @Dmitry Romanov [JB], did you guys literally add web support to compose within 48 hours (and had time to write 6 demos)? This is the real story here IMO. You're making me feel like a 0.1x programmer.

Could compose web be implemented without a virtual DOM? Because vdom is one of the reasons why I eschew frameworks like React. It makes development easier but produces slower, more memory intensive applications.

Good news, everyone! After couple of months of working on the compiler plugin, compose actually compiles and works in the browser! It is, obviously, only the beginning for the web version, as we don't have any proper API for building the DOM or anything else. Feel free to contribute/create something your own on top, if you want to! 😅 See the original tweet for the announcement and the repo links: https://twitter.com/shikasd_/status/1343350375248760832?s=20

@shikasd I got really sick and tired of React and thinging about other systems. I would like to try compose, but I have some reservations. I need to include external element-bound components like canvas. Is there a simple way to add it to compose-web. The second question is about compiler: do I still need to use unstable compiler version?

So is this actively being worked on?

I have a vested interest in making the compiler and runtime work on JS and native and have landed some CLs to ensure the runtime will work. Others have sent small changes to the compiler to enable JS. It should be pretty close to usable. I don't particularly care about Compose UI

Hi everyone! Where can I find the latest version of the compose compiler plugin to use for a test compose for web test project? Is it compatible with kotlinc 1.4.30? Also where can I find the compose runtime for js? Thanks for your help!

Please tell Google to update the code lab for jetpack compose https://developer.android.com/courses/pathways/compose It is not working now Because the code is old and there are many huge changes in the framework jetpack compose Google should update the code

Will canvas kit have any impact on this project https://skia.org/user/modules/canvaskit

Hi ! I had a naïve thought and I would love if someone could tell me about it. I get that Compose Web currently uses Skia to draw on a HTML canvas (do I make a mistake here ?) Some people (myself included) would prefer sticking to DOM elements for accessibility reasons etc. What about writing a Kotlin/React wrapper using Compose API ? Making

Box

render divs,

Column

render divs with

flex-direction: column

and so on. If it was possible, we could theoretically use Compose components in browser environnement, using the DOM right ? Obviously it cannot be so easy, but I would like to know why. I've never worked on Compose before so surely there's something misunderstood. Thanks for you answers 🙏

@shikasd (and others), I've been playing with your demo (https://github.com/ShikaSD/compose-browser-demo) a bit. My current plan for now is to build on it to integrate some MDC components (https://github.com/material-components/material-components-web) to build a small material layer (I don't need much: button, select, ...) and some base layout components (Row and Column using flex, Box and maybe Layout using absolute positioning). Could we extract/publish your prelude and runtime binaries as a temporary project so that we can work together ?

Hi everyone! I want to know how to do collapsing-toolbar layout in jetpack compose android

Jetbrains is working on Compose Web! https://schahen.github.io/compose-web-demos-showcase/ https://github.com/Schahen/compose-web-demos-showcase

This message was deleted.

Given this ^ awesome news, is there a way for me to start toying with compose-web? I'm rebuilding parts of an app I'm working on with jetbrains/jetpack compose and I'd love to enable js support even if it's unoptimal. I want it to include it early on so at least it gives me a hint on how to go around designing the common UI parts. I've already done that part with the non-ui layer (I can't wait for kotlinx-datetime to go a bit more stable <3) In the meantime I'm waiting for a js sample in this repo https://github.com/JetBrains/compose-jb/ very exciting stuff and kudos to everyone involved ❤️

Today we’re announcing a Technology Preview of Compose for Web – an experimental Kotlin UI framework for web programming! For details and information to get started, read the announcement blog post at https://blog.jetbrains.com/kotlin/2021/05/technology-preview-jetpack-compose-for-web/. We hope you’ll enjoy Compose for Web – and please do not forget to share your feedback!

Are you looking into isomorphic rendering? One of the things I couldn't get working (with my own Compose DOM implementation) was to render an initial tree on the server and resume it on the client without re-emitting the initial DOM tree. Maybe that initial re-render isn't terrible, but it'd be nice to skip it.

Does it support exposing DOM elements? Like in this issue. If it is I can start using it in our visualization projects

I love that you guys are experimenting with 2 separate APIs for compose web. Have you considered a canvas rendered API that can very accurately render the same widget across desktop, android and web? I’ve found I typically work on teams that create private websites behind an auth barrier, where SEO isn’t relevant. In a lot of these cases, I’d prefer a canvas rendering between Desktop, Mobile, and Web, where I had some level of confidence that there was consistency between the platforms. Have you guys considered providing a canvas solution?

Compose for web is only available with the JS IR compiler, which doesn’t support source-maps, right?

All the Compose Web samples seem to use

multiplatform

plugin......is that necessary or can you just have module containing compose web code with dependency then on a separate multiplatform module?

Trying out the "multiplatform widgets" I see that for the web they are in a different package than on desktop, e.g. org.jetbrains.compose.common.material.Button vs androidx.compose.material.Button. The function signatures are also not the same. IntelliJ isn't finding the source code, and I can't find it in https://github.com/jetbrains/compose-jb. Where can I find the source code to see what other widgets currently have an implementation?

What is the intended purpose of the jvm source set inside of web module? https://github.com/JetBrains/androidx/tree/compose-web-main/compose/web/src