Shaving Bytes with JavaScript Booleans
Developers are always search for ultimate way to create something with the least amount of code. This, of course, is one of the reasons we use minifiers: to serve code as small as possible. Of course this practice has numerous benefits, like faster download time, less storage consumption, etc. One way that minifiers are able to shave bytes off of JavaScript code is changing the way booleans are used.
true === !0 // Save 2 chars
false === !1 // Save 3 chars
A few bytes of every true and false go away with the ! evaluation. If you set one-letter variables names to those values, you may end up saving more. Keep in mind I'm not telling you to do this in your source code -- minifiers like Uglify JS will do this for you. Just something neat to know about though!
![Introducing MooTools Templated]()
One major problem with creating UI components with the MooTools JavaScript framework is that there isn't a great way of allowing customization of template and ease of node creation. As of today, there are two ways of creating:
new Element Madness
The first way to create UI-driven...
![Conquering Impostor Syndrome]()
Two years ago I documented my struggles with Imposter Syndrome and the response was immense. I received messages of support and commiseration from new web developers, veteran engineers, and even persons of all experience levels in other professions. I've even caught myself reading the post...
![Create a Simple News Scroller Using MooTools, Part I: The Basics]()
News scroller have been around forever on the internet. Why? Because they're usually classy and effective. Over the next few weeks, we'll be taking a simple scroller and making it into a flexible, portable class. We have to crawl before we...
![MooTools Wall Plugin]()
One of the more impressive MooTools plugins to hit the Forge recently was The Wall by Marco Dell'Anna. The Wall creates an endless grid of elements which can be grabbed and dragged, fading in elements as they are encountered. Let me show...
Cool :-)
Glad you aren’t advocating coding like this directly. Can’t beat true/false for readability.
Coercions like
NumbertoBooleandoesn’t affect performance?Maybe too simple of a test: http://jsperf.com/bool-num-test
Looks like using
!0and!1may be faster (in Chrome 35) but only marginally.Even if that’s true, and it’s not due to some statistical error, the gain is so small it’s not really worth it.
Those are noops anyway. I would be surprised if the JS engine just optimise them away at compile time.
didn’t just*
Still prefer true/false for readability. As you said, it is better to let the Minifier to do this for us. It is better to keep the true/false in our code.
I expect the gain to be lost as soon as the file gets gzipped. I am wrong?
You should also remember the bitwise operations like
!~number, that returns true only for -1