# Pure Kotlin OPENRNDR compiling to JavaScript and native

**URL:** <https://openrndr.discourse.group/t/pure-kotlin-openrndr-compiling-to-javascript-and-native/200>\
**Category:** Feature requests\
**Created:** [February 8, 2021, 3:22pm UTC](https://openrndr.discourse.group/t/pure-kotlin-openrndr-compiling-to-javascript-and-native/200 "2021-02-08T15:22:57Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![kazik](https://yyz2.discourse-cdn.com/free1/user_avatar/openrndr.discourse.group/kazik/32/7_2.png) [@kazik](https://openrndr.discourse.group/u/kazik)\
**Post date:** [February 8, 2021, 3:22pm UTC](https://openrndr.discourse.group/t/pure-kotlin-openrndr-compiling-to-javascript-and-native/200/1 "2021-02-08T15:22:57Z")

</div>

I’ve been using some time recently to learn WebGL and cross platform development with Kotlin. Ultimately I want to be able to use OPENRNDR in the browser, and maybe as a native compiled code in the future. I learned that cross platform Kotlin libraries have to adhere to certain standards. For example there should be no dependency on standard Java libraries, so no `java.lang.Math`, `StrictMath`, no `Serializable`.

I made a small experiment to compile `openrndr-math` to JavaScript:

> **[morisil/openrndr-kotlinjs-test](https://github.com/morisil/openrndr-kotlinjs-test)**
>
> An experiment to compile at least part of the OPENRNDR libs to native JavaScript

It worked and I can actually already start doing some nice creative coding experiments just with `openrndr-math`. But I had to do some small modifications, and I was not sure how to solve some issues, so I commented out part of the code. I also moved to kotlin native serialization. Here is the commit with all the modifications:

> <https://github.com/morisil/openrndr-kotlinjs-test/commit/3dbdf51a4a57bf6579a14117789f3b0603cd1863>

The JavaScript output is around 5kB after advanced optimizations and dead code removal with google closure compiler:

> <https://gist.github.com/morisil/110463b6f632e17604b7b39bbc165720>

@edwin I would be interested in your opinion on how it can be pushed forward and if you think it’s realistic to change the code and packaging of some OPENRNDR modules to make them “Pure Kotlin” and cross platform?

---

<div class="post-metadata">

**Author:** ![edwin](https://avatars.discourse-cdn.com/v4/letter/e/73ab20/32.png) [@edwin](https://openrndr.discourse.group/u/edwin)\
**Post date:** [February 8, 2021, 7:38pm UTC](https://openrndr.discourse.group/t/pure-kotlin-openrndr-compiling-to-javascript-and-native/200/2 "2021-02-08T19:38:32Z")

</div>

I will get back to this in more detail later. I’d love to support your effort! I think this requires some serious rethinking/reworking of how OPENRNDR is organized. I expect this can be done progressively.

My gut feeling is that going for pure Kotlin is the way to go, but it may not always be entirely possible. I believe there are also ways to split up modules into `-common`, `-jvm` and `-js` parts.

---

<div class="post-metadata">

**Author:** ![kazik](https://yyz2.discourse-cdn.com/free1/user_avatar/openrndr.discourse.group/kazik/32/7_2.png) [@kazik](https://openrndr.discourse.group/u/kazik)\
**Post date:** [February 8, 2021, 9:10pm UTC](https://openrndr.discourse.group/t/pure-kotlin-openrndr-compiling-to-javascript-and-native/200/3 "2021-02-08T21:10:39Z")

</div>

Yes, it’s possible to do such a module split. If not for the actual code if there is no need for it, it might be worth somehow to do it for testing, to force running the same unit tests on all the platforms involved. I will research it further taking `openrndr-math` as a playground. I will also research to which extent `kotlinx.serialization` is a functional replacement for standard java serialization.

---

<div class="post-metadata">

**Author:** ![edwin](https://avatars.discourse-cdn.com/v4/letter/e/73ab20/32.png) [@edwin](https://openrndr.discourse.group/u/edwin)\
**Post date:** [February 8, 2021, 10:00pm UTC](https://openrndr.discourse.group/t/pure-kotlin-openrndr-compiling-to-javascript-and-native/200/4 "2021-02-08T22:00:14Z")

</div>

My biggest concern is `Buffer`, `ByteBuffer` etc. `kotlinx-io` seems a bit dead?

---

<div class="post-metadata">

**Author:** ![kazik](https://yyz2.discourse-cdn.com/free1/user_avatar/openrndr.discourse.group/kazik/32/7_2.png) [@kazik](https://openrndr.discourse.group/u/kazik)\
**Post date:** [February 11, 2021, 2:32pm UTC](https://openrndr.discourse.group/t/pure-kotlin-openrndr-compiling-to-javascript-and-native/200/5 "2021-02-11T14:32:33Z")

</div>

I updated the test project to make it a multiplatform library project:

> **[morisil/openrndr-kotlinjs-test](https://github.com/morisil/openrndr-kotlinjs-test)**
>
> An experiment to compile at least part of the OPENRNDR libs to native JavaScript

I will try to use it first a bit as a library, to see how much dependency management is changing with libraries defined this way, it seems that at least some ‘jvm’, ‘js’, etc, qualifier might need to be added, which would break down compatibility. I also want to see how to do proper unit testing. If nothing breaks, I can try to do pull request out of it as a first step in “multiplatform OPENRNDR” direction.

---

<div class="post-metadata">

**Author:** ![kazik](https://yyz2.discourse-cdn.com/free1/user_avatar/openrndr.discourse.group/kazik/32/7_2.png) [@kazik](https://openrndr.discourse.group/u/kazik)\
**Post date:** [March 27, 2021, 8:55am UTC](https://openrndr.discourse.group/t/pure-kotlin-openrndr-compiling-to-javascript-and-native/200/6 "2021-03-27T08:55:55Z")

</div>

Just to keep this thread up to date, the first example of this approach is already there.

Demos for JavaScript Kotlin + OPENRNDR in the browser:  
[OPENRNDR + Kotlin running in JavaScript](https://xemantic.github.io/openrndr-js/) (template project)  
[Algorithmic Botany - A Tree](https://xemantic.github.io/openrndr-js-tree/)

> **[morisil/openrndr](https://github.com/morisil/openrndr/tree/openrndrMathAsKotlinMultiplatformLib)**
>
> openrndrMathAsKotlinMultiplatformLib

> **[xemantic/openrndr-js](https://github.com/xemantic/openrndr-js)**
>
> OPENRNDR in web browser. Contribute to xemantic/openrndr-js development by creating an account on GitHub.

[https://github.com/xemantic/openrndr-tree](https://github.com/xemantic/openrndr-tree)

---

<div class="post-metadata">

**Author:** ![edwin](https://avatars.discourse-cdn.com/v4/letter/e/73ab20/32.png) [@edwin](https://openrndr.discourse.group/u/edwin)\
**Post date:** [April 10, 2021, 1:26pm UTC](https://openrndr.discourse.group/t/pure-kotlin-openrndr-compiling-to-javascript-and-native/200/7 "2021-04-10T13:26:29Z")

</div>

@kazik’s work has lead to something pretty big! There is an openrndr 0.4 branch: [GitHub - openrndr/openrndr at openrndr-0.4](https://github.com/openrndr/openrndr/tree/openrndr-0.4) that holds our work towards a Kotlin/JS compatible OPENRNDR.

Most of the utility code in `openrndr-math`, `openrndr-shape`, `openrndr-color`, `openrndr-animatable` and `openrndr-event` is already compiling using `common` /` js` / `jvm` interfaces.

Parts of the WebGL back-end are in place and in somewhat working condition.
