TypeScript

TypeScript

TypeScript was created after JavaScript, but TypeScript is the parent of JavaScript. It is a little confusing, but it is similar to the what family members do in Kentucky, date their cousins.

TypeScript made JavaScript fun again (and better?). JS has been around for awhile, and it has taken some twists and turns to get to where it is today. JS and PHP have been battle tested and have emerged with a few bruises but have been victorious.

Anders Hejlsberg at Microsoft is a pretty smart dude. He was the lead architect for the team creating C#. He was also a core developer on the TypeScript project. I really like it for the fact that TypeScript adds optional class based object oriented programming to JavaScript.

There is also something called jQuery, and you’ve probably heard of it. It is a nice JavaScript library and one that I use frequently. It is rather simple to use and can speed up development time, but it can also be slower than “vanilla” JavaScript. jQuery is also extensively tested across the popular browsers, which is important.

Benefits

  • Object Oriented
  • ES6 (ECMAScript 6) support
  • Type-Checking
  • Client-side or Server-side apps
  • And more

Example

Below is some TypeScript that allows you to hide/show a specified element by a selector. TypeScript is then compiled into plain JavaScript. You can even change the compile options target to ES6.

TypeScript input


JavaScript output


Usage


jQuery Equivalent

It is simpler to do the same thing with jQuery, but is it better? The answer to that question is something you will need to decide. With jQuery, all you have to do is reference it in a script tag and then you have a whole bunch of functionality. Since jQuery has been around for awhile, it has been tested and enhanced. This allows you to use it and worry a little less about browser compatibility.

Example

The TypeScript/JavaScript example usage was modeled like the jQuery library. The code below is how you would do the same thing with jQuery.


Conclusion

I ran some tests even though I already knew plain JavaScript would be faster than jQuery. I then found out my tests on jsperf.com weren’t getting saved so I created my own test system. While creating my own test system, I learned a few things that I’ll share in another blog post. I put out a request on the internet for people to run the test for me, and I got a nice response. I didn’t record whether they were on a computer or using their phone. I only recorded the operations per second for each test. As I thought, JavaScript is faster than jQuery.

The test was run a total of 113 times. jQuery averaged 7045.635667 operations per second, and JavaScript averaged 169038.6408 operations per second. JavaScript is roughly 23.99196451 times faster than jQuery according to the results of this test.