days
-6
-5
hours
-1
-8
minutes
0
-6
seconds
-4
0
search
It's not you, it's me...

5 alternatives to JavaScript for front-end development

Matthew Davis
JavaScript
© Shutterstock / iinspiration

JavaScript isn’t for everyone, but what are the alternatives? In this article, Future Hosting’s Matthew Davis looks at 5 of them and weighs the pros and the cons.

In 1995, Netscape Communications hired Brendan Eich to add a new language to Netscape Navigator, the most popular web browser of the day. Netscape wanted to augment the programmability of the web.

The result: LiveScript was released in late 1995 with a beta version of the browser and was renamed JavaScript before the final release to capitalize on Netscape’s partnership with Sun Microsystems, the company behind the popular Java language (although JavaScript has essentially nothing to do with Java).

Eich, who went on to co-found Mozilla, developed the original version of JavaScript in 10 days. Over the next quarter of a century, JavaScript evolved from a widely disliked and seriously limited language to the powerful foundation on which modern web applications are built. Today, JavaScript dominates the browser and has conquered much of the server space with Node.js.

 

 

However, JavaScript is not a language beloved by every developer. Eich made quirky decisions in the early days which remain with us in 2019 — prototypical inheritance, “this,” and JavaScript’s aggressive and inconsistent type coercion, among them.

In recent years, developers have created alternatives to JavaScript. JavaScript remains the only language to run in the browser, so these new languages compile — or transpile — to JavaScript. CoffeeScript was the first to gain widespread popularity, but it was quickly overtaken by a multitude of competitors, each of which uniquely improved JavaScript.

Dart

Dart is an object-oriented C-like language created by Google as a replacement for JavaScript. It does away with JavaScript’s prototype inheritance system in favor of a more traditional object-oriented approach that will be familiar to anyone who has worked with Java or C++. Unlike JavaScript, Dart is a statically typed language, eliminating common sources of error in JavaScript code. Dart supports type inference, so it’s not necessary to include type boilerplate every time you declare a variable or a function.

Perhaps the most exciting feature of Dart is its availability beyond the web. Dart code can be transpiled into JavaScript for running in the browser, but it can also be used for standalone applications and server-side development. Google’s Flutter UI toolkit is a portable front-end framework that can be used to build native applications on the desktop, mobile, and the web.

TypeScript

TypeScript is Microsoft’s entry in the race to a better JavaScript. Unlike Dart, TypeScript is not an entirely new language, but a superset of JavaScript. Valid JavaScript can be compiled by the TypeScript compiler, but TypeScript adds several new features that improve on and modernize JavaScript’s limitations, the most important of which is an optional type system.

Many JavaScript frustrations are caused by its lack of static typing, limiting the checks that the compiler can do before runtime. TypeScript, as the name suggests, implements a type notation that developers can use to bring type safety to web application programming. Like Dart, TypeScript supports type inference.

It’s worth mentioning that TypeScript is more popular than its Google competitor. The Angular framework is developed with TypeScript, even though it’s a Google project. TypeScript can be used with React and Vue too.

SEE MORE: Take your JavaScript learning beyond the classroom with these fun tools!

Elm

Dart and TypeScript have a recognizable kinship to JavaScript and C. Elm is different. It is a statically typed functional language more similar to Haskell than C, but without the head-scratching complexity of Haskell.

Elm is, essentially, a domain-specific language for building web front-ends.

Elm is not a general purpose language like JavaScript and doesn’t try to be; instead, creator Evan Czaplicki is focused on building the best possible front-end web app development experience. Elm’s main advantage is that, through static types and immutable values, it eliminates many potential bugs in front-end code. Elm advertises itself as a language that has “no runtime exceptions in practice,” meaning that if an Elm program runs at all, it’s unlikely to encounter show-stopping bugs in production.

The below example of Elm code comes from the language’s introduction, which is part of Elm’s excellent documentation.

update msg model =
  case msg of
    Increment ->
      model + 1

    Decrement ->
      model - 1

view model =
  div []
    [ button [ onClick Decrement ] [ text "-" ]
    , div [] [ text (String.fromInt model) ]
    , button [ onClick Increment ] [ text "+" ]
    ]

Elm code does not look anything like JavaScript, but it has a simple and intuitive syntax. Anyone who has learned JavaScript should have little trouble with Elm.

ClojureScript

Continuing our voyage away from JavaScript-like languages, we arrive at ClojureScript, a version of the Clojure programming language which can be compiled to JavaScript. Clojure is a Lisp that runs on the Java Virtual Machine. Like Elm, Clojure is a functional language with immutable data types. Unlike Elm, it is a general-purpose programming language that can be used on the back-end with the JVM and the front-end via JavaScript.

(ns hello-world.core)
(println "Hello world!")

Like all Lisps, Clojure is written in S-expressions delimited by parentheses. In the words of Clojure’s creator, Rich Hickey, ClojureScript “seeks to address the weak link in the client/embedded application development story by replacing JavaScript with Clojure, a robust, concise and powerful programming language.” Clojure can be used with React and other popular JavaScript frameworks.

As a historical aside, when Netscape hired Brendan Eich, they planned to integrate Scheme into Navigator rather than creating a new language. Scheme is a Lisp, so, if history had worked out a little differently, Lisp could have become the most popular programming language family in the world. JavaScript retained some of its “Lispiness” with first-class functions, closures, and lambdas. Douglas Crockford, who played a key role in the development of JavaScript and invented JSON, calls JavaScript a “Lisp in C’s clothing.”

SEE MORE: JavaScript ecosystem survey concludes React is the most popular framework

Phoenix LiveView

The languages we’ve looked at compile to JavaScript. They let developers build client-side applications without writing JavaScript.

Phoenix LiveView is different. Phoenix is a web framework written in the relatively new Elixir programming language. Phoenix is a server-side framework, so why are we talking about it in an article dedicated to browser JavaScript alternatives? Because LiveView can replace JavaScript in many web development scenarios.

Phoenix’s creator Chris McCord calls LiveView “an exciting new library which enables rich, real-time user experiences with server-rendered HTML.” LiveView uses Phoenix Channels to create a two-way connection between the browser and the server. LiveView is based on Websockets and can be used to create interactive experiences without writing JavaScript. It’s natural to worry that this approach will be too slow to be useful, but LiveView is designed to minimize data transfer and can, in practice, be used to build low-latency interfaces.

LiveView has limitations. It’s not advisable to build a complex application like Google Docs in LiveView. If offline functionality is important to an application, then LiveView isn’t the right solution. However, for features such as forms, real-time interface updates, and data validation, Phoenix LiveView is a viable alternative to JavaScript. It’s also much smaller than most JavaScript applications; LiveView’s browser code is about a quarter of the size of React.

Closing thoughts

We have looked at five alternatives to writing JavaScript, each of which offers a different approach to the creation of web applications and interactive interfaces. For the time being, it’s impossible to avoid JavaScript as it’s the only language supported by web browsers.

But that may be about to change as WebAssembly is more widely adopted. All major browsers support WebAssembly, and, in the future, it is likely to become the default compilation target for web-focused languages. That is a topic for a different article, but it would be a good idea for web developers to begin to explore the possibilities of WebAssembly.

Author
Matthew Davis
Matthew works as a writer for Future Hosting, a leading provider of VPS hosting. He focuses on data news, cybersecurity, and web development topics. You can usually find his hiding behind a computer screen, searching for the next breaking news in the tech industry. For more great articles, check out FH's blog.

Leave a Reply

6 Comments on "5 alternatives to JavaScript for front-end development"

avatar
400
  Subscribe  
Notify of
Hesam
Guest

Thanks for the article, Scala.js is also a good alternative to the JavaScript

digitalwebhero
Guest

what about reasonml?

Peeyush
Guest

It is good option, but it will all compile to JavaScript and why not learn JavaScript. It will have 2 points of failure. 1st bug created by developer themselves and 2nd one created by the language transpiler

Zain
Guest

Blazor. C# in your browser although still in preview.

Brainstorms
Guest

Amber and PharoJS transpile Smalltalk (Pharo) to JavaScript.

Ahmad Bawaneh
Guest

You didnt include Java, there is a lot of tools that allows you to write java for the frontend with client side rendering..right ;-)