There are several compile-to-js solutions out there, all promising to enable you to be productive writing web software. The JavaScript language has demonstrated its shortcomings when building scalable web applications. It’s use of dynamic types have proven to be both a blessing and a curse for developers. It’s quirks although with workarounds, have contributed to several security issues, apparent in the area of NPM packages.

A Viable Option for Web Development?

Dart presents itself as a contender that aims to make developers productive in little time building enterprise-level web applications. It does that by presenting a development kit containing not just a language, but also a set of tools, libraries and a repository containing third-party packages.

The language addresses the usual quirks of the JavaScript language, while providing a statically-typed system capable of identifying type-related errors before bundling your code for production. It combines styles from languages like Java, C# and JavaScript which lends a point of entry if you’ve developed in any of those languages. Developers are able to adopt object-oriented constructs like classes, interfaces, generics and so on while adopting it for the browser, something JavaScript lacked back when Dart was introduced in 2011.

However Dart didn’t convince the multitude partly because it was perceived as an effort to replace JavaScript, bringing discomfort to the web community. Furthermore, the initial intention was to have the language embedded in browsers and vendors were not willing to adopt this approach for fear that this would fragment the web and also the ensuing politics of embedding a Google product in all web browsers was unavoidable.

Then there came a superset language in 2013 called TypeScript by Microsoft, which adopted a less radical approach by overlaying a type system on top of the JavaScript language. This combined with the rise of ES6 introduced tooling to help supplement the “overlay of types” approach.

However TypeScript does not do away with the quirks of the JavaScript language as it only attaches a “band-aid” in the form of a type system. Using TypeScript requires tampering withts-config.json configuration files, which I have found not to be straightforward in the past, especially when having to integrate that with tools like WebPack. Although TypeScript presents a good effort to address the shortcomings of JavaScript, you risk writing logic that presents a challenge to read, looking more like C# than JavaScript code. This becomes more apparent when overlaying constructs like namespaces and interfaces.

Take a look at this snippet describing one of the interfaces from the LoDash library:

declare module "../index" {
...
  interface LoDashImplicitWrapper<TValue> {
    countBy<T>(
      this: LoDashImplicitWrapper<List<T> | null | undefined>,
      iteratee?: ValueIteratee<T>
    ): LoDashImplicitWrapper<Dictionary<number>>;

    countBy<T extends object>(
      this: LoDashImplicitWrapper<T | null | undefined>,
      iteratee?: ValueIteratee<T[keyof T]>
    ): LoDashImplicitWrapper<Dictionary<number>>;
  }
...

Looking at the above snippet, it’s awfully possible to over-engineer your TypeScript programs in order to get JavaScript to “behave itself”. That being said, TypeScript is not necessarily a bad approach. However, it would’ve been great to see it flourish independently and it seems to be what the Deno project is doing. This attempt to “stand on its own feet” highlights the sensible approach the Dart team took in developing a language that flourishes without binding itself to the constraints of the JavaScript language.

Still, why Dart?

Although there are no ultimate answers for software development, here are some of the reasons to consider Dart:

Ease of learning

The Dart syntax looks pretty familiar with sane conventions, making it extremely easy to pick up. Here is a sample snippet for classes and inheritance:

// Classes
class Person {
  Person(this.name, this.age);

  String name;
  int age;

  speak() {
    print("My name is $name. I'm $age years old");
  }
}

// Inheritance
class Employee extends Person {
  Employee(this.name, this.age, this.joinDate) : super(name, age);

  String name;
  int age;
  DateTime joinDate;

  @override
  speak() {
    print("My name is $name. I'm aged $age and I joined on $joinDate");
  }
}

Read more in Learn Dart before you Flutter.

Ease of Productivity

The tooling provided by the Dart SDK ensures that you are able to start off with your project in a short amount of time. This has encouraged more adopters over the years and growth in various social channels like Reddit, StackOverflow and Gitter.

Here are the tools that come with the Dart SDK:

1. dart: Analyzes and run Dart code.

2. pub: Manages dependencies and packages for your project.

3. dart2js: Compiles Dart code to production-ready JavaScript.

4. dartdevc: Compiles Dart code to ES6 JavaScript modules. Currently used during local development. Team member Vijay Menon explains further in this YouTube video.

5. dartfmt: Formats Dart code in line with the Dart style conventions.

6. dartdoc: Generates HTML documentation pages for Dart libraries.

Here are some feedback from users working with Dart for the first time:

Utility/Helper libraries

Aside from tooling, Dart introduces a set of libraries that contain utility and helper classes for writing your next software. The main ones are:

1. dart:async: Contains classes for asynchronous programming, like Futures and Streams.

2. dart:convert: Encoders and Decoders for converting between different data representations, including JSON and UTF-8

3. dart:core: Provides built-in types, collections, and other core functionality for every Dart program

4. dart:html: HTML Elements and other resources for working with the web browser’s DOM (Document Object Model)

5. dart:io: Support for working with the Filesystem, HTTP, socket, and other I/O for non-web applications. Used for serverside development, command line scripts, and Flutter mobile apps.

→ See the full list of libraries

Ease of achieving gains in performance

Dart allows the development of highly-performant mobile applications through the Flutter development kit. This is because Dart compiles ahead-of-time into machine code, saving the need for embedding the full Dart VM into a production mobile app.

Dart also compiles just-in-time to enable features like hot-reloading when developing your Flutter apps locally. Aside from that you can bootstrap a server and run a Dart backend app.

→ See the curated list of Dart libraries, frameworks and software

The dart2js tool generates optimized JavaScript when compiling for the web. The compiled JavaScript also contains optimization logic to ensure speed gains in long-running web applications. Kasper Lund of the Dart team covers this tool in-depth at the GOTO conference.

The Dart team work relentlessly in improving the optimization of generated code, which generally takes a software update on our side to experience these performance enhancements.

Ease of access to 1000s of community packages

Using the SDK’s pub tool grants you access to thousands of external packages developed by the community. This can be accessed at pub.dartlang.org. To install a package, configure your dependencies in a pubspec.yaml file and run pub get to grab those dependencies.

Ease of interop with JavaScript libraries

Dart provides the js package to enable the use of existing JavaScript libraries while enforcing the type-safety and conventions of the Dart language. I’ve produced several articles and videos demonstrating this, including a step-by-step guide. The community have also used this as a basis for writing wrappers for JavaScript solutions like React and Vue.js.

TIL that @refi_64 built a really great #dartlang library to use #VueJS directly from Dart! I've already got a basic app up and running in no time.

— Ewald (@EwaldHorn) February 28, 2019

Conclusion

The offering Dart provides has increased the confidence in saying that it is a viable option for web development. The fact that Dart/Flutter will have first-class support developing applications on the upcoming Fuschia OS by Google paints a brighter future for this technology.

Dart has also been listed as one of the growing languages:

"The latest technology report, Pluralsight’s 2018 wrap-up, showed Dart among the technologies that exhibited the most growth in 2018 and our poll results second this statement!" t.co/zbXv1Jk422 #Flutter #Dart #2019WillBeFun

— Tim Sneath (@timsneath) January 23, 2019

Last thing to leave you with is that I’m not declaring Dart to be a silver bullet! Ideally one should familiarise themselves with several languages and discover what works best for their situation. Rather I encourage you to add Dart to that process ?

Further reading

• Why Flutter uses Dart

• Dart Video Tutorials on YouTube | Creative Bracket

• Awesome Dart: Curated list of Dart libraries, frameworks and software

• Free Dart screencasts on Egghead.io