Erste Etappe des Eifelsteigs bezwungen

Am Montagmorgen fuhren Ina und ich nach Kornelimünster um dort die erste Etappe des Eifelsteigs zu starten. Das Wetter meinte es gut mit uns – etwas zu gut vielleicht, denn gegen Mittag sollte es 36 °C heiß werden. Also hofften wir, vor Erreichen der Mittagshitze das Etappenziel Roetgen zu erreichen.

Weiterlesen …

Marc war hier: Gaststätte "Zur Bahn"

Kleine Abkühlung gönnen. 🥵

Oye Beltalowda!

Ich trage ja selten schwarz, aber das hier könnte mein neues Lieblingsshirt werden! ✊🏼

Vary: Service Worker

Über Monate war der Service Worker meines Kegelclubs defekt: Zwar wurden Seiten aus dem Cache geholt, wenn man offline war, aber eben nicht die Kegelspiele – und gerade für die war doch dieses tolle Feature gedacht, sitzen wir doch oft auf Kegelbahnen ohne stabiles Internet!

Wie sich herausgestellt hat, war mein Wille, HTTP-konform zu sein, Schuld daran: Ich liefere unter einer URI mehrere Ressourcen aus, je nach Accept-Header. Die Kegelspiele können also in verschiedenen Varianten (HTML, JSON, XML, Markdown) abgefragt werden:

Accept: text/html
GET https://kegelclub-tüddern.de/kegelspiele/grosse-hausnummer

<!doctype html>
...
Accept: application/json
GET https://kegelclub-tüddern.de/kegelspiele/grosse-hausnummer

{
  ...

Gedacht war das mal für eine potentielle iOS-App, um direkt eine JSON-Repräsentation zu haben. Ohje … 🤷🏻‍♂️ Pro-Tipp: Baut keine APIs, bevor Ihr sie nicht auch braucht!

Aber nun gut. HTTP-Konformität, hm? Also ein ganz kleiner Exkurs: Wenn sich die Response einer URI aufgrund eines beliebigen Request-Headers ändern kann, so muss man diese Request-Header mit dem Vary-Response-Header auflisten. In meinem Fall ist das:

Vary: Accept, Accept-Encoding

Den Header setzt man vor allem wegen Caching:

The Vary HTTP response header determines how to match future request headers to decide whether a cached response can be used rather than requesting a fresh one from the origin server. It is used by the server to indicate which headers it used when selecting a representation of a resource in a content negotiation algorithm.

Wegen Caching! Dieser Vary-Header war der Grund für den defekten Service Worker, denn Letzterer versuchte nun immer, diese eine Ressource direkt aus dem Netz statt aus dem Cache zu holen!

Die Lösung im Service Worker ist ignoreVary:

// cache will not be used for requests with Vary header, response is undefined
const response = await caches.match(request);

// cache will ignore Vary header, response is the cached ressource
const response = await caches.match(request, { ignoreVary: true });

Aaaalter … Das hat mich heute Abend gute drei Stunden Ausprobier- und Suchzeit gekostet. Aber hey, wieder was gelernt! 😓

Marc war hier: Star Tankstelle

Ich komme also inzwischen gut fünf Monate mit einer Tankfüllung aus. ⛽️

Lange Attributwerte in den Firefox Devtools

Martin ärgert sich, dass lange Attributwerte in den Firefox Devtools gekürzt werden. Hat es mich auch schon einige Male.

Aber: Man kann das abschalten, wie ich erst neulich herausfand!

Der einfachste Weg geht über die Devtools-Einstellungen. „Truncate DOM attributes“ abhaken, fertig.

Wer es etwas granularer einstellen möchte, kann devtools.markup.collapse* in about:config bemühen.

Statische Ressourcen besser cachen

Ich habe vor einigen Wochen die Website meines Musikvereins einem Relaunch unterzogen. Nicht nur das Frontend ist erneuert, auch den kompletten technischen Unterbau habe ich neu geschrieben. So ist auch das Caching statischer Ressourcen neu, also CSS, Skripte oder Bilder. Im Folgenden beschreibe ich, was ich getan habe. Vorab: Ich nutze kein CMS oder Framework.

Weiterlesen …

Philips Hue mit macOS steuern

Gerade, als das Licht im Schlafzimmer etwas zu früh automatisch ausging, ich aber noch am iMac das Internet durchlas, wollte ich zunächst das Licht wieder mit der iOS-App einschalten. Aber: „Da muss es doch auch was für macOS geben!“

Kurz DuckDuckGo bemüht, siehe da: Robert Hahn hat We Love Lights entwickelt! Das ist eine schicke kleine Menubar-App, die sich mit der Hue-Bridge verbindet und so tatsächlich alle Lampen kontrollieren kann.

Warum nehme ich nicht Apples eigene Home-App? Zum einen ist die unter macOS ein ziemliches Usability-Verbrechen, zum anderen sieht sie Third-Party-Lampen nicht: Das betrifft sowohl Ikeas Trådfri-Lampen (die zufällig die im Schlafzimmer sind) als auch den tint-Lightstrip vom Aldi in der Küche.