Discussion

The Art of Minimalism shown at HN

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.

14 points tzury 15 years ago 3 comments

Discussion

Live from the official Hacker News API

A modern reader for Hacker News · SvelteKit + Skeleton