Dare to Dream? » Technology http://www.makuchaku.in/blog Good judgment comes from experience; Experience comes from bad judgment. Sun, 02 Oct 2011 19:29:26 +0000 en hourly 1 http://wordpress.org/?v=3.2.1 Simple MapReduce with Javascript http://www.makuchaku.in/blog/simple-mapreduce-with-javascript http://www.makuchaku.in/blog/simple-mapreduce-with-javascript#comments Sun, 08 May 2011 06:40:20 +0000 Mayank Jain (makuchaku) http://www.makuchaku.in/blog/?p=1057
  • Kickass MCV for your Javascript Apps Very recently, I had an opportunity to work on a...
    • Related posts brought to you by Yet Another Related Posts Plugin.]]>

    The best way to understand MapReduce is to actually see & feel it in action. Following is the simplest possible example I could cook… (Gist link)

    1.  
    2. var Job = {
    3.  
    4.   data : [
    5.           "We are glad to see you here. This site is dedicated to",
    6.           "poetry and to the people who make poetry possible",
    7.           "poets and their readers. FamousPoetsAndPoems.com is",
    8.           "a free poetry site. On our site you can find a large",
    9.           "collection of poems and quotes from over 631 poets",
    10.           "Read and Enjoy Poetry",
    11.           "I, too, sing America",
    12.           "I am the darker brother",
    13.           "They send me to eat in the kitchen",
    14.           "When company comes",
    15.           "But I laugh",
    16.           "And eat well",
    17.           "And grow strong",
    18.           "Tomorrow",
    19.           "Ill be at the table",
    20.           "When company comes",
    21.           "Nobodyll dare",
    22.           "Say to me",
    23.           "Eat in the kitchen",
    24.           "Then",
    25.           "Besides",
    26.           "Theyll see how beautiful I am",
    27.           "And be ashamed",
    28.           "I, too, am America"
    29.         ],
    30.        
    31.  
    32.   map : function(line) {
    33.     var splits = line.split(" ");
    34.     var temp = [];
    35.     for(var i=0; i<splits .length; i++)
    36.     {
    37.       temp.push({key : splits[i], value : 1});
    38.     }
    39.     return temp;
    40.   },
    41.  
    42.  
    43.   reduce : function(allSteps) {
    44.     var result = {};
    45.     for(var i=0; i<allSteps.length; i++)
    46.     {
    47.       var step = allSteps[i];
    48.       result[step.key] = result[step.key] ? (result[step.key] + 1) : 1;
    49.     }
    50.     return result;
    51.   },
    52.  
    53.  
    54.   init : function() {
    55.     var allSteps = [];
    56.     for(var i=0; i<Job.data.length; i++)
    57.       allSteps = allSteps.concat(Job.map(Job.data[i]));
    58.      
    59.     var result = Job.reduce(allSteps)
    60.     console.log(JSON.stringify(result));
    61.   }
    62.  
    63. }; // Job
    64.  
    65.  
    66. Job.init();
    67.  

    Copy & paste this code in your browser’s JS console.

    Console output…

    1.  
    2. {"631":1,"We":1,"are":1,"glad":1,"to":5,"see":2,"you":2,"here.":1,"This":1,"site":2,"is":2,"dedicated":1,"poetry":3,"and":4,"the":5,"people":1,"who":1,"make":1,"possible":1,"poets":2,"their":1,"readers.":1,"FamousPoetsAndPoems.com":1,"a":2,"free":1,"site.":1,"On":1,"our":1,"can":1,"find":1,"large":1,"collection":1,"of":1,"poems":1,"quotes":1,"from":1,"over":1,"Read":1,"Enjoy":1,"Poetry":1,"I,":2,"too,":2,"sing":1,"America":2,"I":3,"am":3,"darker":1,"brother":1,"They":1,"send":1,"me":2,"eat":2,"in":2,"kitchen":2,"When":2,"company":2,"comes":2,"But":1,"laugh":1,"And":3,"well":1,"grow":1,"strong":1,"Tomorrow":1,"Ill":1,"be":2,"at":1,"table":1,"Nobodyll":1,"dare":1,"Say":1,"Eat":1,"Then":1,"Besides":1,"Theyll":1,"how":1,"beautiful":1,"ashamed":1}
    3.  

    Related posts:

    1. Kickass MCV for your Javascript Apps Very recently, I had an opportunity to work on a...

    Related posts brought to you by Yet Another Related Posts Plugin.

    ]]>     http://www.makuchaku.in/blog/simple-mapreduce-with-javascript/feed 2     Why jQuery.proxy rocks my world! http://www.makuchaku.in/blog/why-jquery-proxy-rocks-my-world http://www.makuchaku.in/blog/why-jquery-proxy-rocks-my-world#comments Wed, 27 Apr 2011 08:39:08 +0000 Mayank Jain (makuchaku) http://www.makuchaku.in/blog/?p=1041
  • Kickass MCV for your Javascript Apps Very recently, I had an opportunity to work on a...
  • How to commission developer machines in an agile way? During the past year – working at AdoMado, I’ve seen myself...
    • Related posts brought to you by Yet Another Related Posts Plugin.]]>

    Its been very recent that I’m seriously looking into Javascript – and trust me, there is no dearth of stuff that can be achieved with purely client side code (HTML/CSS/JS). With the modern browsers churning out best of the breed in JS environments (both headed & headless), everything is going to come to a browser near you! Its just a matter of time!

    Anyways, on more subtle issues, while writing a purely client side JS app using Backbone.js & jQuery Mobile I came across jQuery.proxy method – something that I’ve really started using almost everywhere.. The method is so useful that sometimes I wonder – why jQuery did not implement it in callback mechanism by default.

    A quick overview about the problem…

    1. var FBNotificationWatcher = new JS.Class({
    2.  
    3.   initialize : function(timeout) {
    4.     this.url = "http://foo/return/json";
    5.     this.getNotifications(); // initiate the first fetch
    6.   },
    7.  
    8.   getNotifications : function() {
    9.     $.ajax({
    10.       // do your ajax call
    11.       url : this.url;
    12.       success : this.processNotifications
    13.     });
    14.   },
    15.  
    16.   processNotifications : function(rawNotificationData) {
    17.     // process notifications… AND
    18.     setTimeout(jQuery.proxy(this.getNotifications, this), this.timeout); // start all over again…
    19. });

    When a new object of FBNotificationWatcher is created, all goes well. this.getNotifications gets the JSON & this.processNotifications processes it. However, when setTimeout’s occurs and this.getNotifications is called again, the context of “this” is set to the “window” object. And because of this, the code breaks in this.getNotifications method.

    Now this is very frustrating – as you just lost the object you were operating within.

    Solution? jQuery.proxy comes to rescue!

    1.  processNotifications : function(rawNotificationData) {
    2.     // process notifications…
    3.  
    4.     setTimeout(jQuery.proxy(this.getNotifications, this), this.timeout); // start all over again…
    5.   }

    If we setup the setTimeout call like this, jQuery will guarantee that the context of “this” when this.getNotifications gets executed, will always be set to the original FBNotificationWatcher object which had setup the timer. The second argument to jQuery.proxy defines the context you want to get back when the setTimeout callback gets executed.

    This concept can be used anywhere you want your callbacks to retain their context.

    Read more about the method at jQuery API docs.

    Related posts:

    1. Kickass MCV for your Javascript Apps Very recently, I had an opportunity to work on a...
    2. How to commission developer machines in an agile way? During the past year – working at AdoMado, I’ve seen myself...

    Related posts brought to you by Yet Another Related Posts Plugin.

    ]]>     http://www.makuchaku.in/blog/why-jquery-proxy-rocks-my-world/feed 14     Faster HTML and CSS – My Learnings! http://www.makuchaku.in/blog/faster-html-and-css-my-learnings http://www.makuchaku.in/blog/faster-html-and-css-my-learnings#comments Thu, 12 Aug 2010 15:33:37 +0000 Mayank Jain (makuchaku) http://www.makuchaku.in/blog/?p=955 Yet Another Related Posts Plugin.]]>


    Faster HTML and CSS: Layout Engine Internals for Web Developers     (@GoogleTechTalks)

    I think I never cared about these – but the way David Baron from Mozilla describes these, I think I will now.
    The points he was making started seeming so crucial that I jotted them down as if taking notes – something I never did with previous videos.

    The things which I picked up from this video are…

    From fetching the DOM over the wire to displaying it, following steps take place in order…
    (1) Compute => (2) Compute Style => (3) Construct the DOM frame => (4) Layout => (5) Paint

    The further Left (towards (1)) you push the browser’s rendering engine via your DOM/JS/CSS, the slower the browser would get.

    Hence…

    Use as specific CSS tags as possible. The more generic tag, the higher performance hit while searching the DOM. For example, a “#some-id {}” is way way faster than “body > div p {}” – as in the second tag, a larger portion of DOM is parsed to check which elements are affected by the selector. You push the browser to start from stage (2).

    “:hover” style hits the browser pretty badly – as it pushes the browser back to stage (2). Coupled with the above mentioned CSS selectors problem, it can lead to real slow computation. Use it with CSS selectors which are very very specific in nature.

    Programmatic scrolling of tags (some of which might have overflow property) via javascript – as that does not causes re-computation of style (stage 2). While if you do it with CSS magic, you push your browser back to stage (2).

    Mozilla’s rendering tree, while building itself – does not takes any element with with CSS property “display:none” into account – it just skips it. So when this property is flipped, it triggers a full re-computation of the tree – which is expensive. However if we use the style “visibility:hidden” – the rendering tree picks up the related element while building itself. Hence when visibility is flipped, its much faster as there is no re-calculation of the rendering tree.

    An old one – when javascripts are being downloaded, the browser stops itself from any other processing and waits for the script to download and execute (as script can modify the DOM anyhow it likes). During this time, the precious time is lost – which could have been used in downloading other content – like images, DOM, CSS, etc. Hence – keep the javascripts as further in the DOM as possible. Use caching is possible.

    Learn more about speeding up your website at – Yahoo’s best practices (YSlow stuff) – some of which we regularly follow at AdoMado.com

    No related posts.

    Related posts brought to you by Yet Another Related Posts Plugin.

    ]]>     http://www.makuchaku.in/blog/faster-html-and-css-my-learnings/feed 1     An IDE which suggests best code practices, shows a diff and lets you selectively apply… http://www.makuchaku.in/blog/an-ide-which-suggests-best-code-practices-shows-a-diff-and-lets-you-selectively-apply http://www.makuchaku.in/blog/an-ide-which-suggests-best-code-practices-shows-a-diff-and-lets-you-selectively-apply#comments Mon, 19 Oct 2009 08:28:08 +0000 Mayank Jain (makuchaku) http://www.makuchaku.in/blog/?p=801 Yet Another Related Posts Plugin.]]>

    NetBeans code modification suggestion

    NetBeans code modification suggestion

    No related posts.

    Related posts brought to you by Yet Another Related Posts Plugin.

    ]]>     http://www.makuchaku.in/blog/an-ide-which-suggests-best-code-practices-shows-a-diff-and-lets-you-selectively-apply/feed 0     Speed up firefox, vacuum your firefox sqlite3 db http://www.makuchaku.in/blog/speed-up-firefox-vacuum-your-firefox-sqlite3-db http://www.makuchaku.in/blog/speed-up-firefox-vacuum-your-firefox-sqlite3-db#comments Wed, 22 Jul 2009 19:19:22 +0000 Mayank Jain (makuchaku) http://www.makuchaku.in/blog/?p=706 Yet Another Related Posts Plugin.]]>

    Firefox is agreeably slower than most other browsers (specially Google Chrome) – even on my Ubuntu.

    Here is a great tip – after deploying which, I did felt the response time for cold startup and the UrlBar get better.

    And here are the results…

    1. for file in `ls *.sqlite`
    2. do
    3.  ls -lh $file
    4.  sqlite3 $file vacuum
    5.  sqlite3 $file reindex
    6.  ls -lh $file
    7. done

    -rw-r–r– 1 makuchaku makuchaku 7.0K 2009-07-05 11:37 content-prefs.sqlite [BEFORE]
    -rw-r–r– 1 makuchaku makuchaku 7.0K 2009-07-23 00:30 content-prefs.sqlite [AFTER]

    -rw-r–r– 1 makuchaku makuchaku 553K 2009-07-23 00:25 cookies.sqlite
    -rw-r–r– 1 makuchaku makuchaku 376K 2009-07-23 00:30 cookies.sqlite

    -rw-r–r– 1 makuchaku makuchaku 97K 2009-07-23 00:15 downloads.sqlite
    -rw-r–r– 1 makuchaku makuchaku 4.0K 2009-07-23 00:30 downloads.sqlite

    -rw-r–r– 1 makuchaku makuchaku 257K 2009-07-23 00:20 formhistory.sqlite
    -rw-r–r– 1 makuchaku makuchaku 251K 2009-07-23 00:30 formhistory.sqlite

    -rw-r–r– 1 makuchaku makuchaku 2.0K 2009-07-11 13:51 permissions.sqlite
    -rw-r–r– 1 makuchaku makuchaku 2.0K 2009-07-23 00:30 permissions.sqlite

    -rw-r–r– 1 makuchaku makuchaku 18M 2009-07-23 00:26 places.sqlite
    -rw-r–r– 1 makuchaku makuchaku 12M 2009-07-23 00:30 places.sqlite

    -rw-r–r– 1 makuchaku makuchaku 2.0K 2009-06-05 21:09 search.sqlite
    -rw-r–r– 1 makuchaku makuchaku 2.0K 2009-07-23 00:30 search.sqlite

    -rw-r–r– 1 makuchaku makuchaku 11K 2008-11-04 22:02 signons.sqlite
    -rw-r–r– 1 makuchaku makuchaku 11K 2009-07-23 00:30 signons.sqlite

    -rw-r–r– 1 makuchaku makuchaku 3.0K 2009-05-31 02:03 sqlinjectionDB.sqlite
    -rw-r–r– 1 makuchaku makuchaku 3.0K 2009-07-23 00:30 sqlinjectionDB.sqlite

    -rw-r–r– 1 makuchaku makuchaku 303K 2009-07-09 23:41 ubiquity_ann.sqlite
    -rw-r–r– 1 makuchaku makuchaku 294K 2009-07-23 00:30 ubiquity_ann.sqlite

    -rw-r–r– 1 makuchaku makuchaku 2.0K 2009-07-05 11:39 ubiquity_skin_memory.sqlite
    -rw-r–r– 1 makuchaku makuchaku 2.0K 2009-07-23 00:30 ubiquity_skin_memory.sqlite

    -rw-r–r– 1 makuchaku makuchaku 2.0K 2009-07-11 10:36 ubiquity_suggestion_memory.sqlite
    -rw-r–r– 1 makuchaku makuchaku 2.0K 2009-07-23 00:30 ubiquity_suggestion_memory.sqlite

    -rw-r–r– 1 makuchaku makuchaku 287K 2008-11-23 21:09 urlclassifier2.sqlite
    -rw-r–r– 1 makuchaku makuchaku 142K 2009-07-23 00:30 urlclassifier2.sqlite

    -rw-r–r– 1 makuchaku makuchaku 19M 2009-07-23 00:28 urlclassifier3.sqlite
    -rw-r–r– 1 makuchaku makuchaku 19M 2009-07-23 00:30 urlclassifier3.sqlite

    -rw-r–r– 1 makuchaku makuchaku 2.0K 2009-06-13 00:10 webappsstore.sqlite
    -rw-r–r– 1 makuchaku makuchaku 2.0K 2009-07-23 00:30 webappsstore.sqlite

    I did not measure the cold startup time before and after the changes, but I can certainly see ff coming up more fast now. Fast enough – to make me sit and write this blog entry in the middle of coding a rails app.

    More explanation about SQLite’s VACUUM and REINDEX operations.

    Enjoy :)

    No related posts.

    Related posts brought to you by Yet Another Related Posts Plugin.

    ]]>     http://www.makuchaku.in/blog/speed-up-firefox-vacuum-your-firefox-sqlite3-db/feed 0     Startup Lunch – This Friday! http://www.makuchaku.in/blog/startup-lunch-this-friday http://www.makuchaku.in/blog/startup-lunch-this-friday#comments Tue, 01 Apr 2008 10:18:58 +0000 Mayank Jain (makuchaku) http://www.makuchaku.in/blog/startup-lunch-this-friday Yet Another Related Posts Plugin.]]>

    Ever experienced Speed Dating?

    As finding friends/partners is to Speed Dating, finding investors/future-employees is to Startup Lunch.

    Startup Lunch is an initiative on the lines of (and by) Proto.in and in concept, is very similar to speed dating.

    The startup founders are seated on one side and the candidates get to say hello and have a quick conversation to talk about what the background of the founder is, why he started the company and what sort of person he is looking for, while asking questions to the candidate about the reason to join a startup and what his/her passions are and ten minutes later the same process continues with the next founder. Within an hour, you would have met/spoken to most of the startups, and by the end of the day would know whom to get in touch with for your first/next job.

    The event, at present is organized across India – in Bangalore, Chennai, Mumbai, Delhi, Pune and Hyderabad.

    Luckily, Pune’t meet has been clubbed with Open Coffee Club Meet. More details about the startup lunch are here

    Its an unique opportunity for me – I’ve never met another budding entrepreneur in person – specially when he/she has a business plan in his/her hands. It would be awesome to see what all my peer fellas are upto. And specially important to see how ApnaBill.com is received amongst them.

    Oh yes, I’ll be giving a short intro about ApnaBill.com at the Startup Lunch. More about it later…

    Can’t really wait till Friday! Can you? :-)

    No related posts.

    Related posts brought to you by Yet Another Related Posts Plugin.

    ]]>     http://www.makuchaku.in/blog/startup-lunch-this-friday/feed 5