4 ms·

It might be interesting to contrast with what my own website has evolved. Discussion: https://www.gwern.net/Design https://www.gwern.net/Design Here the idea i

by gwern 5y ago

It might be interesting to contrast with what my own website has evolved. Discussion: https://www.gwern.net/Design https://www.gwern.net/Design Here the idea is not so much 'links are you all need' as transclusion is all you need, in the form of dynamic popups/popins. How can we have a ridiculous number of references? Make each one popup its metadata like an abstract. How can we have a ridiculous number of WP links for every term and concept? Pop them up, WP has an API. How can we cross-reference sections or arbitrary <div>/<span>s within a page? Make it popup. How can we cross-reference other pages without the dreaded hypermedia effect of "oh my god each page is 1 sentence long and I have to click through a thousand of them, screw you man"? Pop up with a mouse hover, effortless and fully recursive. How do we support backlinks, or indeed any arbitrary kind of metadata page about a link we may wish to create at some point? Just generate the HTML snippets and link to those snippets - popups do the rest. How do we implement tags? You'd better believe it involves simply creating a HTML page with all of the links with the 'tag' and then simply linking to it! How do we do topic-modeling with the coldstart problem of requiring heavy manual curation of all links (which is what OP suggests as a replacement)? Use topic-modeling to generate link suggestions while editing, and then link the useful ones (thereby making them visible when you edit and also generating backlinks automatically). When we can pop up anything, we can pop up raw data files like PDFs, or their syntax-highlighted versions (source code); we can even pop up pages on other domains (subject to a whitelist of having checked that X-FRAME headers don't kill it and it doesn't otherwise break horribly inside the iframe).

hombre_fatal 5y ago
This is great. Crusader Kings 3, a recent strategy game, implemented nested popovers like this to handle the same issue and now I wish every popover system had it. Here's a demo for anyone curious: https://www.youtube.com/watch?v=Dg-WelHEsEU https://www.youtube.com/watch?v=Dg-WelHEsEU
deleted 5y ago
[deleted]
gwern 5y ago
Subsequent HN discussion: https://news.ycombinator.com/item?id=30928081 https://news.ycombinator.com/item?id=30928081
Swizec 5y ago
This is amazing and I wants it for my own site. I've been solving most of this by trying to Just Write Better and that works to an extent – it obviates the need for a lot of structure because you're building up the structure in the reader's brain as they go. Using stable references helps. Familiar readers can go "Ah he's referencing that concept again" and don't need to click the deeper link. New readers can click and find out. But if they didn't need to click. That would rock!
xixixao 5y ago
If you really care about details you should preload sidenotes and other links before I click on them. Most people (I) don’t care about bandwidth nearly as much as I care about time.
- gwern 5y ago
  But I do! Links are preloaded after about a second or so of hover; the delay is because I don't want to prefetch a lot of links when readers are just scrubbing over links or briefly previewing them. I've thought that it's still too aggressive since that's not a lot of time to even skim an annotation, but it's hard to know what is a good timeout there. (I'm not sure what you mean by 'sidenotes'; what we call sidenotes are just footnotes, which are of course at the bottom of the document and don't need to be 'loaded'.)
  - xixixao 5y ago
    a) I was on mobile, so no hover unfortunately b) i got confused by the first link which is about Sidenotes, but itself is not a sidenote :)
    - gwern 5y ago
      The Instant.page JS will still prefetch on mobile, it'll just do so on mouse-down instead of waiting ~1s of hover. Not as useful, presumably, but it would be hard to do better (how does one know before the finger touches the screen?) and still is shaving milliseconds.
- 0des 5y ago
  Remote island here, please don't do this. My pigeon can only carry so much and he's talking about retirement soon.
dylan604 5y ago
The problem I have with your example link is that when you hover, there is no indication that something is loading before the window pops. Is there a case for pop the window with a loader then replacing once the data has loaded?
- gwern 5y ago
  We actually do have a loading spinner. The problem is, it was designed for the download delay, and the download is now so fast that you don't even see it. The spinner was implemented back when popups were either just short HTML snippets or PDFs, so back then, the download time ~= total load time. But after we generalized the transclusion functionality to be able to pop up arbitrary sections or pages, across this and other websites, that is no longer the case. All of the delay is in parsing and rendering the fetched annotation/document. In the case of /Lorem (which I assume is the popup everyone is complaining about since it's in the abstract), it's a deliberately long torture-test document exercising every feature in many combinations; so, it just takes that long for your browser to render it. Said is going to try to rewrite the spinner to cover the full rendering. I have also been thinking that for links to pages, like /Lorem (rather than links to a specific section of a page, like '/Lorem#images'), the total load time may be too bad an experience and it's time to go back to creating annotations out of the page abstracts, and then having the full page popup if necessary. (I was going to do something like this anyway in order to get my essays fully integrated into the tag/link-bibliography & similar-links systems, but I was going to keep the popups as live popups; now I probably won't.)
barrkel 5y ago
Personally I can't stand your nested popups :) Popups are modal and nested popups represent a path of navigation. Accidentally move the mouse too much and everything disappears - and if the stack was deep, good luck trying to get it back, because you lose the entire path. There's no back button or undo close tab to rescue you.
- gwern 5y ago
  Adding explicit opening/closing would defeat much of the point of it being frictionless. It being so frictionless makes it easy to retrace your path in a split-second, which heavyweight browsing does not. (We do have explicit closing/opening for mobile popins because holding your finger in place would be ridiculous on mobile and break in many ways.) If you want a popup to stick around, you can simply 'pin' it using the pin icon, and also drag, resize, maximize etc.
  - barrkel 5y ago
    I feel increasing fear doing any "frictionless" browsing, knowing that I'd need to retrace my steps if I have a muscle tick or something similar which causes the cursor to stray outside the allowable area. It's a jenga tower of stacked navigation. So it's not actually frictionless, it actually induces mental stress the deeper in the navigation path I go. And knowing that I'd feel stress makes me not want to look at the popups at all, for fear that I find something interesting and feel that stress with a nested navigation. I think it's an interesting experiment but it's not for me.
- cxr 5y ago
  > There's no back button That's another problem with these: they swallow my browser history. It's the opposite effect of experiments like the one on graph.global, which instead trashes the browser history (and breaks the back button).

by gwern 5y ago

hombre_fatal 5y ago

This is great. Crusader Kings 3, a recent strategy game, implemented nested popovers like this to handle the same issue and now I wish every popover system had it. Here's a demo for anyone curious: https://www.youtube.com/watch?v=Dg-WelHEsEU https://www.youtube.com/watch?v=Dg-WelHEsEU

deleted 5y ago

[deleted]

gwern 5y ago

Subsequent HN discussion: https://news.ycombinator.com/item?id=30928081 https://news.ycombinator.com/item?id=30928081

Swizec 5y ago

This is amazing and I wants it for my own site. I've been solving most of this by trying to Just Write Better and that works to an extent – it obviates the need for a lot of structure because you're building up the structure in the reader's brain as they go. Using stable references helps. Familiar readers can go "Ah he's referencing that concept again" and don't need to click the deeper link. New readers can click and find out. But if they didn't need to click. That would rock!

xixixao 5y ago

If you really care about details you should preload sidenotes and other links before I click on them. Most people (I) don’t care about bandwidth nearly as much as I care about time.

gwern 5y ago
But I do! Links are preloaded after about a second or so of hover; the delay is because I don't want to prefetch a lot of links when readers are just scrubbing over links or briefly previewing them. I've thought that it's still too aggressive since that's not a lot of time to even skim an annotation, but it's hard to know what is a good timeout there. (I'm not sure what you mean by 'sidenotes'; what we call sidenotes are just footnotes, which are of course at the bottom of the document and don't need to be 'loaded'.)
- xixixao 5y ago
  a) I was on mobile, so no hover unfortunately b) i got confused by the first link which is about Sidenotes, but itself is not a sidenote :)
  - gwern 5y ago
    The Instant.page JS will still prefetch on mobile, it'll just do so on mouse-down instead of waiting ~1s of hover. Not as useful, presumably, but it would be hard to do better (how does one know before the finger touches the screen?) and still is shaving milliseconds.
0des 5y ago
Remote island here, please don't do this. My pigeon can only carry so much and he's talking about retirement soon.

dylan604 5y ago

The problem I have with your example link is that when you hover, there is no indication that something is loading before the window pops. Is there a case for pop the window with a loader then replacing once the data has loaded?

gwern 5y ago
We actually do have a loading spinner. The problem is, it was designed for the download delay, and the download is now so fast that you don't even see it. The spinner was implemented back when popups were either just short HTML snippets or PDFs, so back then, the download time ~= total load time. But after we generalized the transclusion functionality to be able to pop up arbitrary sections or pages, across this and other websites, that is no longer the case. All of the delay is in parsing and rendering the fetched annotation/document. In the case of /Lorem (which I assume is the popup everyone is complaining about since it's in the abstract), it's a deliberately long torture-test document exercising every feature in many combinations; so, it just takes that long for your browser to render it. Said is going to try to rewrite the spinner to cover the full rendering. I have also been thinking that for links to pages, like /Lorem (rather than links to a specific section of a page, like '/Lorem#images'), the total load time may be too bad an experience and it's time to go back to creating annotations out of the page abstracts, and then having the full page popup if necessary. (I was going to do something like this anyway in order to get my essays fully integrated into the tag/link-bibliography & similar-links systems, but I was going to keep the popups as live popups; now I probably won't.)

barrkel 5y ago

Personally I can't stand your nested popups :) Popups are modal and nested popups represent a path of navigation. Accidentally move the mouse too much and everything disappears - and if the stack was deep, good luck trying to get it back, because you lose the entire path. There's no back button or undo close tab to rescue you.

gwern 5y ago
Adding explicit opening/closing would defeat much of the point of it being frictionless. It being so frictionless makes it easy to retrace your path in a split-second, which heavyweight browsing does not. (We do have explicit closing/opening for mobile popins because holding your finger in place would be ridiculous on mobile and break in many ways.) If you want a popup to stick around, you can simply 'pin' it using the pin icon, and also drag, resize, maximize etc.
- barrkel 5y ago
  I feel increasing fear doing any "frictionless" browsing, knowing that I'd need to retrace my steps if I have a muscle tick or something similar which causes the cursor to stray outside the allowable area. It's a jenga tower of stacked navigation. So it's not actually frictionless, it actually induces mental stress the deeper in the navigation path I go. And knowing that I'd feel stress makes me not want to look at the popups at all, for fear that I find something interesting and feel that stress with a nested navigation. I think it's an interesting experiment but it's not for me.
cxr 5y ago
> There's no back button That's another problem with these: they swallow my browser history. It's the opposite effect of experiments like the one on graph.global, which instead trashes the browser history (and breaks the back button).