Unicode JavaScript Variables and Functions

By  on  

We all get a kick out of unicode symbols, as we all saw in my Unicode CSS Classes post, and just as we can use them for CSS classes, we can use them for JavaScript variables and functions as well!  Let's say you want to shave a few bytes of post-minified JavaScript byes by setting false equal to a variable.  Why not do so by using a unicode variable?

var ಠ_ಠ = false;

if(someVar === ಠ_ಠ) { // If someVar is false...
	// ...
}

Hilarious.  The evil eyes signal a negative result.  What about saving a few byes on true?  The Beatles once said that "All You Need is Love", so let's use a heart:

var ❤ = true;

if(someVar === ❤) {
	// ...
}

You can do the same with function names.  Functions can be named after unicode symbols:

function ಠ(arg) {
	// ...
}

Of course all of this is a bit ... insane, and you should never use unicode symbols, but nonetheless it's possible.  Imagine starting a new job and seeing those symbols as meaningful variables -- you'd quit immediately!  Hilarious!

Recent Features

  • By
    6 Things You Didn’t Know About Firefox OS

    Firefox OS is all over the tech news and for good reason:  Mozilla's finally given web developers the platform that they need to create apps the way they've been creating them for years -- with CSS, HTML, and JavaScript.  Firefox OS has been rapidly improving...

  • By
    Responsive and Infinitely Scalable JS Animations

    Back in late 2012 it was not easy to find open source projects using requestAnimationFrame() - this is the hook that allows Javascript code to synchronize with a web browser's native paint loop. Animations using this method can run at 60 fps and deliver fantastic...

Incredible Demos

  • By
    Image Reflections with CSS

    Image reflection is a great way to subtly spice up an image.  The first method of creating these reflections was baking them right into the images themselves.  Within the past few years, we've introduced JavaScript strategies and CANVAS alternatives to achieve image reflections without...

  • By
    HTML5’s placeholder Attribute

    HTML5 has introduced many features to the browser;  some HTML-based, some in the form of JavaScript APIs, but all of them useful.  One of my favorites if the introduction of the placeholder attribute to INPUT elements.  The placeholder attribute shows text in a field until the...

Discussion

  1. I could see this improving minification when processing files with many variables/methods in the same scope (if they don’t use it already, I’m not sure).

  2. Unicode characters are useless for minification, each unicode character uses 2 bytes instead of 1 in utf8. Also, there is no reason not to use unicode in variable names if you properly declare encoding in your html.

    • Actually, some characters take up to 4 bytes, not just 2. The Kannada letter TTHA in the example rakes 3 bytes for example, so “false” was minified from 5 bytes to 7 :P

  3. lol, it’s a funny joke. but I think it may be realize if some protocol is developed in the future. so cool!

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!