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!
![Welcome to My New Office]()
My first professional web development was at a small print shop where I sat in a windowless cubical all day. I suffered that boxed in environment for almost five years before I was able to find a remote job where I worked from home. The first...
![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...
![Create Keyboard Shortcuts with Mousetrap]()
Some of the finest parts of web apps are hidden in the little things. These "small details" can often add up to big, big gains. One of those small gains can be found in keyboard shortcuts. Awesome web apps like Gmail and GitHub use loads of...
![iPhone Checkboxes Using MooTools]()
One of the sweet user interface enhancements provided by Apple's iPhone is their checkbox-slider functionality. Thomas Reynolds recently released a jQuery plugin that allows you to make your checkboxes look like iPhone sliders. Here's how to implement that functionality using the beloved...
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