The dConstruct Audio Archive works offline

The dConstruct conference is as old as Clearleft itself. We put on the first event back in 2005, the year of our founding. The last dConstruct was in 2015. It had a good run.

I’m really proud of the three years I ran the show—2012, 2013, and 2014—and I have great memories from each event. I’m inordinately pleased that the individual websites are still online after all these years. I’m equally pleased with the dConstruct audio archive that we put online in 2012. Now that the event itself is no longer running, it truly is an archive—a treasury of voices from the past.

I think that these kinds of online archives are eminently suitable for some offline design. So I’ve added a service worker script to the dConstruct archive.

Caching

To start with, there’s the no-brainer: as soon as someone hits the website, pre-cache static assets like CSS, JavaScript, the logo, and icon images. Now subsequent page loads will be quicker—those assets are taken straight from the cache.

But what about the individual pages? For something like Resilient Web Design—another site that won’t be updated—I pre-cache everything. I could do that with the dConstruct archive. All of the pages with all of the images add up to less than two megabytes; the entire site weighs less than a single page on Wired.com or The Verge.

In the end, I decided to go with a cache-as-you-go strategy. Every time a page or an image is fetched from the network, it is immediately put in a cache. The next time that page or image is requested, the file is served from that cache instead of the network.

Here’s the logic for fetch requests:

  1. First, look to see if the file is in a cache. If it is, great! Serve that.
  2. If the file isn’t in a cache, make a network request and serve the response …but put a copy of a file in the cache.
  3. The next time that file is requested, go to step one.

Save for offline

That caching strategy works great for pages, images, and other assets. But there’s one kind of file on the dConstruct archive that’s a bit different: the audio files. They can be fairly big, so I don’t want to cache those unless the user specifically requests it.

If you end up on the page for a particular talk, and your browser supports service workers, you’ll get an additional UI element in the list of options: a toggle to “save offline” (under the hood, it’s a checkbox). If you activate that option, then the audio file gets put into a cache.

Now if you lose your network connection while browsing the site, you’ll get a custom offline page with the option to listen to any audio files you saved for offline listening. You’ll also see this collection of talks on the homepage, regardless of whether you’ve got an internet connection or not.

So if you’ve got a long plane journey ahead of you, have a browse around the dConstruct archive and select some talks for your offline listening pleasure.

Or just enjoy the speediness of browsing the site.

Turning another website into a Progressive Web App.

Have you published a response to this? :

Responses

Related posts

In person

dConstruct, Web Dev Conf, and State Of The Browser.

dConstruct 2022 is happening!

September 9th at the Duke of York’s in Brighton—be there!

Building the dConstruct 2015 site

Hats off to Graham.

Speculation rules and fears

Browser are user agents, not developer agents.

Service worker weirdness in Chrome

Debugging an error message.

Related links

Return to UX London – Smithery

I’m very excited that John is speaking at this year’s UX London!

Tagged with

dConstruct 2022 — Polytechnic

A lovely heartfelt personal look back at dConstruct.

dConstruct was about the big ideas, but not in a wanky TED way. It was about ideas on the horizon brought into focus, it always left me wanting to know more.

dConstruct was never about the big showy thing that will make you millions. It was about the interesting. It gave you seeds to take away with you, and that’s important.

Tagged with

Reflections on Dconstruct 2022 – Bill Tribble

Wow, what a day. A really diverse selection of talks that went all over the map. From building vast world-changing health systems, to scaling and archiving global online communities, to the beauty and joy of calligraphy. And lasers. I enjoyed the lot, which is rare for me at an event like this.

A rather lovely write-up of the final dConstruct!

Above all it was nice to see the diversity of approaches and reasons for doing ‘design’ / art / whatever. Some of us are solving the hard problems, some of us are thinking philosophically or creating new tools, and some of us are just having fun – and all approaches are valid and useful.

Tagged with

The last dConstruct | hidde.blog

A great write-up from Hidde on dConstruct 2022 and how the speakers tackled the theme of design transformation:

They talked about turning a series of penstrokes into art, lasers into fireworks, human experiences into novels and patient data collection into a minimal effort task.

A lot of our work in web design and technology has a power to transform and that is wonderful, especially when we manage to be intentional about the how and why.

Tagged with

I’m speaking at a couple of upcoming events (Interconnected)

Matt shares some details on what he’ll be speaking about at dConstruct:

I’m going to talk generally around tools for togetherness which is my new framing for my long-running territory of general curiosity: how can we be together online, what we can do there, what it does to us, what are the design considerations, etc.

Get your ticket if you haven’t already!

I’m one of eight speakers – there’s a robotic artist, a neuroscientist, and a calligrapher. It should be an excellent day.

Tagged with

Previously on this day

8 years ago I wrote A decade on Twitter

The first ten years of microblogging.

9 years ago I wrote Fortune

I’m Brighton’s Craig Newmark, apparently.

12 years ago I wrote Progress

Something is happening.

13 years ago I wrote Timeless

Who knows where the time element goes?

17 years ago I wrote Silent witness

Pattern recognition in the films of Ridley Scott.

18 years ago I wrote Microformats gone wild

You can’t swing a cat without hitting a microformat these days.

19 years ago I wrote Bound for Cork

I’m going to be incommunicado for the next few days. I’m heading back to my hometown in Ireland.

20 years ago I wrote Viva La iPodDownload

I wrote a little while back about a nice little plug-in for iTunes called iPodDownload. It plugged a glaring usability hole in iTunes whereby you aren’t able to simply drag your music from your iPod to your computer.

21 years ago I wrote Oh my God, it's full of rock stars!

All went well with the Salter Cane concert last night. My bout of gastroenteritis had luckily passed by the time the gig rolled ‘round.

23 years ago I wrote The Brick Testament

Now, this is what the Internet was made for: Bible stories in Lego form.

23 years ago I wrote Movie industry dealt DVD-cracking blow

This is good news. The infamous DeCSS code is protected under free speech.

23 years ago I wrote Giant Sand

The Giant Sand concert was lots of fun.