Building a brand

Perhaps I should be taking what I learn from work to apply it on my personal life. It’s time for a rebrand for myself. I’ll start online.

Rough plans:

  1. July: Launch
  2. August: Position this blog slightly different. It will be where I gather things I read from all around. will focus on my profession more.
  3. September: Moving resume to and identity building.
  4. October: This blog will move to top level domain.

Might go for a short vacation in between too.

How to specify xcode-select for Command Line Tools

This is more of a personal note. It happens when I am install Node.js 0.10.3. It seems like xcode-select is triggered by GYP. I get an error message like this:

I’m on a system that doesn’t have XCode installed fully and instead I just install the Command Line Tools provided by Apple.

To solve this issue, run:

[code lang=”bash”]sudo xcode-select -switch /Library/Developer/[/code]

Then you can now run:

[code lang=”bash”]./configure
sudo make install[/code]

Hope it helps!

Writing asynchronous JavaScript

This library — async.js — is excellent in writing asynchronous JavaScript. It’s one of JavaScript’s strengths and it’s only that often get really messy.

In my use case, there are a several data sets to fetch and populate into graphs. One way is to perform a for each loop and just AJAX requests to get dataset from the web server and adding it one by one. But why do that when you can do so asynchronously. Ideally, all sets of data should be downloaded at the same time and not one after another. Some data sets are larger than others and will take a longer time to complete, so we can always add the completed sets into the graph first.

With that library we can do something like:

[code language=”javascript”][‘url1′,’url2′,’url3’], getUrl, function(err, results){


I’ll write more as I explore. Really nice library if you’re looking to do more than jQuery’s Defered.

The new Nokia Lumia 1020

The new Nokia Lumia 1020 is armed with a 41 megapixel camera sensor. Amazingly high megapixel value leads to you zooming after your shot is taken. Quite a nice feature in my opinion.

NOKIA LUMIA 1020 Nothing gets this close

Zoom. Reinvented.

Nokia Pro Camera on the Nokia Lumia 1020 lets you shoot in super high resolution, which means you can zoom in close to your shot after you’ve taken it. Then rotate, reframe, crop and share new images as many times as you want.

I just wonder if the new Nokia Lumia 1020 is fast enough when taking shots.

What’s hot in JavaScript today

What’s really hot in JavaScript these days? Glad you asked. Okay, I asked.


A package manager for the web, created at Twitter. Bower has helped me managed by JavaScript libraries better. One good side effect that came out of it is that it kinda prevents developers from altering the libraries. Remember those times where you upgrade a library and then realized your library is somehow a custom build version? This get detected much earlier because each we check out code from the SVN repository we also do a fresh install of components in bower_components.

More information at


Taking advantage of cool new web technologies is great fun, until you have to support browsers that lag behind. Modernizr makes it easy for you to write conditional JavaScript and CSS to handle each situation, whether a browser supports a feature or not.

More information at Modernizr.


D3.js is a JavaScript library for manipulating documents based on data. D3 helps you bring data to life using HTML, SVG and CSS. D3’s emphasis on web standards gives you the full capabilities of modern browsers without tying yourself to a proprietary framework, combining powerful visualization components and a data-driven approach to DOM manipulation.

More information at D3.


jQuery isn’t new but it still is really popular. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers.

More information at jQuery.


Mocha is a feature-rich JavaScript test framework running on node and the browser, making asynchronous testing simple and fun. Mocha is easily my test suite of choice. I’ll write more about Mocha is there’s more interest.

More information at jQuery.


Lodash is a drop-in replacement for Underscore.js, from the devs behind, that delivers performance improvements, bug fixes, and additional features. It adds some additional functions too. Their collection tools are more comprehensive than Underscore.js’s. Currently it is at version 1.3.1.

More information at Lodash.


Something is really paradigm shifting is Angular.js. AngularJS lets you extend HTML vocabulary for your application. The resulting environment is extraordinarily expressive, readable, and quick to develop. However I find it hard to integrate this into existing work. It’s probably great for new projects though! I use Backbone.js and Marionette combination for most of my JavaScript works.

More information at Angular.

Shortcuts for query selections and getComputedStyle

Here are some shortcuts for query selector, query selector all as well as getComputedStyle. These are helpful when you don’t have tools such as jQuery. During my JavaScript development work at Tremor Video, I have instances where I need to manipulate the DOM really quickly and it is better to rely on vanilla JavaScript for these rather than to call a library for this.

The caveat is that query selector and query selector all is only supported by Internet Explorer 8 and above. For getComputedStyle, it is not available for IE8 unless you have a shim. I use the getComputedStyle in Aight to provide for IE8. Firefox and Chrome aren’t affected by these.

Have fun, hope it’s helpful to you as it is to me.

The better utility belt Lodash

We switched from Underscore.js to Lodash compatibility mode and never been happier. (I’m a Web UI Developer situated in Singapore.)

Lodash is a drop-in replacement for Underscore.js, from the devs behind, that delivers performance improvements, bug fixes, and additional features.

It adds some additional functions too. Their collection tools are more comprehensive than Underscore.js’s. I had some issues doing a _.where through a mix of array and objects during web JavaScript programming. Lodash was the answer for it.

JSON.stringify then JSON.parse

I realized we keep doing JSON stringify then eventually parsing it back again and again to copy over objects. This does a dump “clone”, it ignores references and functions but is really fast. I wrote a Underscore.js or Lodash mixin just to do this.

[code lang=”javascript”]
* This is the shortcut for JSON.stringify then parsing it back.
* Quick access to simple object copying.
* It does not copy functions!
* @author KahWee Teng
* @return {Object} Lodash mixin object.
_.mixin((function() {
"use strict";
return {
copy: function(object) {
return JSON.parse(JSON.stringify(object));

There’s just so many ways to doing a clone but this is by far the fastest but then again it depends on your needs. Dump clone I call this.

Review: Learning Raphaël JS Vector Graphics

I’ve been reading on JavaScript library — Raphaël — on the weekends. I work for a advertising analytics company working on web user interfaces so I got interested in data visualization in the process.

The key take away from this book is to create vector graphics and data visualizations in your browser using Raphael.js.

Raphael is a API that provides an excellent abstration over SVG. It allows you to add animation and interactivity to your web applications.

To learn more, there’s a good book by Packt Publishing — Learning Raphaël JS Vector Graphics which is written by Damian Dawber.

Learning Raphaël JS Vector Graphics

The book contains a good introduction to Raphael. It goes on to cover quite a bit on SVG and paths as well. The fourth chapter, Transformation and Event Handling gave good insights to prepare you for animations in the next chapter. The book eventually leads you to create an social media visualization.

If you’re interested in learning more about Raphael, check out the book from Packt.