
Show HN: HN comments UI experiment - soneca
https://hn-level-based-view.gomix.me/
======
wingerlang
I don't like this UX, clicking into a thread and subthread removes the
'skimmable' aspect. I tried it on this thread and it took me around 10 clicks
(forgot the count and not doing it again) to read everything. It also includes
waiting and loading. You also lose the context of the replies.

Compare that with 0 clicks and 0 friction reading on HN.

Perhaps code is good but UX is bad.

~~~
sova
That's interesting that the skimmable aspect is most important -- it's true,
one does not want to click 10 times to view content one could otherwise "get"
from scrolling, but I rather like the idea and I think she or he is onto
something here.

I'm working on a UI currently that uses a similar feature, and what you say
about being able to skim is something I had not considered much...

How to balance the two? UI flow, and everything-at-a-glimpse.

~~~
wingerlang
Maybe have the top level comments very prominently displayed, but show all or
a few levels in in a smaller and muted style that expands inline.

------
soneca
Hey! I did this with two main objectives: learn React and start building a
portfolio to get a job as a junior web developer.

As a bonus I wanted to try to implement a new UI to comment threads, to solve
this preference of mine to read sibling comments on sequence (instead of all
indented children of a comment).

I built it using React at Gomix (which is great btw, even for someone just
learning to code), so using NodeJS also, and the data comes from Algolia's HN
API.

I would love to get feedback. Anything, really, but especially at the code
quality from the "will this help me get a job?" perspective. The code is here:
[https://gomix.com/#!/project/hn-level-based-
view](https://gomix.com/#!/project/hn-level-based-view)

~~~
fiatjaf
Maybe you could have written it as a pure-JS page (without a server) that
talks directly to the Firebase HN API (something like that exists, right?).

~~~
soneca
I wanted to use React (for learning purposes), but might be a good idea to
recreate this project a few times, each with different tech/approaches.

~~~
sova
Really dig what you have going on here. Very creative.

------
fiatjaf
Nice, but it is too slow to load comments, switch to next level etc. Why is
that?

Clicking on random links inside HN is much faster on my computer and it
downloads the entire HTML each time.

~~~
soneca
Honestly, I have no idea. I would love if someone could pitch in and give an
explanation so I can learn from this (details and link to code at my other
comment).

My bet would be that it makes an API call for each change on the components.
But probably the code could be improved aside from this.

~~~
jaredsohn
I'd recommend loading Chrome's network tab as you browse the site to get some
insight into this. For example, it looks like every time I click on a story it
makes four requests; three are the same and the fourth is for 'undefined'.

