最近Jetpack Composeをデスクトップに移植したJetBrainsは、Jetpack Compose for Webのテクノロジープレビュー版をリリースした。Kotlin開発者は、間もなくクロスプラットフォーム開発（Android、macOS、Windows、Linux、Web、ただしiOSは除く）にJetpack Composeを使用できるようになるかもしれない。
JetBrainsは、新しいテクノロジーのプレビューを次のように要約した。
Jetpack Compose for Webは、Kotlin Multiplatform上で機能する。つまり、Jetpack ComposeをUIフレームワークとして使用して、Android、デスクトップ、Webアプリケーションをすべて同じプロジェクト内で開発できる。Kotlin Multiplatformを使用すると、プラットフォームに依存しないコードとビジネスロジックなどの機能を共通のコードで共有しながら、Android、デスクトップJVM、JavaScriptエコシステムのプラットフォーム固有の機能を実装して使用できる。
リリースされたテクノロジープレビュー版には、ブラウザーのDOM APIをミラーリングするDOM APIが含まれている。
fun main() {
renderComposable("root") {
var platform by remember { mutableStateOf("a platform") }
P {
Text("Welcome to Compose for $platform! ")
Button(attrs = { onClick { platform = "Web" } }) {
Text("...for what?")
}
}
A("https://www.jetbrains.com/lp/compose-web") {
Text("Learn more!")
}
}
}
前記のコードは、HTMLタグ（P、Button、A）をミラーリングする構造（<p>、button、<a>）を含むWebのタイプセーフなドメイン固有言語のComposeを示している。このコードは、ボタン付きの簡単なユーザーインターフェイスを実装している。ユーザーがボタンをクリックすると、可変変数プラットフォームが更新され、変数の値に依存するテキストコンテンツが画面上で自動的に更新される。
(出典: JetBrainsブログ投稿)
プレビュー版のDOM APIには、スタイルシート用のタイプセーフDSLが付属している。これによってCSSルールを表現したり、アプリケーションの状態に基づいてスタイルを変更したりできる。
技術プレビュー版には追加で、Jetpack Composeウィジェット（列、行、スライダーなど）のWeb実装が含まれている。プレビュー版のプレアルファ性を考え、JetBrainsは次のように警告している。
[Webウィジェット]は、他のターゲットにあるインターフェースの小さなサブセットのみを実装しています。他のJetpack Composeターゲットで使用されているキャンバスベースの実装の動作を近づけようとしています。
[…]これらのタイプの統合ウィジェットで実験して、それらの実現可能性をより理解しようとしています。
馴染みのあるJetpack ComposeウィジェットのWeb実装は、ネイティブまたはモバイルプラットフォームを専門としていて、関連する複雑さ（ビルド、ツール）を含む新しいスキルセットを学びたくない開発者に訴求する可能性がある。適切な例として、Androidの観点から見たCSSレイアウトの明白な複雑さである。
Compose for Desktopはアルファ版で、Compose for Webはプレアルファ版である。一方で、それらは、JetBrainsがクロスプラットフォーム開発サポートへのトレンドに乗っていることを示している。Googleは最近、Flutter 2がWeb向けに本番環境に対応していることを発表した。同様に、MicrosoftはReact Native Windowsを維持している。これは、ネイティブWindows10アプリケーションを構築するためのフレームワークである。
Jetpack Compose for Webの使用を開始する手順は、GitHubにある。