This map shows all the blinking beacons from OpenStreetMap. More specifically, it asks the Overpass API for all elements with an seamark:light:sequence attribute, decodes these, and displays them as coloured circles on the map using Leaflet. It also tries to take the seamark:light:range and seamark:light:colour into account.
The cool part is that the size and colors of the dots are accurate, as are the blinking patterns.
I recently enjoyed reading Hidde de Vries‘s post (that was a talk) on Semantics:
One of the web’s killer features is that it comes with a language for shared semantics. When used right, HTML helps us build websites and apps that work for a broad range of users. Let’s look at what semantics are and how to get them right.
In a world where bootcamps are skipping out on the foundations, articles like these are more important than ever.
The author of the Have I Been Pwnd website got a nasty surprise: an AU $5,000 bill from Azure (that eventually racked up to $11,000). The culprit: a sudden spike of outgoing bandwidth due to a file no longer being cached properly.
I guess I’m looking at this a bit like the last time I lost data due to a hard disk failure. I always knew there was a risk but until it actually happened, I didn’t take the necessary steps to protect against that risk doing actual damage. But hey, it could have been so much worse; that number could have been 10x higher and I wouldn’t have known any earlier.
Let this be a reminder to set up data and billing alerts for your cloud services.
In CSS you can do feature detection using @supports. With it you can detect support for property-value pairs and selectors. What currently isn’t possible though, is to detect support for certain at-rules (such as @layer, @scroll-timeline, etc.)
Hot off the press is a new CSS Working Group decision that defines the at-rule function — to be combined with @supports — which will allow just that.
Thankfully I could use a workaround by checking for support of a “telltale” property: animation-timeline: Browsers that have implemented @scroll-timeline, also have implemented the animation-timeline property. By checking for animation-timeline‘s existence, we can feature detect support for @scroll-timeline.