TypeScript performance (asm.js, closure compiler) and overhead

m_vdbeek picture m_vdbeek · Dec 29, 2013 · Viewed 19.9k times · Source

I'm looking into using TypeScript combined with a client-side MVC (most likely Backbone.js + Marionette.js or Ember.js) for future projects and therefor have a few questions related to performance and optimisation :

  • How does TypeScript output compare to native JavaScript performance wise ?

  • Since asm.js is a subset of JavaScript, would it be possible to convert TypeScript code into asm.js code ? If yes, is it already possible ?

  • Is it possible and still useful to create builds of AMD projects that use TypeScript with Google Closure compiler ?

  • How much overhead does TypeScript add on average, file-size wise ?

  • When using lightweight libraries like Backbone.js in a small project for example. Does it make sense to use TypeScript in regards to file size ?

I like the added benefits of TypeScript but I don't want to sacrifice performance for coding style and typing.

Any articles / books about using TypeScript in big projects, especially related to performance, optimisations and builds are very welcome !

Thank you in advance !

Answer

jJ' picture jJ' · Dec 29, 2013

We evaluated and tested TypeScript thoroughly in our team and other teams use it already, so here is my experience:

  • TypeScript is a superset of JavaScript and it mostly translates 1:1 to JavaScript without any significant performance compromises, so if you know how to write efficient JavaScript, you know how to write efficient TypeScript. One of the not so efficient features is inheritance, which is "emulated" using JavaScript prototypes and produces more code than one would write normally in JavaScript. So use inheritance with caution. You can look at generated JavaScript to see whether your constructs are compiled efficiently enough for your case.
  • Compiling typescript to asm.js is the same problem as compiling JavaScript to asm.js - you would need to emulate the features asm.js lacks compared to full javascript... If you need some parts in asm.js you would probably need to write them yourself or compile from some more appropriate (less dynamic) language by emscripten and such.
  • TypeScript has some AMD support, but I cannot speak about google closure support... Since it tries to accomplish similar thing very differently (types and metainfo in comments instead in a new syntax), I do not think that they are very compatible to use maximum of both...
  • File size is not really an issue, it is very similar to file size of a readable JavaScript, unless you use inheritance a lot
  • Using TypeScript with backbone and other libraries has one benefit compared to JavaScript; most popular libraries already have type definition files for TypeScript, so you get autocompletion and type checking almost for free. File size difference is not really an issue compared to well written JavaScript.

TypeScript is still quite young and many things we wanted to have (JSLint, code coverage, TDD, BDD tools, ...) were missing at the time. In addition, there were several bugs in the compiler (that have been fixed afterwards), so we did not chose to use it, but no point from your list showed as a real turn-down for us...

Update: To see the potential of TypeScript you can look at Visual Studio Online "Monaco". What they did there is pretty impressive see Getting started with TypeScript for quick intro