Static typing in
web apps

on example of TypeScript and Elm

Tomasz Białecki, Kamil Durkiewicz

Agenda

  1. Introduction.
  2. Why do we need static typing?
  3. Static typing in TypeScript based applications.
  4. Writing web application in Elm.
  5. Advantages and disadvantages of strong typing in Elm.
  6. Comparison.

Do we need static typing?

Dynamic typing - the theory

  • concise & readable = easy to maintain
  • modules' API should be obvious
  • unit tests instead of compiler

But in practice...

  • Easy to add a new feature
  • but when you remove a feature
  • or change requirements...

And after many hours of trying...

Summary of issues with dynamic typing

  • You know about errors when only when the code is run
  • Much higher risk of releasing a product with hidden defects
  • Much more debugging
  • Difficult to refactor

TypeScript - facts

  • 1st release: 2012-10-01
  • Currently in version 2.1
  • Open source, maintained by Microsoft
  • Compiled to JavaScript
  • Only a language (without frameworks)

React development

  • Supports JSX syntax
  • Interfaces instead of PropTypes
  • Compile-time errors for components usages

ELM

Enforced Semantic Versioning

$ elm-package diff elm-lang/core 4.0.5 5.0.0

Comparing elm-lang/core 4.0.5 to 5.0.0...
This is a MAJOR change.

------ Changes to module Maybe - MAJOR ------

Removed:
oneOf : List (Maybe.Maybe a) -> Maybe.Maybe a

Changed:
- andThen : Maybe.Maybe a -> (a -> Maybe.Maybe b) -> Maybe.Maybe b
+ andThen : (a -> Maybe.Maybe b) -> Maybe.Maybe a -> Maybe.Maybe b

Static typing in ELM

  • + Once compiled - works
  • + Cannot take a shortcut
  • + Compiler is really helpful
  • – Cannot easily pass objects from/to JS
  • – No reflection at all

Comparison

  TypeScript Elm
Companies involved Microsoft, Google NoRedInk
NPM downloads / month 2,493,785 22,263
Integrating with 3rd party libs easy hard
Compilation speed in mid-size project seconds minutes
Source maps yes no
  TypeScript Elm
Strictness Configurable, loose by default Strict
Type inference is improved in every release close to perfection
Null handling strictNullChecks flag since 2.0 no-nulls
Breaking changes between versions no yes (0.16 -> 0.17)
Learning for JS developers easy hard

Conclusions

  • Elm is great for canvas graphics, small SPAs or non-SPA websites
  • TypeScript is great for middle or large SPSs

Questions?