Show HN: Accessing a website you never visited before while being offline [demo] | Hacker News Reader

Show HN: Accessing a website you never visited before while being offline [demo]

planujemywesele.pl

25 pointsrapawel19 comments

This interactive demo explores how a website can load and function while you're in airplane mode — even if you've never visited it before. It requires official Google Chrome and does not work on iOS devices (iPhone/iPad).

Spoiler alert: For the best experience, try the demo before reading the explanation below. You can launch it by clicking the post title at the top of this page.

The demo uses SXG (Signed Exchanges), a web standard that allows Google to prefetch entire pages from search results. This means that when you click a result, the page can open even if you're offline — because it was silently prefetched beforehand. In this demo, I push SXG to its limits by delivering a page with a 19 MB video — all before you go offline.

Open articleView on HN

Not mentioning prefetch in the title is extremely clickbaity IMO.

You could also argue that prefetching IS visiting a site (the data was still downloaded, it counts as a visit on their end for sure), you just haven't actually viewed the content yet.

Isn't the point that Google caches the site, and the visitor loads the caches SXG data from Google, and they never hit the server of the site itself. It's like AMP on steroids. It definitely doesn't count as a visit for the site in question.

https://developers.google.com/search/docs/appearance/signed-...

I wouldn't know because it was not explained at all, in the title or in the link (at least for me, I'm on firefox so it doesn't load much, or give any explanation).

But if it's true that google is caching the page themselves, then yes you're right and I did not even consider that. Thanks

Yes, exactly - well put.

The key difference from AMP is that the site signs the content and it’s attributed to their origin, not Google’s. So, while it’s served from Google’s cache, it still counts as the publisher’s page in terms of origin and trust.

Thanks, fair point.

I skipped technical terms like “prefetch” or “SXG” in the title to make it more approachable and spark curiosity — but I get how that could feel misleading.

You're right that prefetching counts as a visit in some sense. The point of the demo was to highlight how unexpected it can feel to load a site while offline, even if you never actively opened it before.

I published the repository with source code of the demo. The README contains detailed explanation how the demo works as well as instructions on how to host the demo yourself.

https://github.com/pepawel/stretching-prefetching

Here is my feedback.

Steps are not clear enough. It looks to me it's a step by step guide but it missed at least 2 points :

- the search engine must be Google I think ? Mine is duckduckgo and it doesnot work

- I still dont know if my device is supposed to be in airplane mode or no for the test. In airplane mode, even with Google set as the search engine, it does not work. Pixel phone. If I am connected to internet, I do have the single result from the google search.

I guess we are expected to be pleasantly surprised by something, but since I don't know what to look for and it does not work, it's a miss for me.

Personally I prefer to have the explanation alongside the steps that way I know what I am doing and can correctly interpret the instructions. For me, learning the technical trick does not diminish my contentness.

Thanks for the detailed feedback — really appreciate it!

You're right that the demo relies on Google Search specifically (not DuckDuckGo), and that should probably be made even clearer in the instructions. I do mention “search Google” in step 3, but I’ll look into making that more explicit up front.

As for airplane mode: the idea is to go offline after Google has had time to prefetch the page. That’s why the instructions say to start with a stable internet connection — and the page does show a warning if you go offline too early. But I totally get how that could still be confusing, especially if it didn’t work the first time.

A tip: once you're on the "You're offline" page, wait at least 3 seconds and observe the dinosaur. Something may happen.

And good point about wanting to know what’s going on. I tried to keep the experience surprising for some users, but I see how having the technical context up front can enhance it for others. I’ll consider adding an “explain first” option in the future.

Thanks again for giving it a go!

I don't really get it, but I'm also not using chrome, but looking at the website's source instead.

- Does the website actually do anything related to SXG?

- Would this also work if I search something completely different, goo offline and then just click on the first result?

- What is the point of the code if it's just hardcoded?

- What is the random progressbar doing? Just for visuals?

Edit: I explored a bit more and this blog post[0] by the OP would probably be a better entry-point for this post.

[0]: https://www.pawelpokrywka.com/p/stretching-google-prefetchin...

Thanks for checking it out — and good questions.

You're right: the site is SXG-enabled, and the point of the demo is to show that Google can prefetch and serve it even when you're offline — but only if you search for a specific phrase on Google. Random searches won’t trigger the right preload.

The 4-digit code is intentionally hardcoded — it's not a security check, but a way to make sure the user follows the instructions and gives Google a bit more time to prefetch the content before going offline.

The progress bar also helps with timing — making sure the preload has a chance to complete.

After reading your comment, I added a link to a blog post in the final step of the instructions, in case the demo doesn't work as expected. (If the page is cached from an earlier visit, a refresh helps — it's got a long browser cache.)

Thanks again for digging into it!

I saw the code as kind of a clever joke, kind of a "gotcha" where it obfuscated the process to make it seem like it's relevant. That was my favorite part of the whole thing, realizing it's not magically sending data over in loading, it's just tricking you.

This is pretty cool! Is there code for this somewhere? Would be cool to implement a client for hackernews that uses this for when I'm on the train.

Found some more tests here too that seem interesting: https://www.planujemywesele.pl/sxg-tests/

Thanks!

The demo uses 2 html pages - one for instructions, the second one for the actual site that is prefetched. But maybe I will create a repo with it.

HN is a perfect candidate to integrate Signed Exchanges - it's a link aggregator, the type of website SXG authors have in mind while designing this standard.

I have created a repository containing source code and detailed instructions on how to host the demonstration yourself. https://github.com/pepawel/stretching-prefetching

Your demonstration of using SXG to prefetch a 19 MB video for offline viewing is impressive. This is very innovative. It enhances user experience by enabling seamless content access without an active internet connection and showcases the potential of SXG in improving web performance. Thank you for your creative approach!

Would be interested in seeing a public repo if you want to make that available! :-)

Thanks! Yep, I’m planning to publish the repo shortly — just doing a quick cleanup first. I’ll update the thread as soon as it’s live.

Here is the repo. The README contains detailed instructions on how to host the demo yourself. https://github.com/pepawel/stretching-prefetching

indeed it feels like magic :)

Reply on news.ycombinator.com