Integrate Julia simulations in a web page with Javascript

Hello!

Disclaimer: I have very little experience with deploying web apps, so perhaps I am going about this totally wrong. Feel free to correct me if I’m thinking about this wrong :slight_smile:

Background:
I have some simulations that were done in Julia and I have been thinking of creating a webpage to easily share them interactively. This way people can play with the parameters of the simulations and see the outcomes. I’ve been trying to find a way of doing this using Julia.

Attempts at finding a solution:
I have looked at using the Genie.jl framework, but (unless I am doing something wrong) I realized that it’s a little slow to run interactive simulations on the server side. It is possible that my understanding of this ecosystem is too poor to see an immediate solution. As a last resort, I could probably get by with the simulations running on the backend.

I seem to understand that at the end of the day, fast interactive applications, such as games, end up running on the client side in Javascript.
So I’ve been looking into converting my Julia code to Javascript. I see there are some ways of transpiling Julia to Javascript, but it looks a little difficult to do reliably. Furthermore, in my simulations I extensively use the Julia package DifferentialEquations.jl, which I would assume is not easily convertible to Javascript.

Overall, my question is this: How can I make a fast interactive web app that plots the solution to a differential equation and updates to, say, sliders changing the values of the parameters of the differential equations? Is there any way to use my work already existing in Julia? Or should I basically rewrite it in Javascript?

Thanks in advance!

have you tried Pluto?

There’s the new Genie Builder tools which should make this easy. Check out their ODE demo

I’ve seen some success with WGLMakie.jl and Bonito.jl:

Thanks for the help!

In the end, I ended up rewriting my simulations in JavaScript (+HTML and CSS) since I wanted to run everything in the front end.

As far as I could tell, Genie.jl only allowed me to make the app run on the back end, which could have worked, but I did not want to have to get into server stuff.

You can actually do both, Genie.jl is for server-side stuff. With Stipple.jl, which is part of the Genie Framework you can build interactive UIs.

To build the UIs faster with no code in a drag n drop editor, check out Genie Builder

See the app gallery for many examples that would fit your use case of displaying simulation results

https://learn.genieframework.com/app-gallery

Right, that makes sense.

But just for completeness: in my specific use case, I would like not only to display the simulations, but also to run them on the front-end (with JavaScript, since it is not as responsive to run them on a server with Genie.jl), which is why I had to resort to using JS to make them.

As far as I am aware, all the apps in the app gallery run the actual simulations on the server-side.

If your models are simple enough, you might be able to compile them with WebAssemblyCompiler. Then, you don’t need a backend. See the example at Lorenz model · WebAssemblyCompiler.

This is experimental and doesn’t support some features. In the DiffEq world, it doesn’t support any of the stiff solvers (needs work on multidimensional arrays and other features).

2 Likes

Ok, that is very cool! Thanks! Might be a viable solution for future projects!