Show HN: Hacker News as a Primordial Soup
hackernews.life
It’s detail rich – notice immediately which stories are gaining traction, which ones are generating conversation, which ones have gone toxic
It’s fully time travelable – use the slider to go backwards and forwards in time; watch stories and comments grow, fight for rank, and die
It’s fully keyboard navigable – using just the arrow keys you can skim through stories and top level comments; hit enter at any time to visit the website or drill down further into the comments
It’s searchable and filterable – search through time by text, and filter by minimum score and comment count
It’s shareable – share a story or comment at any time on the timeline by copying and pasting the URL
It’s attention friendly – look at the same point on the screen and use the arrow keys to read headlines and top-level comments without losing your place
It’s memory friendly – at a glance, see which stories you’ve seen before, and which ones you’ve read before
It’s screen-readable – I think! I made an honest attempt to get this right but would like AT users to send me some feedback
It’s cacheable – compact historical data is reused when revisiting the website
It’s pretty – particularly for desktop users, and especially if you switch to top stories :)
It’s mobile responsive – the stories are big enough to touch on an iPhone 12 mini, but you can’t see all 500 stories at once and it doesn’t look as pretty
But it’s not energy friendly (yet) – it’s making 1000s of mismatched draw calls (I plan to drop Pixi.JS and just use my own instancing shaders—maybe next week?)
And it’s not loginable – I’m waiting with bated breath for an HN OAuth2 API to implement upvoting, favouriting, etc.
It’s served by two Elixir monolith servers. The top stories server takes ~4GiB due to the some 9000+ TLS HTTP/1 connections that need to be made – I really wish HN would move their data from Firebase to Firestore so it could take advantage of HTTP/2 multiplexing! By contrast the new stories server sits (relatively) comfortably under ~1GiB. The frontend uses Vue.js and the rendering is Pixi.js. The brotli compressed js code comes out to ~150KiB. The initial time series data transfer is ~400KiB of gzipped protobufs for new stories or ~1-2MiB for top stories.
This was something to both scratch a creative itch before re-entering the workforce, and to try and make a lateral move to paid Elixir development. The germ of the idea spawned in April: “How can I tell when is best to post to HN? Hmm, I need to visualise it, but how? What if HN was one big organism? Or a biome?!” What followed in June was a four month journey to this submission. A month in, I lost someone close with all the horrible feelings that drags you through. At first I stopped coding completely, but eventually the project became welcome distraction. But coming to now, this lily has been well and truly gilded, the sunk cost has been well and truly sunk, and this self-sniped nerd still doesn’t know the best time to post to HN. So I hope you enjoy it and please upvote if you like it! :)
P.S. if you’re looking for an Elixir developer, I’d love to start working professionally in my favourite language. Email in bio