
Why is collapsing a Hacker News comment so slow? - thewarpaint
https://github.com/thewarpaint/eduardogarcia.xyz/blob/master/_posts/2019-06-05-hacker-news-comments.md
======
pg_bot
I would use the <details> tag to solve this problem. Most people don't know
this exists and I have no idea why. You would probably have to rewrite the
html so it no longer uses tables but I don't really consider that to be a
negative.

I would also question why we are saving collapsed comments. I feel like this
is something that doesn't need to be persisted forever. If you want this
behavior why not use local storage instead?

~~~
zeugmasyllepsis
Persisting it on the server allows users to browse on multiple devices and
keep their collapse settings in sync. This is useful in particular for long
threads of comments, where collapsing can be used as a tool to keep track of
progress through the thread by collapsing comments along the way.

~~~
pg_bot
Sure I get that this is possible given that you know this is what the code
does but the bigger questions are who knows that you can do this, and who
actually uses this feature?

Is this the expected behavior when you collapse or show a thread? I would
suggest that it is not, as most minor interactions on a page are only stored
locally.

How many people actually use this feature? In order get a benefit from this
feature you have to be logged into hacker news on multiple devices, collapse a
thread on one device, come back to that thread later on the second device and
then continue reading from where you left off. Alternatively you can just
scroll past the stuff you've already read, which has a minimal cost to the
user.

The benefits seem negligible for the amount of developer time that likely went
into making this feature.

~~~
Yoofie
> Sure I get that this is possible given that you know this is what the code
> does but the bigger questions are who knows that you can do this, and who
> actually uses this feature?

I do.

> In order get a benefit from this feature you have to be logged into hacker
> news on multiple devices, collapse a thread on one device, come back to that
> thread later on the second device and then continue reading from where you
> left off.

I actually do exactly this. I read on my phone/laptop and later come back to
the same thread (when more people have commented) on my home computer, usually
at the end of the day. Having threads of conversation that you are not
interested in already collapsed on multiple devices is very useful.

> Alternatively you can just scroll past the stuff you've already read, which
> has a minimal cost to the user.

Scrolling and quickly scanning over multiple threads is more time consuming
and becomes actually annoying if you just want to passively follow a thread.
If you want to follow multiple threads under the same topic, you either have
to remember unique words/usernames/dates of that thread or resort to scroll &
scan method mentioned above. One is annoying, the other is simply non viable
for N amount of threads.

Until there is a way to subscribe to a thread, this feature is _super_
helpful. Its actually just as good or better than a subscribe mechanism
because atleast you can avoid getting multiple notifications for every single
comment that get posted in the interesting thread. In the current scheme, all
the irrelevant ones are already out of your way.

------
polote
Fun fact

In a previous company we were building a session replay tool, and as you may
know it is pretty complex to evaluate the impact of the single script on a
page.

The only way we found to test the impact of the script was to execute it on a
page with the most mutations on an event, and try to see how much the event
was impacted.

The only place where we found a heavy use of mutations was the hackernews page
that had more than 100 comments in a thread. And the first time we tested, we
tripled the time to collapse the thread

------
llamathrowaway
> There is also a GET request to
> [https://news.ycombinator.com/collapse?id=1234567](https://news.ycombinator.com/collapse?id=1234567)
> to save the state of the collapsed/expanded comment if the user is logged
> in, but it's an async request so it doesn't have an impact.

Is this a correct place to use 'GET'?

~~~
dexen
_> Is this a correct place to use 'GET'?_

Not at all; GET requests are specified [0] to not cause any modifications to
the resources (aside of meta-data like logging etc.). It should also be 100%
safe for web spiders to issue any GET at any time [1], server overload aside.

I presume it's an artifact of earlier implementation -or just an idea- to have
the collapse work without JavaScript. It would be doable with a normal A HREF
with the current link format of
[https://news.ycombinator.com/collapse?id=20336970](https://news.ycombinator.com/collapse?id=20336970)

\--

[0] "In particular, the convention has been established that the GET and HEAD
methods SHOULD NOT have the significance of taking an action other than
retrieval." \-
[https://tools.ietf.org/html/rfc2616#section-9.1.1](https://tools.ietf.org/html/rfc2616#section-9.1.1)

[1] in the early day of the internet, a friend lost most of his CRM's content
because he had record deletes implemented as A HREF issuing GET requests.
Having learned the lesson, he instead turned to JavaScript code issuing
GETs...

~~~
baddox
I thought that the normal way to have this work without JavaScript would be to
have a form tag with the submit button styled to look like the collapse
button.

------
Waterluvian
I have a budget moto and HN comments section is completely unusable on Chrome
but perfectly smooth on Firefox. Haven't explored why.

On Chrome any comment section with more than about 100 comments grinds to a
halt. If I try to type in a comment there's a three second delay waiting for
every letter to appear.

~~~
thewarpaint
I didn't want to make the post even bigger and deal with other browsers but
that's a good idea for a follow-up.

------
enriquto
I cannot visually notice any delay. It seems instantaneous in my browser.

~~~
Ajedi32
It's really only an issue on mobile when you're collapsing larger threads. Try
collapsing the first comment in this thread, for example:
[https://news.ycombinator.com/item?id=14656945](https://news.ycombinator.com/item?id=14656945)

Not terrible, but there's a noticeable (maybe ~1 second on my phone) delay. My
desktop is fast enough that it still feels instant.

~~~
krapp
One answer to this is to paginate long threads so there's a definite upper
limit to the length and depth of the thread on any page.

~~~
enriquto
this is a bit ridiculous... folding a few thousand lines of plain text should
be fast no matter what. If it isn't, then there's something quite wrong.

~~~
krapp
I don't want to knock dang or whoever wrote it but when I look at HN's JS it
looks to me like it was written more to resemble Lisp idioms and to look
elegant than to be efficient. If so, that may just be someone working in their
comfort zone, which is fine - it works, and if it were much more complex than
it is, HN being HN would complain. It's not _bad_ , it just doesn't scale.

Also, I _suspect_ but don't _know_ that the table based layout makes showing
and hiding elements a lot slower than it would be with, say, divs or an
unordered list. If this is the case, it would probably only be exacerbated on
mobile.

------
RBenjamin
Or just use my Greasemonkey/Tampermonkey plugin which disables the Hackernews
collapsible comments and introduces its own collapsible comments logic, which
is much faster and has a variety of convenience features:

[http://mental-reverb.com/creations.php](http://mental-
reverb.com/creations.php)

~~~
thewarpaint
The slow behaviour is mostly noticeable on mobile Chrome, but will have a
look, thanks for sharing.

------
gowld
I suspect the pg answer to this question is "there's too much noise on some
posts, and deterring interaction with posts of 300+ comments is a feature, not
a bug.

------
abakker
I am just now realizing that HN comments are collapsible...I wonder if anyone
has ever looked at upvote/scroll behavior when the collapse button is used vs
not? There are a ton of threads where the top comment is also a non-sequitur,
but I know when that happens I frequently don't scroll past the hundreds of
replies to see what the other first level comments are.

~~~
AareyBaba
Okay. I'll bite. What is everyone talking about ?

I see an upvote triangle, a down vote [-] and nothing else. Is this a mobile
only thing ? I can't see a way to collapse comments under Chrome or Safari on
a desktop.

I am out of the loop what's the secret ?

~~~
thewarpaint
[-] is not a downvote button, but the collapsing one.

~~~
AareyBaba
TIL ... after years on HN.

For anyone else out of the loop like me: Where's the downvote button?
[https://news.ycombinator.com/item?id=17731487](https://news.ycombinator.com/item?id=17731487)

~~~
kingosticks
It's not available until you have a certain amount of karma. I think it's 500
or thereabouts.

------
someexgamedev
I wrote a browser extension to collapse HN comments past the first depth and
ended up just attaching their css classes and setting the sub-comment count
myself. It was the fastest behavior I could find at the time for reasons I've
since forgotten. I did try to use their existing js but it took forever to
collapse the page.

Here's my collapse code if interested

[https://github.com/a13o/disengaged/blob/master/src/hacker-
ne...](https://github.com/a13o/disengaged/blob/master/src/hacker-
news/collapse-deep-comments.js)

------
env123
Refined hacker news, anyone? [https://github.com/plibither8/refined-hacker-
news](https://github.com/plibither8/refined-hacker-news)

------
wierdaaron
A lot could be gained by simply storing the jQuery objects instead of doing
the lookups multiple times per method. That’s a lot of unnecessary dom
traversal.

------
ha99ja
That is really ugly code.

~~~
nicolaslem
For me HN is a great reminder that done is better than perfect.

~~~
mda
More like, "It kinda works, we don't give a crap".

~~~
dang
That's not nice. I don't mind if you diss our code. But I do mind if you say
we don't give a crap.

~~~
thewarpaint
OP here. Dissing was not the intention of my post, if I can help in any way to
improve HN let me know, would be more than glad to do so. Peace!

------
oftenwrong
I dug into the collapsing code recently because I wanted to make a script that
collapses HN threads by default. In other words, only the top-level comments
would be shown at first. To me this makes more sense. If I am interested in
continuing a thread, I can expand it. If I am not interested in continuing, I
don't want to have to scroll past its children.

According to the comments here, maybe I would be better off implementing my
own collapsing scheme.

------
bozoUser
In the similar vein, feature request to sort by best/new :)

------
kabwj
It’s fast on Safari mobile but very slow on Firefox desktop. Goes to show many
things.

------
dangus
If you don't mind me being negative here for a moment:

1\. It's not your website, why spend so much time and effort on dissecting the
issue? If one did this for every webpage they visited it'd be a more than a
full time job.

2\. Does it really look like Hacker News has had any serious development
effort poured into it anytime recently? What incentive does YC have to put
time and money into a forum that generates zero revenue?

3\. Do we really expect web browsing to be pleasant on a 3 year old budget
smartphone with a Qualcomm 617?

The Moto G4 Plus is solidly in the bottom 25% of phones listed here:

[https://www.androidbenchmark.net/cpumark_chart.html](https://www.androidbenchmark.net/cpumark_chart.html)

~~~
thewarpaint
1\. Too much free time I guess. I'm a frontend guy, I find frontend stuff
interesting.

2\. No. Probably none.

3\. Are you saying that you are willing to sacrifice the user experience of
the bottom 25% of the users of a website?

~~~
thedaemon
3) Most of the internet does this now. Even on my Q6600 PC, web sites grind to
a halt. Whereas actual applications run just fine, even my 3d animation
software. The overhead of the web has become unbearably lazy.

