„Evergreen“ bedeutet nicht sofort verfügbar

Ich habe einen Kollegen, der intelligent, fähig und technologisch versiert ist. Wie ich arbeiten sie Vollzeit im Web.

Wenn sie ihren Bildschirm in einem Meeting teilen, ertappe ich mich dabei, wie ich mich von dem roten Update-Button in ihrer Chrome-Kopie distanziere fixiere.

Das Klicken auf diesen Button würde den Prozess zum Aktualisieren von Chrome auf die neueste stabile Version starten.

Ich habe einige bohrende Fragen dazu gestellt, wie oft sie neu starten, was Chrome auch beim erneuten Start zum Aktualisieren zwingen würde. Das ist doch der Sinn eines „Evergreen“-Browsers, oder? Es ist einfach, sicherzustellen, dass man immer die neueste und beste Version verwendet.

Es stellt sich heraus, dass sie lieber warten, bis sie es unbedingt tun müssen, wegen der Störung, die es in ihrem täglichen Arbeitsablauf verursachen würde. Ihr Verhalten ist sinnvoll. Sie priorisieren die Qualität ihrer gesamten Computererfahrung, anstatt den Anforderungen einer einzelnen spezifischen App nachzugeben.

Wie ich verwendet mein Kollege ebenfalls einen High-End-Laptop, um Dinge zu erledigen. Das bedeutet, dass der Laptop monatelang ohne Neustart auskommen kann. Ironischerweise könnte dies eine Situation sein, in der ein Schrott-Laptop bedingt zu einem schnelleren Browser-Upgrade-Pfad gezwungen wird.

Evergreen-Browser

Vor dem Aufkommen von Evergreen-Browsern musste man die Website des Herstellers besuchen und das Update manuell herunterladen und installieren. Davor musste man eine CD oder Diskette verwenden.

Im Gegensatz dazu ist ein Evergreen-Browser jeder Browser, der sich automatisch aktualisieren kann. Damit meine ich, dass der Browser den Code, der zur Hinzufügung neuer Funktionen und zur Behebung von Fehlern erforderlich ist, automatisch herunterlädt, sobald er vom Hersteller des Browsers veröffentlicht wurde. Das Update selbst erfolgt mit

• einer Aufforderung an die Person, die den Browser verwendet, die einen Anwendungsneustart auslöst,
• einem Download, der im Hintergrund erfolgt und beim Neustart der Anwendung angewendet wird, oder
• beim Neustart des Geräts.

Die Browser selbst

Nahezu alle großen Browser sind Evergreen. Dazu gehören Google Chrome, Microsoft Edge und Mozilla Firefox.

Apple Safari ist quasi-Evergreen. Damit meine ich, dass er automatisch Updates erhält, aber umständlicherweise über die macOS-Betriebssystem-Update-Oberfläche aktualisiert werden muss, wo sich auch andere systemweite Updates befinden.

Wenn Sie nicht aufgepasst haben, hat das Safari-Team in den letzten Monaten eine Menge Verbesserungen an seinem Browser vorgenommen – ich würde mir wünschen, dass sie diesen Trend fortsetzen, indem sie den Update-Pfad des Browsers von den bestehenden macOS- und iOS-Upgrade-Workflows entkoppeln.

Die Situation

Mit dem tatsächlichen, endgültigen, nein-wirklich-diesmal-meinen-wir-es-ernst-Tod von Internet Explorer sind Evergreen-Browser nun die Hauptüberlegung für Desktop- und Laptop-Browser. Das ist großartig! Es bedeutet, dass wir viel weniger Zeit mit der Sorge verbringen können, wer was nutzen kann.

Weniger Zeit zu verbringen bedeutet jedoch nicht, keine Zeit zu verbringen.

Verzögerte Effekte

Unterstützung von allen Evergreen-Browsern auf caniuse.com bedeutet nicht unbedingt, dass die Unterstützung auf dem Gerät einer Person vorhanden ist – noch nicht veröffentlichte Updates werden nicht automatisch sofort angewendet.

Aufgrund dieser beiden Faktoren plädiere ich dafür, Ihre Aufregung mit etwas Zurückhaltung zu dämpfen. Es kann sehr verlockend sein, zu neuen und glänzenden Dingen zu eilen. Glauben Sie mir, ich bin von diesem Drang nicht ausgenommen – CSS wird gerade von großartig zu fantastisch, und der Drang, neue Funktionen zu nutzen, ist sehr real.

Warten Sie stattdessen ein wenig. Arbeiten Sie mit der Fähigkeit der Plattform, progressiv verbesserte Erlebnisse mit CSS und JavaScript zu schaffen.

Nutzen Sie die Plattform

Das Web ist wirklich gut darin, widerstandsfähig zu sein, vorausgesetzt, Sie arbeiten mit seinem Korn.

Sowohl CSS als auch JavaScript haben die Fähigkeit, bedingt Erlebnisse für Browser bereitzustellen, die neue Funktionen unterstützen, während Alternativen für diejenigen angeboten werden, die dies nicht tun.

Anstatt die Support-Tabelle für etwas auf caniuse.com anzusehen und zu denken: „Ich wünschte, mehr Browser würden diese Funktion unterstützen, damit ich sie nutzen kann!“, können Sie stattdessen denken: „Ich werde diese Funktion heute nutzen, aber sie als experimentelle Funktion behandeln.“

— Jeremy Keith, „Continuous partial browser support“

JavaScript

Sie können JavaScript verwenden, um abzufragen, ob ein Browser eine bestimmte Funktion unterstützt oder nicht. Zum Beispiel bietet die Navigator-Schnittstelle einen Mechanismus zur Abfrage der Fähigkeiten eines User-Agents.

if (!(“geolocation” in navigator)) {
  // Logic if a user's current geographic location isn't available
} else {
  // Logic that is based on a user's current geographic location
}

In diesem Beispiel invertiere ich eine Anfrage zur Unterstützung der Geolocation-Schnittstelle eines Browsers. Obwohl die Syntax anfangs etwas verwirrend zu durchdringen ist, unterstreicht sie einen Ansatz der progressiven Verbesserung.

Gehen Sie zunächst davon aus, dass die Geolocation-Funktionalität nicht unterstützt wird, und bieten Sie eine Möglichkeit, die Person, die diesen Browser verwendet, zu berücksichtigen (z. B. manuelles Eingeben einer Postleitzahl usw.). Wenn dieser Anwendungsfall abgedeckt ist, können Sie dann beruhigt eine Erfahrung für Browser aufbauen, die Geolocation unterstützen.

Dieses Denken erstreckt sich auch auf alle anderen Browserfunktionen und -fähigkeiten.

CSS

Wie die meisten anderen Programmiersprachen können wir auch in CSS „if“-ähnliche Anweisungen verwenden.

Zum Beispiel erlaubt die @supports-Regel, eine bedingte Anweisung zu erstellen, die gezielt darauf abzielt, ob ein Browser etwas unterstützt oder nicht, und dann eine Logik darauf anzuwenden. Browser, die die Funktion berücksichtigen, werden diese Stile verwenden, und Browser, die dies nicht tun, werden sie ignorieren. Es ist eine prägnante, clevere und anpassungsfähige Lösung.

.component {
  /* Base appearance */
}

@supports (grid-template-columns: subgrid;) {
  .component {
    /* Styling and positioning enhancement tweaks if subgrid is supported */
  }
}

In diesem Beispiel stellt dieser Ansatz der progressiven Verbesserung sicher, dass der Inhalt und die Funktionalität einer Komponente für jeden Browser erhalten bleiben, erstellt aber nur schicke Layouts für Browser, die sie unterstützen können.

Wann kann ich diesen Kram entfernen?

Ja, dieser Ansatz fügt mehr Code hinzu, und mehr Code bedeutet mehr Komplexität und Wartung. Aber es ist sehr wichtiger Code. Man könnte ihn sogar als technische Schuld bezeichnen, und das wäre richtig. Aber technische Schuld kann eine gute Sache sein, wie eine Investition in die Zukunft.

Sie möchten diese Komplexität vielleicht entfernen, wenn sie nicht mehr benötigt wird. Der richtige Zeitpunkt dafür im Zeitalter der Evergreen-Browser ist schwierig zu wissen, aber ich habe ein paar Vorschläge

Geduld ist eine Tugend

Was das Warten angeht, würde ich konservativ etwa 6 Monate ab Veröffentlichung einer neuen Funktion empfehlen, bevor man überhaupt daran denkt zu untersuchen, ob man die Funktionserkennung entfernen kann. Dies berücksichtigt

• Neustarts
• Update-Aufschieber
• Update-Vermeider
• Hardware-Refresh-Zyklen
• Unternehmens-Update-Richtlinien,
• usw.

Ich würde auch sagen, dass dieser grobe Sechs-Monats-Zeitraum sich auf ein allgemeines, globales Web-Publikum bezieht. Diese Schätzung ändert sich, wenn Sie ein spezialisiertes Publikum ansprechen. Wie man weiß, wen man tatsächlich bedient? Analysen, ja, aber auch Gespräche mit Leuten.

Vielleicht lieber nicht

Denken Sie daran: Überlebenden-Bias ist real. Verhindert die brandneue Funktion, die Sie verwenden, dass jemand Ihre Website oder Web-App nutzen kann? Ich sage das, weil manche Leute

• gezwungen sind, ein Gerät zu verwenden, das von einem Dritten verwaltet wird,
• bewusst die Aktualisierung ihrer Hard- und Software vermeiden, aus Angst, die Fähigkeit, mit der Welt zu interagieren, zu verlieren,
• verstehen, dass ihr Gerät das Problem ist, aber nicht wissen, wie sie es beheben können, und
• „tote“ Evergreen-Browser verwenden, Geräte, die früher Browser-Updates erhielten, aber nicht mehr vom Hersteller unterstützt werden.

Es gibt kein einzelnes, spezifisches Gerät, keinen Browser und keine Person, die wir bei der Erstellung einer Web-Erfahrung ansprechen. Websites und Web-Apps müssen sich an eine nahezu unendliche Kombination dieser Umstände anpassen, um effektiv zu sein. Diese Anpassungsfähigkeit ist ein großer Teil dessen, was das Web zu einem so erfolgreichen Medium macht.

Erwägen Sie, die harte Arbeit zu leisten, um es einfach zu machen, und entfernen Sie nie Feature-Abfragen und @supports-Anweisungen. Dies schafft einen robusten Ansatz, der sich an die Vergangenheit und die Zukunft anpassen kann.

Die Zukunft ist ungewiss

Wir sind längst über das Zeitalter der Desktop-Computer hinaus. Browser tauchen an immer mehr Orten auf: Handys, Tablets, Uhren, E-Book-Reader, Digitalkameras, Kioske, Fernseher, Heimassistenten, Verkaufsautomaten, Bilderrahmen, grafikfähige Taschenrechner, Geldautomaten, Kassenterminals, Fitnessgeräte, Videospielkonsolen, Werbetafeln, Kühlschränke, Virtual Reality und Autos.

Wer weiß, mit welchen Geräten Browser in Zukunft ausgeliefert werden oder welche Fähigkeiten sie haben werden? Machen Sie sich zukunftssicher (und, äh, vergangenheitsicher) mit einem Ansatz, der dies berücksichtigt.

---

Vielen Dank an Jim Nielsen für ihr Feedback.