TypeScript origins

For a long time, JavaScript was considered a terrible language. For various historical reasons and the fact that it requires multiple parties, that don't always have aligned goals to agree on the specification, it just wasn't a joy to write.

So inevitably, people started creating various transpilers. Some are straight up needed to write effective JavaScript nowadays and keeping older browser support, while others, such as TypeScript, build upon the language, or in most cases, are a straight up a new language that compiles down to JavaScript.

One of those is TypeScript

It differs from the majority of other precompilers that had a temporary hype (CoffeeScript, Dart, ...) in that it keeps JavaScript syntax, just adds type checks onto it. Strip away the TypeScript types and you're left with plain old JavaScript.

JavaScript function example:

      
const sum = (x, y) => x + y;
    

Same function with TypeScript:

      const sum = (x: number, y: number) => x + y;
    

We see that the TypeScript only adds the types to the arguments. Which in practice means, that we will get a compiler error if we do something like this and try to pass a string where we defined: sum('a', 2); or even sum('2', 2);.

Made in Microsoft

Microsoft was a bad word for the longest in the open source/developer community. As such you might be reluctant to invest too much time and effort into their homegrown open source products.

But I beg to differ. Microsoft recently embraced open source community, largely thanks to their CEO Satya Nadella and a lot of things they've been doing are ... great?

They are definitely doubling down on TypeScript. One of the examples is VSCode, written in TypeScript and usually the go-to editor for TypeScript, if not just about anything.

On top of that, we can see that some of the languages that are rapidly rising in popularity were made by the big 5. From Go (Google), Swift (Apple) to Dart (Google) and TypeScript (MS). The fact of the matter is, that you need a dedicated team to support the language and some production battle-testing if you want the language to take off. And The big 5 have the resources to do so.

Why it's great

Let me get this out of the way. I think TypeScript is great and probably the future of JavaScript for the next X years for larger projects starting out now and in the near future.

Superb maintainability

JS objects are often deeply nested and if they come from a 3rd party (API calls, packages) or even from the part of your codebase you're not that familiar with (think new hires on a large project), it can be hard to know what properties you can always rely on being there, what properties are optional and in general what properties are available. Which makes for unexpected errors such as calling properties on undefined or straight up mistyping properties or using them as a wrong type.

TypeScript helps with that. Of course it doesn't entirely prevent all of those errors, especially when relying on 3rd party JSONs, you still have to write an interface for those and if they change their API, your code breaks. But it definitely increases maintainability, as in such case, you just rewrite the interface to match their changes and you instantly see compile errors everywhere in your project where you're depending on no-longer existent properties.

Another absolute killer feature is having types. Very often in JS a property can be one of N number of strings, but anything else should be invalid. One of the most common examples being CSS. A float property expects a string, but not just any string. It expects left, right, ... but passing in mordor should not be valid. TypeScript types solve that as we can define a type that only accepts left and right and anything else that should be valid:

      
type FloatType = 'left' | 'right';

const floatCss = (float: FloatType) => {float};
    

Now if we try to pass in anything that's not left or right: floatCss('mordor'); will throw a compile error, while floatCss('left'); won't.

In practice, all the types for CSS are already written and we don't need to define them ourselves. We just get the goodies of autocomplete and compile errors.

It (kind of) is JavaScript

Personally, I love modern JavaScript. Destructuring, arrow functions, spread operators, Sets, Maps (and their weaker counterparts), async await all make for a pretty elegant language that I enjoy using. TypeScript just adds type annotations for developer happiness. It doesn't take anything away from JavaScript or try to reinvent the wheel.

Which I strongly believe is the reason for its rapid rise in popularity. There are more people familiar with JS than possibly any other language. And TypeScript makes the transition from JS to learning TS orders of magnitude easier than most of the alternatives such as Dart (I really enjoy Dart too, but for different use cases).

Side rant

As much as I've grown to like JS, writing async loops is still a pain and the generators/iterators do not feel intuitive.

It's evolving rapidly

Microsoft really is embracing TypeScript. They provide first-party packages for your most loved editors (and chances are your most loved editor as well), babel, npm... They listen to the community feedback and evolve the language itself. They provide good documentation and lots of interesting conference talks.

The ugly

3rd party packages

While more and more packages are being rewritten with TypeScript (Vue 3 too!), the majority of them are written in JS. They can be seamlessly integrated in your TypeScript project, but unless someone has written types for the package (which you can check here ), you will either have to write the interfaces and types yourself or just not make use of typed functionality when interacting with them.

It's also not uncommon that someone has in fact written types for the package you're using, but the types are either outdated or incomplete. This has lead to more frustration than I'd like to admit as you're not sure whether to hack the existing types to work for you, rewrite the types yourself or straight up not use types for the package.

TypeScript tools

Microsoft has gone out of their way to write build tools for your existing JS compilation set up. But it's still a new config file you have to understand, you have to understand how to incorporate it with your existing tools and in general it just adds a new layer to already hard to understand JS tooling ecosystem.

But the one that really pains me is Sublime support. I know I'm in the minority, but I strongly prefer Sublime over any other editor I've used. And this is proving to be pretty painful when working with TypeScript and Dart, both of which have poor Sublime support. TypeScript has a good Sublime package, except it's buggy. Every now and then (once an hour probably) Sublime loses it and the TypeScript package just stops working. It just stops registering changes to the code (will indicate an error where you've already fixed it) and providing autocomplete until I restart it. Super annoying.

What I gained from it

As I said, I recently rewrote my blog using TypeScript, took me about a week of afternoon coding and I managed to rewrite everything. My admin, my SSR and the frontend you're looking at right now.

In the process, I dropped a bunch of packages and shaved a lot of fat from the js bundle. I also found some misused objects and generally made the code more readable. See the changes .

But the real gain is maintainability. I build this blog about 2 years ago and it serves as a way for me to test new web technologies on a small scale that still includes common things we, as web developers, face on a day-to-day basis, such as authentication, proper CORS set up and SSR. After not working on it for a long time, it's daunting to start working on it again. The setup is cumbersome (due to having SSR, frontend compiling and Go backend) and remembering what my methods do is too. This is where TypeScript comes in. I no longer need to look up sometimes poorly named method signatures to understand what to feed it. TypeScript just shouts at me instead.

Thoughts

If you enjoy JavaScript or write it regularly for whatever reason, I would recommend picking up TypeScript. It's the direction the JS ecosystem is taking and for a good reason.

I didn't love it from the getgo, possibly because I don't have strong fundamentals in any typed language or possibly because seeing some examples I didn't even understand what's going on there.

But through small projects and incremental learning, I've grown to absolutely love it and will continue to use it for any JS project, regardless of size, for the foreseeable future.