Where are you using WebAssembly?
Wasm promises to let developers build once and run anywhere. Are you using it yet?
At work, for production apps
At work, but not for production apps
I don’t use WebAssembly but expect to when the technology matures
I have no plans to use WebAssembly
No plans and I get mad whenever I see the buzzword
Software Development

How TypeScript Helps Enterprise Developers

TypeScript, a superset of JavaScript, is used by AirBnb, Slack Desktop and many other enterprises and their products. Here's why big projects demand it.
Feb 1st, 2022 8:46am by
Featued image for: How TypeScript Helps Enterprise Developers

For many enterprises, web applications written in JavaScript are a standard part of their development process, for both customer-facing and internal line of business applications. When they have large teams of developers working at scale, TypeScript — a statically typed superset of JavaScript — is increasingly proving to be a more suitable choice than plain JavaScript.

That may be one of the reasons TypeScript jobs pay better than JavaScript roles, by nearly $5,000 a year on average.

TypeScript isn’t trying to be a programming language in its own right; it’s really a combination of tooling and optional, removable types. Technically, TypeScript is a combination of a static type checker with a compiler (that can also act as a transpiler). But the fundamental idea is to improve developer productivity in the most widely used language of all — JavaScript.

When TypeScript started at Microsoft back in 2011, JavaScript lacked key features for structuring large codebases: modules, classes, interfaces and especially a static type system. TypeScript was developed to give developers the productivity they were used to in languages like C# that has those modern language constructs (and to enable features in developer tooling that relies on them).

JavaScript is both powerful and flexible. You can hack out a prototype quickly and build server backends as well as browser or desktop apps. But JavaScript doesn’t give developers as much help with managing and understanding large codebases as other languages.

“JavaScript is one of the most ubiquitous languages. It’s everywhere, but it has one of the weakest developer ergonomics or productivity experiences,” noted Dylan Schiemann, co-founder of Dojo, one of the earliest JavaScript frameworks and an early TypeScript enthusiast. “It’s simple because it’s simple, but it’s actually hard to do the right thing at times.”

Developers like the freedom to write code and to remove that code and replace it with something else but “without interfaces you can’t really do that,” he added. “And without types you don’t have interfaces.

“TypeScript is fixing up something that is fundamentally dirty. JavaScript is kind of dirty and TypeScript makes it less dirty.”

What You Get from TypeScript

Slightly confusingly, TypeScript refers to several different things:

  • The type-checker for the TypeScript and JavaScript languages.
  • A “superset” language that adds type syntax to JavaScript.
  • The official compiler that type checks and transforms your code.
  • The editing experience that’s co-developed with the compiler and is bundled in editors like Visual Studio and Visual Studio Code.

All those are needed to add static typing to JavaScript and deliver tooling that makes that easy and convenient to use. Calling TypeScript a strongly typed superscript of JavaScript might make people think it changes how JavaScript works (or changes your code), noted Daniel Rosenwasser, senior program manager for TypeScript.

He prefers calling it statically typed, “since we’re just performing some checks before you run your code. Our vision is for TypeScript to complement and improve JavaScript in whatever way it can.”

The goal of TypeScript has evolved over the years, along with the JavaScript language itself; before ECMAScript 6 kicked off a now-annual cadence of improvements to the language, TypeScript’s role as a transpiler was an important way to get access to language improvements, like arrow functions and enums.

Now the language only implements new features that have reached stage three in the TC39 standardization process, those ready to be built into JavaScript implementations to get feedback. “The place where TypeScript innovates is the type system, not the run time,” said Titian Cernicova Dragomir, a TypeScript expert and Bloomberg software engineer.

TC39 co-chair Rob Palmer explained TypeScript as syntax: “It’s type annotations, just extra characters you can add to your JavaScript, to give more meaning to it and to allow the compiler to detect more errors and offer you more and more benefits, because it understands more about what you really meant for that code.”

There’s no conflict or competition with JavaScript. Think of TypeScript more like a linting tool or a code-enforcement tool than necessarily a programming language that deviates from JavaScript, Schiemann suggested: “It’s really a set of tools that make JavaScript better that get removed.”

That’s why Rosenwasser prefers to call TypeScript “JavaScript with erasable types.” Developers mark the types in their code;  the compiler checks them, then generates clean JavaScript code that looks as if an expert human developer wrote it.

You can also adopt TypeScript progressively, Dragomir noted. “If you look at all the compiler settings TypeScript has, you can look at them as a dial and start that on the lowest setting and progressively increase the security and strictness as you move along.”

That means you can pick the mix of expressiveness and correctness you want in a language that remains as flexible as JavaScript — because it is JavaScript.

Modern JavaScript code is valid TypeScript code and TypeScript runs anywhere JavaScript runs, on any device with a JavaScript runtime that supports ECMAScript 3 or higher — whether that’s a complex website, a backend service or a mobile device.

Why Enterprises Need TypeScript

Especially when you have multiple developers building large-scale web apps with many thousands of lines of code, the dynamic typing in JavaScript, which means code will compile even if it has errors that will stop it running, makes it far too easy to end up with messy code that’s hard to debug and maintain. Enterprises can’t afford that kind of technical debt.

For complex code, enforcing types makes it harder to introduce bugs without noticing, because they tell both the compiler and developers how the code is supposed to behave.

Getting type errors as soon as you compile code, as you do with Typescript, so you can see the problems while you’re still writing your code rather than hours later, makes it far easier to debug a project than when those errors show up at run time.

Static type checking doesn’t just help spot type errors and operations that won’t work because of the type; it makes it easier for an integrated development environment (IDE) to find mistakes like typos in method names.

Types allow for context-aware suggestions like autocomplete, for better code navigation (by finding all the references in code or taking you to the definition) and for better automatic refactoring. “Things that used to take a whole day take a second with refactoring, and that’s just invaluable,” noted Anders Hejlsberg, a technical fellow at Microsoft and core developer of Typescript.

Types also make it easier for humans reading the code to understand the arguments and values of a method without digging into comments and documentation (for your code and for any libraries and frameworks).

Getting type errors as soon as you compile code, as you do with Typescript, so you can see the problems while you’re still writing your code rather than hours later, makes it far easier to debug a project than when those errors show up at run time.

You can document code and annotate types with JSDoc, but you still have to make sure the code and documentation match up: other developers have to trust that the code was documented correctly in the first place and that any changes are reflected in the documentation.

For large teams writing a lot of code, these benefits can be a huge productivity boost. “Teams like Outlook Web and others in Office were considering compiling from languages like C# to JavaScript just so they could get modern language constructs, type checking and good tooling,” Rosenwasser told the New Stack.

“We knew that that was not the right way to get those benefits because you couldn’t ignore the underlying platform — if you want to build the best JavaScript apps, you have to start with JavaScript.”

With TypeScript, enterprises can get the fast development they picked JavaScript for, with the type-checking and tooling that delivers developer productivity.

Enterprises Already Rely on TypeScript

Enterprises almost certainly use software that uses TypeScript. Not only is TypeScript itself written in TypeScript, so are Visual Studio Code, the web version of the Excel engine, Slack Desktop, Microsoft’s new Fluid framework and the Figma design tool — technologies that are powering the next generation of collaborative apps that enterprises will rely on,  noted Rosenwasser.

“It’s clear TypeScript is going to power a lot of rich apps in that domain,” he said.

Dojo and Angular 2 were notable early adopters, Schiemann told The New Stack: “We knew the problems and we knew the pain points, and we knew this had the potential to help us.”

Now almost every major frontend framework is written in TypeScript, said Rosenwasser: “At some point, the question became, who isn’t using TypeScript?”

Airbnb has more than 2 billion lines of JavaScript and 100-plus internal npm modules. It decided to make TypeScript its official language for frontend web development after looking at six months of postmortems and discovering that TypeScript could have prevented 38% of the bugs that resulted in incidents in production.

“TypeScript is fixing up something that is fundamentally dirty. JavaScript is kind of dirty and TypeScript makes it less dirty.”

—Dylan Schiemann, co-founder of Dojo

Slack had a similar experience when moving to TypeScript for writing Slack Desktop, immediately finding a surprising number of small bugs. It also found the productivity improvements so significant that the company started using it for all new code within a few days of starting to convert the existing codebase.

“TypeScript gives us a guarantee that the structural dependencies in the code are sound,” Felix Rieseberg, an engineering manager at Slack when it moved to TypeScript, pointed out in a presentation about adopting the language.

There’s certainly some overhead in adopting types, but the developer productivity for large teams with large codebases is very appealing. Being able to lean on code completion and codebase navigation, both features of TypeScript, helps a team scale out, Rosenwasser said.

“Questions like, ‘How is this function supposed to be used?’ and ‘What properties can I access here?’ might be hard questions to answer without TypeScript,” he said.

“It’s very rare in our experience to see someone move away from TypeScript because that baseline experience is hard to give up,” he added, especially the code completion feature and its ability to help users avoid typos.

Dragomir echoed these sentiments. “I feel incapable of writing pure JavaScript. It’s so restricted,” he said. “Once you’ve gotten used to it, if you try to go back to JavaScript, you feel the pain.

“It’s that you have gotten used to the idea of it doing everything for you and you suddenly feel like you’re driving without a seatbelt, and that feels painful.”

But adopting the language involves a learning curve, Rosenwasser noted, and enterprise developer teams will need to take that into account as they move to TypeScript.

“Maybe TypeScript in its entirety won’t be the best tool for every project — especially very small programs and short scripts,” he said “So we try to provide modes like checkJs, where you can write in plain JavaScript with JSDoc type annotations and get checking from TypeScript.”

Airbnb decided to make TypeScript its official language for frontend web development after looking at six months of postmortems and discovering that TypeScript could have prevented 38% of the bugs that resulted in incidents in production.

TypeScript usage is a little less common in server-side code, although it’s used with Node.js, Deno, and many other serverless runtimes; Bloomberg uses TypeScript in its unified frontend and server-side systems.

“While there’s a huge chunk of Node.js developers that use TypeScript, there’s a little bit less willingness in the Node world to add a compile step,” said Rosenwasser.

Webpack and Rollup have normalized that step as part of the build chain for frontend developers, he said. “TypeScript has an edge on the front end, and a big part of that is because build steps like bundling have become ubiquitous.”

TypeScript Tooling

TypeScript developers can use any JavaScript tools, libraries and frameworks; if the type definitions for those aren’t included in the package, they’re almost certainly available from DefinitelyTyped (and delivered through npm).

That network effect adds to the popularity of TypeScript, according to Palmer (and simplifies enterprise adoption).

“You can get type information for almost any library, any package in the world,” he said. “And of course, when you try to do something for every package in the ecosystem that requires work, people are willing to do that work once. But you’re not going to get the whole world to do that work for every single type system.”

Early on, the best place to use TypeScript was in Visual Studio, which meant using Windows and paying for a high-end Microsoft developer tool — or missing out on the tooling that’s a key part of the TypeScript experience. Enterprises may well have that expertise in existing development team members who are used to other languages, but not all new web development hires will.

For developers with experience in Python, C or Java, the tools TypeScript brings are familiar and have been missed. For younger developers, they are more likely to be novel.

The arrival of Visual Studio Code changed that, and other popular editors like Atom and Sublime support it (directly or through plugins), using the language services that allow TypeScript (and your editor) to understand which properties and methods are available on certain objects.

The motto of Rust is “fearless concurrency.” Rosenwasser likes to suggest that TypeScript’s superpower is “fearless refactoring.”

“We’re motivated by common bugs we see in the real world,” he said. And with the scale of TypeScript usage, the team gets to see a wide range of issues in code.

TypeScript aims to recognize common JavaScript patterns so that you can write your JavaScript without remembering that you’re writing TypeScript, Rosenwasser said.

”In a sense, we’re making the language more expressive without trying to push the burden of expressing yourself to the type system,” he said. “The more we do this sort of thing, the more you can avoid type-assertions”— or casts — “that often violate the type system’s assumptions.”

Favorite Features of TypeScript

Recent releases of TypeScript have added features to make it easier to work with async functions (an Awaited type for working with Promises in JavaScript) and for using different types when you set a property and when you retrieve it (because you might accept both integers and strings but transform those strings to integers before storing them).

One favorite feature Rosenwasser called out is the way TypeScript handles union types.

“TypeScript’s not the only type system with untagged structural union types, but it’s one you typically won’t see outside of type systems for dynamic languages like JavaScript,” he said. “There’s something very powerful about being able to mix and match the possible values a function can take.”

Some features, like eliminating tail calls between recursive types, are extremely powerful and aimed at developers writing libraries. “Indirectly, we’ve built a small functional programming language within our type system, and one of the challenges is how to allow people to use those constructs efficiently and effectively,” said Rosenwasser.

Others, like snippet completion, will prove useful for many developers who work at scale. This feature lets you add default text and tab through the different options, choosing bits and pieces of code you might want to tweak. Instead of typing lots of boilerplate, developers can focus on the core logic of their code.

In fact, as TypeScript encodes more semantic understanding of how developers write JavaScript code, there are more places where it knows what types are required. As a result, developers don’t have to provide those type annotations themselves, getting the benefits of control flow analysis without extra work.

If you have a variable that can be a type or null, and it’s not null, then the type is automatically changed to the type it should be.

For developers with experience in Python, C or Java, the tools TypeScript brings are familiar and have been missed. For younger developers, they are more likely to be novel — and Schiemann credits some of TypeScript’s recent popularity to this.

The language services in TypeScript mean editors like Visual Studio Code gain extra understanding of plain JavaScript code, without types to give it hints. That powers autocompletion and code navigation as well as refactoring, Palmer pointed out.

“A lot of people will think they’re just using Visual Studio Code,” he said. “And they won’t realize all those powers are coming from TypeScript running under the hood.”

TypeScript’s Growing Impact

TypeScript is also beginning to influence new languages like AssemblyScript for WASM and Bicep. Rosenwasser credits the familiarity of JavaScript for some of that, in much the same way that many languages adopt the conventions of C: “If your syntax looks close to something in the C family of languages with curly braces and the like, you get a lot just by being familiar.”

But it’s also worth noting that static types make TypeScript relevant in some domains JavaScript may not be appropriate for.

In many ways, TypeScript is the project that taught Microsoft how to do open source well. (Other open source project maintainers inside Microsoft credit the TypeScript team for shepherding them through their projects’ early stages.)

Thinking back to how they won over frameworks like Dojo and developers with large projects, Jonathan Turner, a former program manager for the Typescript team, recalled: “opening our doors and treating everyone that comes to us as engineers with good juicy problems about how they work with JavaScript.”

From the perspective of a TypeScript user, Schiemann called the team that built the tooling “the most humble, warm, inviting group of geniuses.”

“They just keep looking at things that are hard to do, and how they can make it more ergonomic and easier to work with,” he said of the people behind TypeScript. “They say, how can we make this more useful for you? And they listen, and they do those things, and then people are happy.”

Group Created with Sketch.
TNS owner Insight Partners is an investor in: Deno.
THE NEW STACK UPDATE A newsletter digest of the week’s most important stories & analyses.