£20 for a boiled egg, one piece of toast and a mug of tea?

This article is a repost promoting content originally published elsewhere. See more things Dan's reposted.

Egg and toast

£20 for a boiled egg, one piece of toast and a mug of tea?

The story of a modern London cafe…

(Read to end of thread before commenting!)

An amazing thread well-worth reading to the end. Went in expecting a joke about hipsters, millennials, and avocado-on-toast… finished with something much more.

The problem with single page apps

This article is a repost promoting content originally published elsewhere. See more things Dan's reposted.

Single-page apps (or SPAs as they’re sometimes called) serve all of the code for an entire multi-UI app from a single index.html file.

They use JavaScript to handle URL routing with real URLs. For this to work, you need to:

  1. Configure the server to point all paths on a domain back to the root index.html file. For example, todolist.com and todolist.com/lists should both point to the same file.
  2. Suppress the default behavior when someone clicks a link that points to another page in the app.
  3. Use more JavaScript—history.pushState()—to update the URL without triggering a page reload.
  4. Match the URL against a map of routes, and serve the right content based on it.
  5. If your URL has variable information in it (like a todolist ID, for example), parse that data out of the URL.
  6. Detect when someone clicks the browser’s back button/forward button, and update the URL and UI.
  7. Update the title element on the page.
  8. Use even more JavaScript to dynamically focus the content area when the content changes (for screen-reader users).

(Shoutout to Ashley Bischoff for those last two!)

You end up recreating with JavaScript a lot of the features the browser gives you out-of-the-box.

This becomes more code to maintain, more complexity to manage, and more things to break. It makes the whole app more fragile and bug-prone than it has to be.

I’m going to share some alternatives that I prefer.

Like – it seems – Chris Ferdinandi, I’ve got nothing against Single Page Applications in their place.

My biggest concern with SPAs is that they’re routinely seen as an inevitable progression of web development: that is, that an increasing number of web developers have been brainwashed into thinking that they’re intrinsically superior to traditional multi-page websites. As Adam Silver observed the other year, using your heavyweight Javascript framework to Ajaxify your page loads does make the application feel faster… but only because the download and processing time of the heavyweight Javascript framework made it feel slow in the first place! The net result: web bloat, penalising of mobile users, and brittle applications with many failure points.

Whenever I see a new front-end framework sing the praises of its routing engine I wonder how we got to this point. After all: the Web’s had a routing engine since 1990, and most efforts to reinvent it invariably make it worse: less-accessible, less-archivable, less-sharable, less-discoverable, less-reliable, or several of these.

Look After Lorcán

This article is a repost promoting content originally published elsewhere. See more things Dan's reposted.

Lorcán on a swing

This is Lorcán. Lorcán has cystic fibrosis (CF) Lorcán is two years old. Lorcán has been fighting a potentially life shortening lung infection for the last six months and treatment isn’t working.

There is an amazing drug called Orkambi made by Vertex that is not funded on the NHS, this drug could help Lorcán and thousands of others. Over 240 people in the U.K. have died waiting for it to become available. Vertex and the U.K. government are letting people with CF die because of a disagreement over cost.

Parents have had to find an alternative way of getting these drugs for their children and the Cystic Fibrosis Buyers Club have found a generic copy of the drug that individuals can legally import, it is a fifth of the cost. This is however still beyond what we can pay.

I’ve previously shared (one, two) content about my friend Jen‘s two-year-old son Lorcán, who suffers from cystic fibrosis, as well as joining in the #strawfiechallenge earlier this year. A particular aim of Jen has been to get access to a drug that could add decades to her son’s life, but which isn’t being made available on the NHS. Running out of options to get access to medicine that could dramatically improve her kid’s quality of life and prognosis, she’s now set up a GoFundMe and is soliciting donations.

If you can help, even just a little, please do.

Berlin 8:00 a.m.

This article is a repost promoting content originally published elsewhere. See more things Dan's reposted.

This explorable features an agent based model for road traffic and congestion. The model captures a phenomenon that most of us have witnessed on highways: phantom traffic jams, also known as traffic shocks or ghost jams. These are spontaneously emergent congested segments that move slowly and oppositely to the traffic. The explorable illustrates that phantom jams are more likely to occur if the variability in car speeds is higher:

So, if say 90% of the cars try moving at 120 km/h and 10 percent at 150 km/h, everyone might end up going 80 km/h on average. Whereas if everyone travelled at about 120 km/h no reduction of collective traffic flow occurs.

Traffic simulator

This is the best demonstration I’ve ever seen of the creation of phantom traffic jams. Playing with the (interactive) model, you can set up scenarios and watch how they affect traffic throughput. When everybody drives at 120km/h, everything’s fine. But when everybody drives at between 120km/h and 150km/h, traffic jams occur which result in everybody having to slow down to less than 120km/h!

This counterintuitive fact is hard to explain to people, but this interactive model makes it perhaps a little bit easier.

(There are, of course, other – more human – factors that result in an increased frequency of phantom traffic jams, but mathematicians are rarely concerned with what happens in the real world!)

Go play with the interactive.

The last Soviet citizen: The cosmonaut who was left behind in space – Russia Beyond

This article is a repost promoting content originally published elsewhere. See more things Dan's reposted.

Alexander Mokletsov/Sputnik

Sergei Krikalev was in space when the Soviet Union collapsed. Unable to come home, he wound up spending two times longer than originally planned in orbit. They simply refused to bring him back.

While tanks were rolling through Moscow’s Red Square, people built barricades on bridges, Mikhail Gorbachev and the Soviet Union went the way of history, Sergei Krikalev was in space. 350 km away from Earth, the Mir space station was his temporary home.

He was nicknamed “the last citizen of the USSR.” When the Soviet Union broke apart into 15 separate states in 1991, Krikalev was told that he could not return home because the country that had promised to bring him back home no longer existed.

Reducing motion with the picture element

This article is a repost promoting content originally published elsewhere. See more things Dan's reposted.

I was just talking with Dave about the accessibility of moving images on the web, and he said:

hm… I wonder if you could use picture + prefers-reduced-motion?

He then sends the following code:

<picture>
  <source srcset="no-motion.jpg" media="(prefers-reduced-motion: reduce)"></source> 
  <img srcset="animated.gif alt="brick wall"/>
</picture>

I copied the code, dropped it into a post of mine, created a static image of an animated GIF, and turned on the “reduce motion” preference (System Preferences > Accessibility > Display). And then BOOM. Just worked. In real time!

I added reduced-motion support to DanQ.me earlier this year, but I only bothered to pay attention to the animated parts of the layout and design itself (the “bounce” on the menus and the cutesy motion of the logo, for example) and considered the (few) GIF animations and the like that I’ve added to be out-of-scope. But this approach is really quite simple and elegant, and I’ll bear it in mind if I ever have need of such a thing!

Goat LARP

This article is a repost promoting content originally published elsewhere. See more things Dan's reposted.

Goats are the main characters. You are the supporting cast.

This game is about running mind-blowing live action experiences for goats. You will act as director and storyteller, transporting the goats to an unforgettable dream world of mystery and magic, etc etc.

Goat Larp is one part larp, one part hangout-with-animals-and-take-silly-pictures. In some ways, we are roleplaying that this is a larp.

The Goat Larp Rulebook

Rule number 1 through 100 is BE NICE TO THE GOATS.

Your Character

Show up at the farm dressed as any character you want. You could be an elf, a steampunk, the mayor of space, Hulk Hogan, Darth Vader, whatever.

Your character has no knowledge of how you got to this mystical goat farm, but you can sense that these goats are IMPORTANT. They need to be entertained. You need to run a larp for them.

Goat Activity Cards

There will be a stack of Goat Activity Cards. They are suggestions for activities you can do with the goats. For example:

One goat plays as Frodo, another will be Sauron. Use lawn posts to mark off an area representing Mount Doom. If Frodo visits Mount Doom before Sauron touches him, the world is saved. If Sauron touches Frodo, all is lost.

Another example:

President Goat’s cabinet must advise them on an important decision. The fate of the world is in this goat’s hands. One post is labeled “World Peace”, another post is labeled “Nuke Everything”. If President Goat bumps into a post, their decision is made.

Both teams may try to persuade the goats using any (safe) means they can come up. You are encouraged to ham it up, over-act, and monologue about what’s going on. This gives the goats a nice, immersive experience.

You may also come up with your own quests. In fact, you should, because most of the stuff we’re writing is garbage.

You can read more ideas for Goat Activities here.

Oh, I thought: it’s LARPing but with goats. You know, like Goat Yoga is yoga but with goats. Okay, fair enough: whatever floats your goat…

…but no, I was wrong. This isn’t so much LARPing with goats as LARPing for goats. As in: the goats are the player chatacters; any humans that happen to come along are mobs there for the entertainment of the goats.

The Internet remains a strange and wonderful window into a strange and wonderful world.

Caverna Do Dragão

This article is a repost promoting content originally published elsewhere. See more things Dan's reposted.

Dungeons & Dragons (80s TV show)Remember that 80s TV show Dungeons & Dragons?

It turns out that Renault’s target customer base in Brazil do, too. Presumably it was a way bigger deal over there than it was here, because this new car ad feels like it could genuinely be a trailer for a live-action reboot of the series. And now I want to watch it.

(I do have some questions, though. Like: Diana was only 14 years old when she and her friends were transported to the Realm of Dungeons and Dragons… so when did she learn to drive? Am I supposed to believe that she just rolled a natural 20 on that driving check? And where does Sheila go when she turns invisible so that Bobby doesn’t end up sitting on her transparent-lap? And how does the car’s navigation computer work: are we to believe that there’s a GNSS network in the skies above the Realm? The Internet must know!)

The man who made Einstein world-famous

This article is a repost promoting content originally published elsewhere. See more things Dan's reposted.

It is hard to imagine a time when Albert Einstein’s name was not recognised around the world.

But even after he finished his theory of relativity in 1915, he was nearly unknown outside Germany – until British astronomer Arthur Stanley Eddington became involved.

Einstein’s ideas were trapped by the blockades of the Great War, and even more by the vicious nationalism that made “enemy” science unwelcome in the UK.

But Einstein, a socialist, and Eddington, a Quaker, both believed that science should transcend the divisions of the war.

It was their partnership that allowed relativity to leap the trenches and make Einstein one of the most famous people on the globe.

I hadn’t heard this story before, and it’s well-worth a read.

Going Critical

This article is a repost promoting content originally published elsewhere. See more things Dan's reposted.

If you’ve spent any time thinking about complex systems, you surely understand the importance of networks.
Networks rule our world. From the chemical reaction pathways inside a cell, to the web of relationships in an ecosystem, to the trade and political networks that shape the course of history.
Or consider this very post you’re reading. You probably found it on a social network, downloaded it from a computer network, and are currently deciphering it with your neural network.
But as much as I’ve thought about networks over the years, I didn’t appreciate (until very recently) the importance of simple diffusion.
This is our topic for today: the way things move and spread, somewhat chaotically, across a network. Some examples to whet the appetite:
  • Infectious diseases jumping from host to host within a population
  • Memes spreading across a follower graph on social media
  • A wildfire breaking out across a landscape
  • Ideas and practices diffusing through a culture
  • Neutrons cascading through a hunk of enriched uranium
A quick note about form.
Unlike all my previous work, this essay is interactive. There will be sliders to pull, buttons to push, and things that dance around on the screen. I’m pretty excited about this, and I hope you are too.
So let’s get to it. Our first order of business is to develop a visual vocabulary for diffusion across networks.

A simple model

I’m sure you all know the basics of a network, i.e., nodes + edges.
To study diffusion, the only thing we need to add is labeling certain nodes as active. Or, as the epidemiologists like to say, infected:
This activation or infection is what will be diffusing across the network. It spreads from node to node according to rules we’ll develop below.
Now, real-world networks are typically far bigger than this simple 7-node network. They’re also far messier. But in order to simplify — we’re building a toy model here — we’re going to look at grid or lattice networks throughout this post.
(What a grid lacks in realism, it makes up for in being easy to draw ;)
Except where otherwise specified, the nodes in our grid will have 4 neighbors, like so:
And we should imagine that these grids extend out infinitely in all directions. In other words, we’re not interested in behavior that happens only at the edges of the network, or as a result of small populations.
Given that grid networks are so regular, we can simplify by drawing them as pixel grids. These two images represent the same network, for example:
Alright, let’s get interactive.

Fabulous (interactive! – click through for the full thing to see for yourself) exploration of network interactions with applications for understanding epidemics, memes, science, fashion, and much more. Plus Kevin’s made the whole thing CC0 so everybody can share and make use of his work. Treat as a longread with some opportunities to play as you go along.

Danny Daycare

This article is a repost promoting content originally published elsewhere. See more things Dan's reposted.

“Have you had a good wee day out?”

This isn’t how I behave when I’m out cycling with one of our little ‘uns in tow. But sometimes, just sometimes, when I see a solid-looking jump… I wish it could be. Honestly: our eldest would be well up for this! (And would probably be quite disappointed to sit around until the end where they reveal that, obviously, they swapped the small child for a doll for many of the shots.)

Accessibility Resources

This article is a repost promoting content originally published elsewhere. See more things Dan's reposted.

As it’s Global Accessibility Awareness, I’m sharing a list of accessibility resources that I regularly refer to. Happy reading, watching and listening!

A fabulously-useful concise list of some of the hottest articles, books, and webinars on accessibility in web development; saved for my later convenience.