Wednesday, June 22, 2011

Node.js and reckless console.log() statements

I've seen code that over uses, nah rather abuses the logger. Many times teams use it in the wrong way or sometimes over use it and then struggle to improve performance. This simple test will show the effect.

From the synopsis of Node.js doc, this is my server code:

var http = require('http');
http.createServer(function (request, response) {
    response.writeHead(200, {'Content-Type': 'text/plain'});
    response.end('Hello World\n');
}).listen(8124);
console.log('Server running at http://127.0.0.1:8124/');

Now I use JMeter to test the performance. I fire a 1000 HTTP requests within a time frame of 2s, with a wait of 1ms duration in between each new request. In my environment the median response time was 2ms for each request.

Now I add a single console log statement for the callback function in the above server code.

var http = require('http');
http.createServer(function (request, response) {
    response.writeHead(200, {'Content-Type': 'text/plain'});
    response.end('Hello World\n');
    console.log('response sent');
}).listen(8124);
console.log('Server running at http://127.0.0.1:8124/');

I repeat the same JMeter test, but this time the median response time has jumped to 315ms for each request. Food for thought ? :)

Friday, June 17, 2011

parseInt() galore

After the Falsy post, here is another interesting table listing various values as evaluated by parseInt(). Some are quirky indeed :)

Free lunch to anyone who shows me another table that covers parseInt() in such detail :P

ExpressionValueRemarks
parseInt("23")23
parseInt(" 23")23Leading white space is dropped
parseInt("-23")-23
parseInt(23)23
parseInt(023)19Radix 8 is used
parseInt(0x23)35Radix 16 is used
parseInt("23",4)11Radix 4 is used
parseInt("23",4.99)11Radix is always converted to int32
parseInt("23",36)75Radix 36 is used
parseInt("z",36)35Radix 36 is used
parseInt("23",37)NaNMax Radix is 36
parseInt("23",1)NaNMin Radix is 2
parseInt("23",0)23Radix used is 10
parseInt("23",-1)NaNMin Radix is 2
parseInt("23",3)2Radix 3 can use only 0,1,2
parseInt("023")19Radix defaults to 8
parseInt("0x23")35Radix defaults to 16
parseInt("023",5)13Radix used is 5
parseInt("0x23",5)0Radix used is 5
parseInt(023,5)1023 is a base 8 number, i.e. 19
parseInt(0x23,5)30x23 is a base 16 number, i.e. 35
parseInt(1e2)1001e2 is computed first
parseInt("1e2")1e is not a valid digit
parseInt("1e2",15)4371e2 is a valid base 15 number
parseInt("")NaN
parseInt()NaN
parseInt(null)NaN
parseInt(NaN)NaN
parseInt(undefined)NaN
parseInt(true)NaN
parseInt(false)NaN
parseInt("x23")NaN
parseInt("1234567890123456")1234567890123456
parseInt("12345678901234567")12345678901234568Approximation after 16 digits
parseInt("123456789012345678")1234567890123456800 is replaced after 17 digits
parseInt("123456789012345678901")123456789012345680000
parseInt("1234567890123456789012")1.2345678901234568e+21We go exponential now

Friday, June 10, 2011

Compress your HTML files

Updated: 2012-02-24


This is probably what every web developer knows. A very basic performance improvement for your HTML pages. You should remove all the white spaces and line breaks before you publish your html page. You can view the effect directly in a DOM inspector and this post touches the same.

Consider this example available from the HTML5 spec (pg 21):

<!DOCTYPE html>
<html>
  <head>
    <title>Sample page</title>
  </head>
  <body>
    <h1>Sample page</h1>
    <p>This is a <a href="demo.html">simple</a> sample.</p>
    <!-- this is a comment -->
  </body>
</html>


Save it in a .html file and open in your favorite browser. Next view the DOM created by this file. You can use the DOM inspector available in most of the browsers today (launch with CTRL + SHIFT + I). You will see the below DOM tree created:

DOM Tree with white spaces

So a lot of extra text nodes are introduced in place of your white spaces and line breaks. So now lets strip the html off all the white spaces, comments and line breaks. Your html will look like this:

<!DOCTYPE html><html><head><title>Sample page</title></head><body><h1>Sample page</h1><p>This is a <a href="demo.html">simple</a> sample.</p></body></html>

Reload the page and view the DOM structure using the DOM Inspector. You will see:

DOM Tree without white spaces

Notice the difference? The DOM tree created has lesser elements. Serving the page is also faster.

Develop readable code, with all the best practices proper indentation, line breaks etc. But do strip the html page before you publish, its much smaller and faster this way. Same applies for your CSS and JS files.

Wednesday, June 1, 2011

Sync Chrome versions and Chrome Extensions that I love

I just decided to live a little more on the edge and downloaded the Google Chrome Canary build, v13.0.x which is the developer build. But be warned, it could cause crashes though I've not faced any so far. Flash does seem to misbehave a bit ummm. Page loads are now definitely fast. Or do they seem fast to me :)

Meanwhile, between various versions of Chrome, one just needs to enable sync to automatically update bookmarks, extensions .. Its easily done as follows:

Click on the Wench icon on the top right and select Options->Personal Stuff
Click on Set up Sync...
Enter your Google user name and password when prompted.
You will be asked to Choose what to sync
Select the options you prefer. I checked them all.
Click on Ok and thats that.

Repeat this on your new browser version and you should have all the settings, apps, extensions, themes, bookmarks everything imported, rather synced.

Now here is the list of Chrome Extensions that I like and regularly use (no Orkut or Facebook here :P )


  • Silver Bird - Twitter client that shows notifications and highlights unread tweets
  • Too Many Tabs - Easily find out which all tabs are open, I tend to get lost in multiple tabs (30+)
  • Ad Block - Just block those annoying ads
  • RSS Extension by Google - this is shown in the address bar if a site has a feed and click to subscribe
  • Google Tasks - For my TO DO list, you can create multiple lists
  • Google Translate - For that Russian blog I subscribe to :)
  • Google Calendar - Manage your appointments
  • Google Slideshow - Create slideshow from your images, from picasa, flickr, etc
  • Picnik Editor - Edit your images online
  • Dictionary - Grow that vocab
  • ScreenCapture - Grab the current tab as an image
  • PDF/Powerpoint Viewer - Stay in browser and view that PDF or Powerpoint document
  • Share - Share the current webpage directly to your social network/email
  • Blog this - Blog about the current webpage
  • Google URL shortner - Shorten those URLs
  • Download Assistant - Download files using popular download managers
  • Stylebot - You can directly view the entire style sheet, dynamically modify attributes, block elements, reload the same page faster next time as the whole thing is cached.
  • Amazon Wish List - Add books directly to your wish list with one click - I keep buying them

And a few Google Bookmarklets like Bookmark and Map this that are directly available on my bookmark bar.

And in spite of all these installed, I see my Chrome browser loading pages quite fast. Memory consumption is a big on the higher side, but that is to be expected, but not blocking in any way.

Hope you found this useful. Do shoot me a mail or drop in a comment if you have any additional suggestions for those handy extensions. I just love em ...