DEV Community

loading...
Cover image for The Frontend Hitchhiker's Guide: JavaScript Alternatives

The Frontend Hitchhiker's Guide: JavaScript Alternatives

Nicholas Mendez
Web Developer, Web Instructor
・Updated on ・4 min read

Introduction

Web development... Without JavaScript? While the idea might seem inconceivable, there are many alternative languages for building frontend web apps. Let's take a look at them.

But first... Web Assembly

The default runtime of the web browser is JavaScript. However Web Assembly is a very interesting language that is recently supported by modern browsers.

One cool thing about web assembly is that it is often used as a compile point to migrate code in other languages to run on the browser!

image

Image Credit

While the JavaScript alternatives that we will explore let's you write apps in a different language, they are eventually compiled to JavaScript or Web Assembly for production.

Non-JS Frameworks

  1. Angular
  2. Scala.js
  3. Yew
  4. Clojure Script
  5. Emscripten
  6. Flutter
  7. Kotlin
  8. Blazor

Angular

image

Angular.JS was originally released in 2012 but was reworked from the ground up in 2015 for version 2. The major change being the language of the framework switching from JavaScript to Typescript hence its rebranding to Angular.

Angular is known for its moderate learning curve but that's what you get for an all in one framework. Angular supports features such as routing, ajax, SSR, translation, routing, http, animations, testing and much more.

Scala JS

image

Scala.js let's you transpile applications written in the programming language Scala into JavaScript. Scala.js boasts correctness, performance and interoperability with other JavaScript frameworks.

Scala is often seen as a java alternative so if you already know java this might be interesting for you to look at.

Yew

image

Yew is a framework built on top of a promising programming language called rust and then is transpiled into web assembly as a web app. A big sell of Yew is that apps built with it can be mutli-threaded due to the web assembly runtime. Yew is also interoperable with javascript npm packages.

Clojure Script

image

Clojure is a dynamic, general purpose language based on another language called Lisp. Because of this its syntax looks very different from the other languages featured in this list.

The ClojureScript compiler will allow you to port your Clojure programs to the web.

Emscripten

image

Emscripten is just another example of the power of web assembly. It is a compiler that can transpile your C/C++ code to web assembly. Emscripten was used to
port the 30 year old software AutoCad to the web (which is really nuts if you think about it)!

Flutter

image

Flutter is framework created by google that is built with the dart programming language. Flutter was originally made for building for cross platform IOS and Android apps but today you can also use it for the web! The prospect of having one code base for Web, IOS and Android is an attractive one indeed.

Kotlin

image

Like Flutter, Kotlin was created for building mobile apps, specifically as a java sdk alternative for android. Since then, kotlin has ambitiously positioned itself as a general purpose language. Whether is for web apps, data science, native or server-side programming, you can use Kotlin! Kotlin is transpiled into JavaScript when used for web.

Blazor

image

Blazor is a framework by Microsoft written in the C# programming language and .NET. Like flutter and Kotlin, .NET is a cross platform technology that lets you build for web, mobile, desktop and more. Blazor lets you compile your C# code to web assembly to run in the browser but you can also run it server side. Blazor can interop with other Javascript libraries such as React or Vue.

Conclusion

I'm sure in this post you would have seen at least 2 programming languages you that you never heard of before. Exploring new technologies is what the hitchhikers guide is all about. Yet, it seems that this 2 month long journey is soon reaching its end... See you next week for our final stop!

Resources

Discussion (0)