I moved a 4000 line coffeescript project to typescript and I liked it

-
TLDR: jump straight to the TypeScript section
About 8 months ago I started a new complex web app in javascript, and it quickly grew out of hand.
It had:
  • a server with routes
  • a singleton object with state, logic and helper functions
  • a bunch of similar plugins that extend functionality
  • the singleton object lives both on the server and on the client
Very soon I decided that javascript allowed too much patterns. I wanted modules, classes and easy binding on the this keyword.
Someone recommended CoffeeScript and I went with it.
The codebase expanded to about 4000 LOC in a matter of weeks.


So CoffeeScript hm, what about it?

These are my experiences after maintaining a non-trivial coffeescript application for a couple of months.

Pros:
  • Programming was quicker, stuff you want is already in the language. (classes, inheritance, array comprehension, filters)
  • Less verbose.
  • for k,v in object
  • fat arrow
  • "string interpolation #{yes.please}"
Cons:
  • fat arrow is very similar to thin arrow, git diff thinks this sucks
  • syntax. The attempt of avoiding braces is horrible. Function calling is a mess.
  • It smells like ruby. I dislike ruby with a vengeance.
  • no more var keyword? This is disturbing and error prone, given its significant subtleties in javascript.
  • everything is an expression? I like to be explicit about return values kthnxbye.
The result: a buggy codebase that feels scary, lots of unsafe monkey patching, coffeescript that seems to disagree with the idea of coffeescript.


TypeScript

When I started this codebase TypeScript had just launched. I deemed it a bit too experimental to work with, but last weekend I decided to give it a go. On Sunday I did git checkout -b typescript-conversion, installed the typescript syntastic plugins and started up vim. Fourteen straight hours of refactoring later it was done and 4238 lines of coffeescript had turned into 6145 lines of typescript.

I compiled all the .coffee files to .js files, removed all the .coffee files from the repo, and renamed all the .js files to .ts. Technically I was already done, as js is a strict subset of typescript, but doing everything typescript style was a bit more work.

Here are my experiences.

Pros:
  • fat arrow: removed almost all uses of self = this.
  • static type and function signature checking. I immedeately fixed about ten hidden bugs thanks to this.
  • classes and modules have never been easier
  • linking using tags
  • compiling linked files to one concatenated file out of the box using tsc --out
  • aim at ecmascript 6 forwards compatibility
Cons:
  • slower tooling (vim syntastic takes about 3-5 seconds after each buffer save)
  • no way of doing stuff like for k, v in object
  • no string interpolation
  • no automatic ecmascript 3 compatibility layer (monkeypatching Array with indexOf etc.)

Conclusion


I really really really like TypeScript. My project feels really clean, I see lots of room for improvement (and this time I know where to start). For larger codebases typescript will greatly improve maintainability.

If you work on a large codebase you can either automate testing, enforce developer discipline or move to static typing and a compile step. I think the last option is greatly preferred.

Popular posts from this blog

Parsing 10TB of Metadata, 26M Domain Names and 1.4M SSL Certs for $10 on AWS

-
Last May I was working on hobby project similar to this:  https://github.com/zakjan/cert-chain-resolver/  . As I found the cert-chain-resolver project a couple of days later I did nothing with the results, but I got some nice comments on how I used 1 VM to download & process 10TB in a couple of hours on this HN thread recently so I decided to do a write up on the process and publish the data. See the parts below: Part 1: downloading 10TB of metadata in 4 hours Part 2: fetching a ****load of certificates Part 3: playing with the data Total costs My approach was somewhat different from the github project above, instead of using the AIA extension I wanted to brute-force the solution by finding all known intermediate and root certificates in advance. Based on the checksum of the issuer/subject fields I could look up which certificates "claimed" to be the signer of the certificate and then using the signature I could filter out which ones actually were. You can us
Read more

S3 boto3 'StreamingBody' object has no attribute 'tell'

-
I was recently trying to work with the python package warcio  and feeding an s3 object from the common crawl bucket directly into it. r = s3.get_object(Key='crawl-data/file....', Bucket='commoncrawl') for record in ArchiveIterator(r['Body']):     pass However, this fails with the error: self.offset = self.fh.tell() AttributeError: 'StreamingBody' object has no attribute 'tell' The reason is that boto3 s3 objects don't support tell . It's easily fixable by creating a tiny class: class S3ObjectWithTell:     def __init__(self, s3object):         self.s3object = s3object         self.offset = 0     def read(self, amount=None):         result = self.s3object.read(amount)         self.offset += len(result)         return result     def close(self):         self.s3object.close()     def tell(self):         return self.offset You can now use this class and change for record in ArchiveItera
Read more

UUIDs in MySQL are really not random

-
Universally Unique Identifiers (UUIDs) are great. I love how you can tell the progress of a batch job just by looking at the current UUID. If it starts with 0... , the task is less than 1/16th done. If it starts with 7d.. , we're almost halfway there. At ff... we are nearing the end. The fact that you can tell this rests on two principles: 1) you sort your jobs by their uuid and 2) UUIDs are random, as in, distributed uniformly . However, last week, I noticed a strange thing: a clearly visible pattern in the uuid column of a database table. It should be impossible, but there it was. It looked like this: > SELECT uuid FROM example ORDER BY id; 4f95de28-0fd1-48db-ad2e-34ecd169c483 4331cb9e-1d91-11e9-be2c-45923c63e8a2 4331cc4c-1d91-11e9-be2c-45923c63e8a2 4331ccec-1d91-11e9-be2c-45923c63e8a2 4331cd7e-1d91-11e9-be2c-45923c63e8a2 c7e2f124-f6ba-4434-843f-89958a7436ec 4331ce10-1d91-11e9-be2c-45923c63e8a2 4331ce9e-1d91-11e9-be2c-45923c63e8a2 4331cf28-1d91-11e9-be2c-45923c
Read more