The Art of Minimalism shown at HN

https://news.ycombinator.com/item?id=3307013
by tzury • 15 years ago
14 3 15 years ago

The following lines are the entire JS stack HN is using to handle user votes. That includes DOM traversing, Event Handling and even AJAX-like posting without XHR.

In fact, these 18 lines are the only JavaScript code in the entire HN site.

    function byId(id) {
      return document.getElementById(id);
    }

    function vote(node) {
      var v = node.id.split(/_/);   // {'up', '123'}
      var item = v[1]; 

      // hide arrows
      byId('up_'   + item).style.visibility = 'hidden';
      byId('down_' + item).style.visibility = 'hidden';

      // ping server
      var ping = new Image();
      ping.src = node.href;

      return false; // cancel browser nav
    } 

If I was assigned to a task of building a social site like this one, in other words, reddit/digg/hn clone, perhaps site was serving jQuery, JQueryUI, backbone and underscore combined into a minified file, all in all to have a "nice and elegant cross browser MVC model which let users vote up/down/flag posts and updating the UI asynchronously".

Now, do not get me wrong, I am not anti modernism or fancy/slick UI. I do want my products to produce a polished and smooth experience, yet, we can learn a lot from this, as we aim to build something people want, release early, and often, etc.

Related Stories

Loading related stories...

Source preview

news.ycombinator.com