Elm VS yew

Use languages that don’t have side-effects; Elm for UI, and Roc for API/CLI.

Reactive programming itself is rarely found in pure form. It is often combined with other paradigms. This is how such mixes as Imperative Reactive Programming, Object-Oriented Reactive Programming and Functional Reactive Programming appeared. The latter is the most popular, and the Elm language is considered one of its main representatives.

I've drawn inspiration from Elm and the blog post Compiler Errors for Humans -- it is nearly a decade old and still inspiring to read.

When I see this it makes me want to run for ReasonML/ReScript/Elm/PureScript.

Sum types (without payloads on the instances they are effectively enums) should not require a evening filling ceremonial dance event to define.

https://reasonml.github.io/

https://rescript-lang.org/

https://elm-lang.org/

https://www.purescript.org/

(any I forgot?)

It's nice that TS is a strict super set of JS... But that's about the only reason TS is nice. Apart from that the "being a strict super set" hampers TS is a million and one ways.

To my JS is too broken to fix with a strict super set.

> It appears the last commits on GitHub are from mid 2024

That's not what I see.

The last commits for elm/compiler were minor fixes in 2023. Last substantial changes were in 2021. See https://github.com/elm/compiler/commits/master/

The last commits for elm/core were in the first months of 2021. See https://github.com/elm/core/commits/master/

> It appears the main developer is working on a new thing?

One of the problems is that the developer said several times, even in a recent interview, that he was still working on elm, with a focus on the long term. He gave a few vague hints about his private roadmap. After 4 years without any real public activity, I find it hard to believe there's some private activity.

Elm

Elm, ReScript, F#, Ocaml, Scala… it’s just normal to name your types, then use them places. In fact, you’ll often create the types _before_ the code, even if you’re not really practicing DDD (Domain Driven Design). Yes, you’ll do many after the fact when doing functions, or you start testing things and decide to change your design, and make new types. Either way, it’s just “the norm”. You then do the other norms like “name your function” and “name your variables”. I’m a bit confused why it’s only 2 out of 3 (variables and functions, not types) in this TypeScript Angular project. I’ll have to look at other internal Angular projects and see if it’s common there as well.

A web application makes use of these same ingredients, i.e. HTML, CSS, and JavaScript, but it uses significantly more JavaScript. As the JavaScript powering your web application grows in size it can bring with it a variety of problems that a few languages, like TypeScript, ReScript, PureScript, and Elm, have attempted to solve. Each of the aforementioned compile to JavaScript languages have their pros and cons but it is beyond the scope of this article to get into those details. Suffice it to say, my preference is Elm. It is also not the goal of this article to convince you to use Elm but only to show you how Elm fits into the flow of creating a web application and hosting it on GitHub Pages. So let's continue by adding Elm to our project.

FROM mcr.microsoft.com/devcontainers/javascript-node:20 # Configuring Elm version ARG ELM_VERSION=latest-0.19.1 ARG ELM_TEST_VERSION=latest-0.19.1 ARG ELM_FORMAT_VERSION=latest-0.19.1 # This Dockerfile adds a non-root user with sudo access. Update the “remoteUser” property in # devcontainer.json to use it. More info: https://aka.ms/vscode-remote/containers/non-root-user. ARG USERNAME=node ARG USER_UID=1000 ARG USER_GID=$USER_UID # Install elm using the provided method, elm-test and elm-format via npm RUN export DEBIAN_FRONTEND=noninteractive \ # Install Elm binary && curl -L -o elm.gz https://github.com/elm/compiler/releases/download/0.19.1/binary-for-linux-64-bit.gz \ && gunzip elm.gz \ && chmod +x elm \ && mv elm /usr/local/bin/elm \ # # Install elm-test and elm-format via npm && sudo -u ${USERNAME} npm install --global \ elm-test@${ELM_TEST_VERSION} \ elm-format@${ELM_FORMAT_VERSION} \ # # [Optional] Update UID/GID if needed && if [ "$USER_GID" != "1000" ] || [ "$USER_UID" != "1000" ]; then \ groupmod --gid $USER_GID $USERNAME \ && usermod --uid $USER_UID --gid $USER_GID $USERNAME \ && chown -R $USER_UID:$USER_GID /home/$USERNAME; \ fi \ # Create the elm cache directory where we can mount a volume && mkdir /home/$USERNAME/.elm \ && chown $USERNAME:$USERNAME /home/$USERNAME/.elm # Install elm-test, elm-format, elm-watch, and git globally via npm RUN npm install -g elm-test elm-format elm-watch elm-live git

Maybe, if you want those features, you would love yew and leptos which are other UI frameworks with Rust.

https://github.com/yewstack/yew

Rust? It's built clean from the ground up. The crates.io registry is full of modern, safe, composable libraries. You've got Axum, Rocket and Actix for backends, Leptos, Dioxus, and Yew for frontend, and more. Every library you use follows the same philosophy: safety, performance, and zero tolerance for ambiguity.

> To my knowledge there is not a Vue/React-WASM-type framework out there yet or any framework for building web apps in WASM (without starting from a blank canvas).

Not sure if these qualify, but these Rust web frameworks use wasm:

https://dioxuslabs.com/

https://leptos.dev/

https://yew.rs/

Yew

This has already been done; there are multiple languages/frameworks that compile directly to WASM with no JS such as https://yew.rs/

> You still need to access the DOM, which can't be done directly from WASM. Maybe someday it will happen?

You can access the DOM through JavaScript glue. These Rust WASM frameworks do that:

- Leptos: https://www.leptos.dev/

- Sycamore: https://sycamore.dev/

- Yew: https://yew.rs/

- Dioxus: https://dioxuslabs.com/

> Okay, so use canvas instead and do all UI inside WASM?

You can do that too. That's what this VB6 clone written in C# and compiled to WebAssembly does:

- https://bandysc.github.io/AvaloniaVisualBasic6/

- https://github.com/BAndysc/AvaloniaVisualBasic6

> vague "JavaScript limitations"

It's not vague. Despite 28 years of effort optimizing JavaScript, WebAssembly outperforms JavaScript:

- https://nuenki.app/blog/bloom_filters_optimisation

- https://jordaneldredge.com/blog/speeding-up-winamps-music-vi...

- https://www.amazon.science/blog/how-prime-video-updates-its-...

[package] name = "wasm-dev" version = "0.1.0" edition = "2021" [dependencies] yew = { git = "https://github.com/yewstack/yew/", features = ["csr"] }

Yew is a framework for creating reliable and efficient web applications. Yew

I coded up a game of life implementation in rust and web assembly using https://yew.rs/ as an effort to sharpen my rust skills and it resulted as a fun toy. You can find the source here: https://gitlab.com/reedrichards/wvdom Enjoy!