7 ms·

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 i

by pg_bot 7y ago

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?

giancarlostoro 7y ago
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details https://developer.mozilla.org/en-US/docs/Web/HTML/Element/de... This is awesome! I had no idea! You're right, I don't think most people even realize. There's often times I get upset when using Bootstrap or just doing CSS and look up ways to do specific things and don't find out of the box solutions, this is one time I'm glad I found a decent alternative. One case that comes to mind is collapsible trees and dropdown boxes where you can type / search on them, and anything with dropdown boxes like checkmarks gets a wee bit hacky.
- jhomedall 7y ago
  Note that it's not yet supported by Edge: https://developer.microsoft.com/en-us/microsoft-edge/platform/status/detailssummary/ https://developer.microsoft.com/en-us/microsoft-edge/platfor...
  - Ajedi32 7y ago
    Edge is turning into Chromium soon, so that shouldn't be a problem for much longer.
    - reaperducer 7y ago
      Considering there are millions of people still using IE11, I'd say it will continue being a problem for a long time. 18% of my users are on IE11. Some industries (healthcare, for example) don't change if they don't perceive something to be broken.
      - lol768 7y ago
        Doesn't Edge auto-update though? How easy would it be, as someone in enterprise IT, to keep users on an old version of Edge?
        fuzz4lyfe 7y ago
        The reason is active-x, somebody wrote a way to scan with active-x and now virtually every healthcare web app works that way.
        mschuster91 7y ago
        This was before webcam support was mainstream in browsers. Capturing stills from ultrasound is in many legacy systems still done with a TV capture card and the really old legacy cards don't even use any standard API but carry their own driver so you can't use them as a webcam but need the vendor app. source: did support for a doctor some years ago
        notriddle 7y ago
        Edge isn't IE11. They are both installed, side-by-side, on Windows 10, and IE11 is the only one that ships on Windows 7.
      - stephenboyd 7y ago
        In healthcare, the most common EMR systems (Epic, Cerner, Allscripts, etc) use IE11 in iframes as the platform environment for 3rd party applications embedded in their UIs. So convincing a few large vendors to upgrade would make a huge difference, but the hospitals themselves don't have the option of upgrading some of those browser environments. (My company makes apps that run in the EMR platforms)
      - CognitiveLens 7y ago
        To be fair, if we're staying in the parameters of the thought experiment, we're targeting the HN user base, which I suspect isn't using IE11 at nearly that rate...
  - mintplant 7y ago
    There's a handy polyfill for that. https://github.com/rstacruz/details-polyfill https://github.com/rstacruz/details-polyfill
    - giancarlostoro 7y ago
      Yeah I was going to say, I'm sure the polyfill shouldn't be entirely horrible...
- krferriter 7y ago
  Hmm, that's cool, I don't know how I've never heard of this before. Probably much better than some more-expensive CSS or Javascript.
zeugmasyllepsis 7y ago
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.
- mintplant 7y ago
  FWIW, you can still do this with the `<details>` tag, though. Have the page background-sync collapsed statuses back to the server and have the server remove the appropriate `open` attribute from collapsed `<details>` on subsequent page loads.
- anigbrowl 7y ago
  That sounds like a solution in search of a problem tbh
- pg_bot 7y ago
  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.
  - yorwba 7y ago
    > you can just scroll past the stuff you've already read, which has a minimal cost to the user. Both vote count and age influence the order of comments, which means that the stuff you've already read may appear below stuff you haven't read yet. If you use the feature at all, I'm not sure why you wouldn't want collapsed comments to be in sync across devices.
smacktoward 7y ago
> If you want this behavior why not use local storage instead? My guess would be that the decision was made before a standardized, widely available cross-browser implementation of localstorage was a thing.
Deimorz 7y ago
I looked into using <details> to handle collapsing comment threads on Tildes, and ended up deciding it wouldn't work well and just went with JS. It was a long time ago now so I can't remember much specifically any more, but I think that the styling and behavior for <details> were both too limited and too inconsistent across browsers. I do use it in some other places though, like collapsing/expanding the text of text topics from the listing pages, and it works really well for that (other than the current lack of support in Edge).
OrgNet 7y ago
I like the saving collapsed comments feature but past 7 days, I would not care if the server forgot about them because I usually never go back to posts 7 days or older
skrause 7y ago
> You would probably have to rewrite the html so it no longer uses tables This reminds me: What happened to the markup rewrite that was announced almost 5 years ago together with the Firebase API? https://blog.ycombinator.com/hacker-news-api/ https://blog.ycombinator.com/hacker-news-api/ As far as I can see the markup never changed after all.
thekyle 7y ago
Didn't know about <details>. I was actually working on a site that uses threaded comments recently, so I might consider using it.
Jaruzel 7y ago
> I would also question why we are saving collapsed comments. I can't be the only one who had no idea it did this? And if so, I'd could argue that there isn't really a need for it.
reustle 7y ago
I would absolutely vote to do comment state saving in local storage. The need to have synced collapsed comments across devices is pretty minimal, compared to the performance increase that everybody will experience.
- wolco 7y ago
  Removing a feature few know about for a small increase in performance for some? Now that everyone knows about it people will start using it and people will start noticing the slowdown. Somethings are best not mentioned
pgcj_poster 7y ago
Holy heck. I always wondered why there wasn't a tag like that. Thanks!
aitchnyu 7y ago
I tried ctrl+f on text inside collapsed details and it didnt show up. I would have expected that with correct semantics, the browser would have figured out that it should expand the details and highlight that text. Its also missing a group name, so I can expand only one details of a group. Why is it useful?
- kingosticks 7y ago
  This is a really good point. The lack of searchability of the collapsed text makes this pretty useless for comments. Please consider this when thinking of using it anywhere.

by pg_bot 7y ago

giancarlostoro 7y ago

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details https://developer.mozilla.org/en-US/docs/Web/HTML/Element/de... This is awesome! I had no idea! You're right, I don't think most people even realize. There's often times I get upset when using Bootstrap or just doing CSS and look up ways to do specific things and don't find out of the box solutions, this is one time I'm glad I found a decent alternative. One case that comes to mind is collapsible trees and dropdown boxes where you can type / search on them, and anything with dropdown boxes like checkmarks gets a wee bit hacky.

jhomedall 7y ago
Note that it's not yet supported by Edge: https://developer.microsoft.com/en-us/microsoft-edge/platform/status/detailssummary/ https://developer.microsoft.com/en-us/microsoft-edge/platfor...
- Ajedi32 7y ago
  Edge is turning into Chromium soon, so that shouldn't be a problem for much longer.
  - reaperducer 7y ago
    Considering there are millions of people still using IE11, I'd say it will continue being a problem for a long time. 18% of my users are on IE11. Some industries (healthcare, for example) don't change if they don't perceive something to be broken.
    - lol768 7y ago
      Doesn't Edge auto-update though? How easy would it be, as someone in enterprise IT, to keep users on an old version of Edge?
      - fuzz4lyfe 7y ago
        The reason is active-x, somebody wrote a way to scan with active-x and now virtually every healthcare web app works that way.
        mschuster91 7y ago
        This was before webcam support was mainstream in browsers. Capturing stills from ultrasound is in many legacy systems still done with a TV capture card and the really old legacy cards don't even use any standard API but carry their own driver so you can't use them as a webcam but need the vendor app. source: did support for a doctor some years ago
      - notriddle 7y ago
        Edge isn't IE11. They are both installed, side-by-side, on Windows 10, and IE11 is the only one that ships on Windows 7.
    - stephenboyd 7y ago
      In healthcare, the most common EMR systems (Epic, Cerner, Allscripts, etc) use IE11 in iframes as the platform environment for 3rd party applications embedded in their UIs. So convincing a few large vendors to upgrade would make a huge difference, but the hospitals themselves don't have the option of upgrading some of those browser environments. (My company makes apps that run in the EMR platforms)
    - CognitiveLens 7y ago
      To be fair, if we're staying in the parameters of the thought experiment, we're targeting the HN user base, which I suspect isn't using IE11 at nearly that rate...
- mintplant 7y ago
  There's a handy polyfill for that. https://github.com/rstacruz/details-polyfill https://github.com/rstacruz/details-polyfill
  - giancarlostoro 7y ago
    Yeah I was going to say, I'm sure the polyfill shouldn't be entirely horrible...
krferriter 7y ago
Hmm, that's cool, I don't know how I've never heard of this before. Probably much better than some more-expensive CSS or Javascript.

zeugmasyllepsis 7y ago

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.

mintplant 7y ago
FWIW, you can still do this with the `<details>` tag, though. Have the page background-sync collapsed statuses back to the server and have the server remove the appropriate `open` attribute from collapsed `<details>` on subsequent page loads.
anigbrowl 7y ago
That sounds like a solution in search of a problem tbh
pg_bot 7y ago
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.
- yorwba 7y ago
  > you can just scroll past the stuff you've already read, which has a minimal cost to the user. Both vote count and age influence the order of comments, which means that the stuff you've already read may appear below stuff you haven't read yet. If you use the feature at all, I'm not sure why you wouldn't want collapsed comments to be in sync across devices.

smacktoward 7y ago

> If you want this behavior why not use local storage instead? My guess would be that the decision was made before a standardized, widely available cross-browser implementation of localstorage was a thing.

Deimorz 7y ago

I looked into using <details> to handle collapsing comment threads on Tildes, and ended up deciding it wouldn't work well and just went with JS. It was a long time ago now so I can't remember much specifically any more, but I think that the styling and behavior for <details> were both too limited and too inconsistent across browsers. I do use it in some other places though, like collapsing/expanding the text of text topics from the listing pages, and it works really well for that (other than the current lack of support in Edge).

OrgNet 7y ago

I like the saving collapsed comments feature but past 7 days, I would not care if the server forgot about them because I usually never go back to posts 7 days or older

skrause 7y ago

> You would probably have to rewrite the html so it no longer uses tables This reminds me: What happened to the markup rewrite that was announced almost 5 years ago together with the Firebase API? https://blog.ycombinator.com/hacker-news-api/ https://blog.ycombinator.com/hacker-news-api/ As far as I can see the markup never changed after all.

thekyle 7y ago

Didn't know about <details>. I was actually working on a site that uses threaded comments recently, so I might consider using it.

Jaruzel 7y ago

> I would also question why we are saving collapsed comments. I can't be the only one who had no idea it did this? And if so, I'd could argue that there isn't really a need for it.

reustle 7y ago

I would absolutely vote to do comment state saving in local storage. The need to have synced collapsed comments across devices is pretty minimal, compared to the performance increase that everybody will experience.

wolco 7y ago
Removing a feature few know about for a small increase in performance for some? Now that everyone knows about it people will start using it and people will start noticing the slowdown. Somethings are best not mentioned

pgcj_poster 7y ago

Holy heck. I always wondered why there wasn't a tag like that. Thanks!

aitchnyu 7y ago

I tried ctrl+f on text inside collapsed details and it didnt show up. I would have expected that with correct semantics, the browser would have figured out that it should expand the details and highlight that text. Its also missing a group name, so I can expand only one details of a group. Why is it useful?

kingosticks 7y ago
This is a really good point. The lack of searchability of the collapsed text makes this pretty useless for comments. Please consider this when thinking of using it anywhere.