Book review: The Art & Science Of JavaScript

A while ago I received a book which I had anticipated to have the chance to read: The Art & Science Of JavaScript.


First time I heard about it was when Dan Webb mentioned it in his talk at @media JavaScript and we discussed it shortly afterwards; he really made me curious about the book. While some JavaScript books, usually with one or perhaps two authors, build things from scratch where each chapter is taking a concept further to the end chapter summarizing it all, this one is completely different.

In this book each author has one chapter each, to write about widely different topics totally unrelated to each other. It doesn’t have any ambition to have one single and huge story line, but is instead basically a JavaScript goodie bag. :-)

It seems like everyone of the author has found a topic which amuses them, and just went off on respective subject. It’s a bit like:

Hey, canvas seems cool, let’s delve into that.

The authors are:

The book itself

Let’s just briefly start with some hardware talk: SitePoint create beautiful books, with nice colors, pictures and conventions to make the reading as smooth and enjoyable as possible for you, dear reader. One thing baffled me, though, and that was that for each chapter, there’s no information about who has actually written it; not in the table of contents nor at the beginning of each chapter.

The chapter contents themselves offer some clues, and knowing some of the authors, I had a pretty good grasp about who had written what, but I still find it weird.

The chapters

The book consists of seven chapters, each written by a different author, and vary from table-scripting to canvas coding and metaprogramming with JavaScript. I thought I’d briefly cover each chapter below and my take on it.

1. Fun with Tables

This chapter starts with explaining that you can access elements with document.getElementById. “Oh, man, I’m in for a long boring ride”, I thought, but it quickly evolved into some advanced scripting with table elements, such as client-side sorting and drag and drop support. Having spent way too much work with tables and their “magic” throughout the years, I generally refrain from them, and will continue to do so.

However, if you’re bound to create an advanced table for an intranet or so, this is definitely the chapter to read to get some inspiration.

2. Creating Client-side badges

Chris Heilmann was written a number of blog posts and articles about how to create and control client-side badges to present in your, or any other, web site. What I like about Chris’ writing is that unobtrusiveness and accessibility is heavily emphasized, leading to better practices and better code.

This chapter is a good introduction to implement something in the above-mentioned manner, and it also contains an explanation of how JSON can help you get content cross-domain (since that is not possible using XMLHttpRequest). It also takes failed connections to third party content providers into account, which is a simple yet important thing to take into consideration.

3. Vector Graphics with canvas

To be honest, I haven’t really had any real-world scenario where using the canvas element has been an alternative option as a solution, but it is indeed a highly interesting technology, offering vector-based coding on the client side. This chapter starts with coding simple drawing lines, and then delves into creating pie charts and assorted shapes.

What about Internet Explorer then, which doesn’t support the canvas element? The fantastic solution ExplorerCanvas, by fellow Swede Emil A Eklund (now with Google), is mentioned and it is a script which transforms your canvas code into Vector Markup Language, VML, which works in IE.

4. Debugging and Profiling with Firebug

Most likely, each and everyone of you are using Firebug (and if you aren’t, you should. Now!). This part of the book covers general debugging and profiling, and I think it had one or two things which I had overlooked. One thing bothered me, though, and that was that the author suggested to leave in the ultra-lite edition for all web browsers, just in cause you still left a console call in there somewhere.

I definitely disagree with this: either have a deploy script that removes such things, or just use your editor to find and remove such occurrences. Shipping something with superfluous code is just a case of patching, instead of fixing the actual problem.

5. Metaprogramming with JavaScript

This chapter is golden. Dan Webb is da man! What he does here is brilliant, and he completely breaks down JavaScript and explains how it actually works. How to check what an object consists of, what an object actually is and using closures to get proper contexts to work in.

And by doing all of this, he reveals how truly powerful JavaScript is, and how you can use what some consider to be its shortcomings to instead create truly marvelous things. Such a thing as self-learning code is great, and it will make your code run considerably faster.

It does turn into a little Prototype-pimping at the end, but it’s ok, since it still is on topic with the nature of the chapter, and it’s actually show-casing how it all could be used in larger real-world situations.

6. Building a 3D Maze with CSS and JavaScript

To start with, this chapter is most likely something that you will never ever have to consider. That being said, it is mightily impressive how James is building a 3D maze game with just JavaScript and CSS. I thought he’d resort to canvas and some heavy scripting to tweak vectors, but this is just CSS.

What he does is using how borders are rendered in web browsers, and completely adapts them to create paths and corridors. Doing things like this sincerely shows that the sky is (perhaps) the limit.

7. Flickr and Google Maps mashups

In the concluding chapter of the book, Simon offers a basic introduction of creating nice widgets with Google Maps and Flickr. It kind of revisits the concepts in the Client-side Badge chapter with getting external content through JSON, but I believe people who have, for instance, never created something with Google Maps will appreciate this explanation of how to start out with it.

Something slightly disappointing, though, is that he occasionally uses inline styling and events on HTML elements. Maybe it’s just to show how something can be achieved, but as we ll know, people copy-and-paste code, meaning that it will spread like wildfire. Another thing is that his usage of filter in the CSS for Internet Explorer is the old version of having filters in IE 4-5.0, where there’s a much more improved, performance-wise, option since IE 5.5.

However, all in all, it is a nice chapter going through the steps necessary to create a compelling presentation of maps and pictures together; two of my favorite things!


Usually when I have read a book, I give it away, since I want to spread the knowledge, and that it is, most of the times, not of much use to me anymore. However, with this one it’s hard: this book is a keeper! If, for no other reason, to dig down into Dan’s excellent chapter when I feel I have to exercise the cogs in my brain. :-)

If you want something to read, that will show and introduce you to concepts you’re not normally getting in contact with in your everyday lives, this is definitely a recommended read!

Posted in Developing,JavaScript,Reviews/tests,Technology |

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>