4 ms·
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.
- abcd_f 15y agoOn the other hand the HTML markup is not that minimalistic at all. A bit of CSS would've gone a long way in lightening it up.
- irrumator 15y agoHardly, there is a lot of arc that you are not seeing that really powers the voting and other features of the site like spam detection and voting ring detection. It's similar to the code at http://ycombinator.com/arc/arc3.tar http://ycombinator.com/arc/arc3.tar but there are significant modifications as well.
- tzury 15y agoThat's true, surely, work is done at server side. I loved the really thin client we are observing in here.