Let's talk JS ⚡: performance

Hello there 😉

I’m honored to welcome you - nice reader of this post - in the first part of the first article series on this blog called ”Let’s talk JS” in which I’ll discuss some general programming-language specific features of my favorite - JS. Without further ado - let’s begin!

A bit of theory 📚

JavaScript (as you may know or not) has been a solely interpreted language for many years mainly because it was designed to be so. It was just easier for JS to be interpreted than compiled cause its goal was to be portable and cross-platform. As the time went on and Web was becoming more and more popular, more performance was demanded from slow JS. That’s why browsers started to implement JIT compilers in order to improve its speed. And oh man, these are fast!

via GIPHY

Even with these improvements ( JS has become faster more than 10x its old implementations) JavaScript still isn’t as fast as C or other compiled language, but definitely is one of the fastest interpreted languages!

I want more…

via GIPHY

And more you’ll get my friend with JS engines ( especially V8 ) getting faster and more feature-full. The demand for performant JS code is now bigger than ever. Sadly, JS can get just as good as it’s possible, so ( for an interpreted language ) not that much more. That’s why new web-development tools like WebAssembly (WASM) are becoming more and more popular. You can read more about WASM in my other article and around the internet. Anyway, for now constant, positive growth in the performance of JS can be observed with a smile on the face of every JS programmer.

So, where are we now?

Well, I’m glad you’ve asked ( or not ). There are some benchmarks available on the internet and I think they’re worth exploring. The first one on GitHub places JavaScript more or less in the middle of the list - not bad, right? On the other hand, when comparing with C++, we see that there’s a pretty big gap between the two but even so still not as bad as some interpreted languages. So, where are we now? I can say in the middle. JavaScript has already beaten most of the interpreted language ( LuaJIT is an exceptional exception ) and is now taking on slower compiled languages ( and LuaJIT ). Good, good! 😁

Advise

Of course, besides the implementation, important for performance is the quality of the written code. So, how to write code that can be well-optimized by V8’s JIT compiler ( yes, only well written and a repetitive code is JIT-compiled for better performance ) Keep in mind that I’m not talking about such aspects of the language as web APIs and DOM operations - only bare code execution.

via GIPHY

Let’s KISS it!

Minify / optimize your files with tools like Uglify.js ( obviously );
Animate using requestAnimationFrame;
Preallocate & initialize arrays with Array.from() whenever possible;
Reuse instances & object whenever possible without any costly performance changes;
Avoid binding functions with Function.bind() - use Function.call() or ( in ES6 ) arrow functions;
Assign undefined rather than using delete whenever possible;
Avoid type convertion.
In if/else and switch keep most common condition first;
Avoid accessing variables outside of the scope whenever possible;
Use for instead of while loops whenever possible;
Use ASM.js if you want
Use WebWorkers for computation-heavy operations;
Do not over optimize!
Just KISS your code 😘

So, there you have it - list of the most general optimization tips for JS. Even if some are obvious, some can be not as much and some can be just forgotten.

That’s it!

via GIPHY

Thanks for reading till the end of this post. If you liked it - consider sharing this performant article ⚡ with others on Twitter or sharing your thoughts below. Have a nice day/night!