Is there a good guide to using Kotlin WASM to gene...
# webassembly
d
Is there a good guide to using Kotlin WASM to generate an interoperable blob that can be loaded into an existing project/page. The guide would cover the topics of: • Project setup (IntelliJ/Gradle), walk around the folders/parts of the project • Project output (for example webjar or META-INF/resources or ZIP encapsulated outputs) • Options on testing (it needs to assume the WASM is not the entire app, the WASM bit needs to be considered a very minor component of a larger working project) ◦ Externally driving the WASM blob via the external interfaces ◦ Driving the blob in web specific ways • How to consume the WASM in a static web project ◦ Which artifacts are needed ◦ Page reload lifecycles/WASM ◦ Usual browser support concerns, feature matrix ◦ Usual links to interop matters and food for thought This would not be using any multiplatform (and would be targetting use of Kotlin WASM as an incremental addition to a legacy web project, or as a module that can be deployed with ZIP and a pasted JS code snippet into another project) I pick the static web project as a target (instead of WAR, microservice framework of choice), as it would be expected the reader can convert or iterate the information to suit a more dynamic server side consuming project I am aware some of these items are covered in blogs/documentation/areas like multiplatform starter example projects, what is not clear is how to remove the multiplatform bit, or if it is too early in the Kotlin WASM support to expect to be able to do that because the focus of development has been elsewhere.
👀 2
So in working towards some answer here, the github project https://github.com/Kotlin/kotlin-wasm-examples.git seems a reasonable starting point, the "browser-example" being project seems the closest area. Now this project when build produces:
Copy code
[browser-example]$ find build/libs/ build/dist/
build/libs/
build/libs/kotlin-wasm-browser-example-metadata-1.0-SNAPSHOT.jar
build/libs/kotlin-wasm-browser-example-wasm-js-1.0-SNAPSHOT.klib
build/dist/
build/dist/wasmJs
build/dist/wasmJs/productionExecutable
build/dist/wasmJs/productionExecutable/kotlin-wasm-browser-example.js
build/dist/wasmJs/productionExecutable/index.html
build/dist/wasmJs/productionExecutable/kotlin-wasm-browser-example.js.map
build/dist/wasmJs/productionExecutable/kotlin-wasm-browser-example-wasm-js.wasm
It is not clear what purpose the *.klib has (maybe it is control information to allow composure of multiple project in some interoperable way) It is not clear why the only JAR output is basically EMPTY
Copy code
$ unzip -lv build/libs/kotlin-wasm-browser-example-metadata-1.0-SNAPSHOT.jar 
Archive:  build/libs/kotlin-wasm-browser-example-metadata-1.0-SNAPSHOT.jar
 Length   Method    Size  Cmpr    Date    Time   CRC-32   Name
--------  ------  ------- ---- ---------- ----- --------  ----
       0  Defl:N        2   0% 02-01-1980 00:00 00000000  META-INF/
      25  Defl:N       27  -8% 02-01-1980 00:00 ee027fb2  META-INF/MANIFEST.MF
     558  Defl:N      241  57% 02-01-1980 00:00 b2207399  META-INF/kotlin-project-structure-metadata.json
--------          -------  ---                            -------
     583              270  54%                            3 files
There is no sign of anything that is exported that is consumable using any standard mechanism that exists in the browser space (webjar, META-INF/resources, dist.zip, npm package.json skeleton project) There is no example of importing something from the NPM/CJS/EMCAScript modules spaces (and consuming it from kotlin code) There is no example of exporting some kind of interface into NPM/CJS/EMCAScript modules spaces (and consuming kotlin from nodejs code)
No example of how to manages/access resources that maybe bundled with the kotlin wasm gradle project, in the example "index.html" exists but I kind of mean other file resources No example concerning the differences with why
src/commonMain
and
src/wasmJsMain
exist, demonstrating their respective design traits Not a single example of a test case using
src/commonTest
and/or
src/wasmJsTest