Monatliches Webentwicklungs-Update 4⁄2018: Über Anstrengung, Voreingenommenheit und Produktivität

Langfristig zu denken ist heutzutage eine der größten Herausforderungen. In einer Welt, in der wir mit Geräten leben, die nur ein paar Monate oder vielleicht ein paar Jahre halten, in der wir Dinge kaufen, um sie nur Tage oder Wochen später wegzuwerfen, gewinnt der Begriff „Anstrengung“ eine neue Bedeutung.

Kürzlich las ich einen Aufsatz über „Yatnah“, „Anstrengung“. Ich habe in den letzten Wochen viel Zeit draußen in der Natur verbracht und einen kleinen Acker angelegt, um etwas Gemüse anzubauen. Ich nahm auch an einem Workshop teil, um das Handwerk des Pfropfens von Obstbäumen zu erlernen. Wenn Sie einen Baum fällen, stellen Sie fest, dass sich unser schnelllebiger, kurzfristiger Lebensstil stark von der Funktionsweise der Natur unterscheidet. Ich habe einen Baum gepfropft, der jahrzehntelang wachsen soll, und wenn Sie einen Baum fällen, der vierzig Jahre dort steht, braucht es weitere vierzig, um einen ähnlich hohen zu züchten.

Ich würde es lieben, wenn wir alle versuchen, langlebigere Arbeit zu schaffen , Software, die in einem Jahrzehnt funktioniert, und uns dafür Mühe geben, zu lernen, wie wir das erreichen können. So long, ich werde Sie mit diesem Zitat und einer Reihe interessanter Artikel verlassen.

„In unserer modernen Welt kann es verlockend sein, Anstrengung wegzuwerfen und sie durch ein paar Sätze positiven Denkens zu ersetzen. Aber Übung ist einfach durch nichts zu ersetzen.“

– Kino Macgregor

Nachrichten

• Die Safari Technology Preview 52 entfernt die Unterstützung für alle NPAPI-Plug-Ins außer Adobe Flash und fügt Unterstützung für preconnect Link-Header hinzu.
• Chrome 66 Beta enthält das CSS Typed Object Model, die Async Clipboard API, AudioWorklets und die Unterstützung für die Verwendung von calc() , min() und max() in Medienabfragen. Außerdem unterstützen select und textarea Felder jetzt das autocomplete Attribut, und die catch -Klausel einer try Anweisung kann von nun an ohne Parameter verwendet werden.
• iOS 11.3 ist jetzt öffentlich verfügbar, und wie bereits angekündigt, bringt die Veröffentlichung Unterstützung für Progressive Web Apps auf iOS. Maximiliano Firtman teilt mit, was das bedeutet, was funktioniert und was (noch) nicht funktioniert.
• Safari 11.1 ist jetzt für alle verfügbar. Hier ist eine Zusammenfassung aller neuen WebKit-Funktionen, die es enthält.

Allgemein

• Anil Dash reflektiert darüber, was das Web sein sollte und wie sich das heutige Web davon unterscheidet: „In einer Zeit, in der Millionen das Vertrauen in die größten Websites des Webs verlieren, lohnt es sich, die Idee zu überdenken, dass das Web aus unzähligen bestehen sollte kleine Seiten. Hier ist ein Blick auf die vernachlässigten Technologien, die dies ermöglichen sollten.“
• Morten Rand-Hendriksen schrieb über die Verwendung von Ethik im Webdesign und darüber, welche Fragen wir uns stellen sollten, wenn wir eine Lösung vorschlagen, ein Design oder ein neues Feature erstellen. Gerade wenn wir denken, dass wir etwas „Smartes“ machen, ist es wichtig, zuerst die Frage zu stellen, ob es den Menschen wirklich hilft.
• Die Facebook/Cambridge Analytica-Affäre hat viel Protest und Diskussionen ausgelöst, wobei die meisten auf die technologischen Probleme mit dem Berechtigungsmodell von Facebook hingewiesen haben. Aber die Krux liegt darin, wie Facebook sein Unternehmen konzipiert hat und welche ethischen Grundlinien es gesetzt hat. Wenn wir nicht wollen, dass so etwas noch einmal passiert, liegt es an uns, den Service zu gestalten, den wir wollen.
• Brendan Dawes teilt mit, warum er URLs für ein Meisterwerk und eine Benutzererfahrung an sich hält.
• Charlie Owens Redetranskription von „Dear Developer, The Web Isn’t About You“ ist eine gute Zusammenfassung, warum wir als Entwickler über das hinausdenken müssen, was gut für uns ist, und überlegen, was den Benutzern dient und wie wir dies stattdessen erreichen können.

UI/UX

• B. Kaan Kavustuk teilt seine Gedanken darüber, warum wir nicht in der Lage sein werden, beim ersten Versuch ein perfektes Design oder eine perfekte Codebasis zu erstellen, egal wie viel Erfahrung wir haben. Stattdessen sind es die ständigen kleinen Verbesserungen, die den Weg zur Perfektion ebnen.
• Trine Falbe führt uns mit einem praktischen Einstiegsleitfaden in Ethical Design ein. Es zeigt Alternativen und Dinge, über die man beim Aufbau eines Unternehmens oder Produkts nachdenken sollte. Es spielt keine Rolle, ob Sie Eigentümer, Entwickler, Designer oder Verkäufer sind, es geht darum, den Benutzern zu dienen und die Grundlage für echtes und nachhaltiges Vertrauen zu schaffen.
• Josh Lovejoy teilt seine Erkenntnisse aus der Arbeit an integrativen Technologielösungen und warum es mehr als gute Absichten braucht, um faire, inklusive Technologie zu schaffen. Dieser Artikel geht eingehend darauf ein, warum menschliches Urteilsvermögen sehr schwierig ist und oft auf Voreingenommenheit basiert und warum es aus diesem Grund nicht einfach ist, Algorithmen zu entwerfen und zu entwickeln, die verschiedene Menschen gleich behandeln.
• Das HSB-Farbsystem (Farbton, Sättigung, Helligkeit) ist nicht besonders neu, aber viele Leute verstehen seine Vorteile immer noch nicht. Erik D. Kennedy erklärt seine Prinzipien und Vorteile Schritt für Schritt.
• Obwohl heutzutage mehr über inklusives Design diskutiert wird, wird es oft unter dem Hut der Barrierefreiheit oder als technische Entscheidung gesehen. Robert del Prado teilt nun mit, wie wichtig inklusives Designdenken ist und warum es viel mehr um den allgemeinen Benutzer geht als um bestimmte Menschen mit bestimmten Behinderungen. Inklusives Design bringt Menschen zusammen, unabhängig davon, wer sie sind, wo sie leben und was sie sich leisten können. Und ist es nicht das Ziel jedes Produktes, durch möglichst viele Menschen erfolgreich zu sein? Vielleicht müssen wir das auch mit Marketingleuten besprechen.
• Anton Lovchikov teilt Wege zur Verbesserung optischer Anpassungen in Komponenten. Es ist eine interessante Studie darüber, wie sehr kleine Änderungen einen großen Unterschied machen können.

Werkzeuge

• Brian Schrader hat eine unbekannte Funktion in Git gefunden, die sehr hilfreich ist, um Ideen schnell zu testen: Mit Git Notes können wir an Objekte angehängte Notizen hinzufügen, entfernen oder lesen, ohne die Objekte selbst zu berühren und ohne den aktuellen Zustand festschreiben zu müssen.
• Für viele Projekte bevorzuge ich die Verwendung von npm-Skripten gegenüber dem Aufruf von gulp oder direkten Webpack-Aufgaben. Michael Kuhnel teilt einige nützliche Tricks für npm-Skripte, darunter das Zulassen von CLI-Optionsparametern oder das Überwachen von Aufgaben und Warnmeldungen bei Fehlern.
• Anton Sten erklärt, warum neue Werkzeuge nicht immer gleich Produktivität sind. Wir alle lieben neue Design-Tools, und es tauchen immer wieder neue wie Sketch, Figma, Xd oder Invision Studio auf. Aber obwohl diese Tools viele gängige Probleme lösen und einige Dinge einfacher machen, geht es bei der Produktivität hauptsächlich darum, was für Ihr Problem funktioniert, und nicht darum, was neu ist. Wenn Sie ein statisches Modell erstellen müssen und Photoshop das ist, was Sie am besten können, warum verwenden Sie es nicht?
• Es gibt einen neuen, schnellen DNS-Dienst von Cloudflare. Endlich eine bessere Alternative zu den viel genutzten Google-DNS-Servern, verfügbar unter 1.1.1.1 . Das neue DNS ist das schnellste und wahrscheinlich auch eines der sichersten auf dem Markt. Cloudflare hat sich viel Mühe gegeben, den Dienst zu verschlüsseln und sich mit Mozilla zusammenzutun, damit DNS über HTTPS funktioniert, um eine große Datenschutzlücke zu schließen, die bisher alle Ihre Browserdaten an den DNS-Anbieter weitergegeben hat.
• Ich habe schon viel über iOS Machine Learning gehört, aber trotz der interessanten Tatsache, dass sie dies auf dem Gerät tun können, ohne alles an eine Cloud zu senden, habe ich noch nicht herausgefunden, wie man dies für Apps nutzen kann. Zum Glück hat Manu Rink eine nette Anleitung zusammengestellt, in der sie maschinelles Lernen in iOS für Anfänger erklärt.
• Es gibt großartige Neuigkeiten für Git-GUI-Fans: Tower bietet jetzt eine neue Beta-Version an, die Pull-Request-Unterstützung, interaktive Rebase-Workflows, Schnellaktionen, Reflog und Suche umfasst. Ein erstaunliches Update, das die Arbeit mit der Software viel schneller macht als zuvor, und selbst für mich als Befehlszeilenliebhaber eine nette Option.

Sicherheit

• HTTP Strict Transport Security (HSTS), insbesondere beim Vorladen, gilt seit langem als eine der besten Sicherheitsfunktionen, um sicherzustellen, dass sich ein Browser nur sicher mit einem Hostnamen verbindet. Werbetreibende haben jedoch einen Weg gefunden, Benutzer mit HSTS zu verfolgen und es als dauerhafte standortübergreifende Kennung (bekannt als „Super-Cookie“) zu verwenden. Die WebKit-Entwickler haben jetzt reagiert und zum Schutz der Privatsphäre ihrer Nutzer die Zuverlässigkeit von HSTS geschwächt, indem sie den Umfang der Hostnamen eingeschränkt und einen HSTS-Zustand für Subressourcenanfragen an blockierte Domains ignoriert haben.
• PagerDuty hat gerade eine Open-Source-Version seines internen Sicherheitsschulungsmaterials veröffentlicht, das voller interessanter und leicht verständlicher Erklärungen zu gängigen Sicherheitsproblemen und -strategien ist. Dies ist besonders nützlich, da Sie es Personen ohne technische Erfahrung geben können.
• Christoph Rumpel teilt mit, wie er einen Weg gefunden hat, seine Inhaltssicherheitsrichtlinie mit dem Laravel Response Caching-Paket zu verwenden.
• Während Argon2 der aktuelle Best-Practice-Algorithmus für Hashing (z. B. Passwörter) ist, gibt es ein paar Dinge, auf die sich Entwickler vorbereiten müssen. Zum Beispiel ist es einfach, mit Argon2 selbst zu DOSieren, also müssen Sie Abfragen einschränken.
• James Fisher zeigt eine interessante Möglichkeit, Gmail-Benutzer zu betrügen, wie am Beispiel von Netflix gezeigt wird.

Webleistung

• Diese Woche tauchte eine Diskussion darüber auf, ob die Technik des Bereitstellens komprimierter Bilder immer noch eine gute Idee ist. Tim Kadlec nahm es zum Anlass, es noch einmal zu überdenken. Er kommt nun zu dem Schluss, dass wir die komprimierte Bildtechnik wegen ihres großen Speicherbedarfs nicht mehr sizes und stattdessen auf neue responsive Bildtechnologien wie das Element <picture> oder die Attribute srcset und size setzen sollten.
• Eric Portis teilt die verborgenen Prinzipien der w -Deskriptoren und des sizes für Bilder. Ein ziemlich technischer, aber aufschlussreicher Beitrag, der Sie endlich die Magie hinter diesen neuen responsiven Bildattributen verstehen lässt.
• Tim Oxley erzählt, warum er es vorzieht, früh zurückzukehren und wo immer möglich else Dinge zu vermeiden. Das ist etwas, was ich am Anfang meiner Karriere gemacht habe, dann irgendwann verloren habe, aber kürzlich wieder darauf zurückgekommen bin. Besonders die reduzierte Komplexität und einfachere Logik in Funktionen ist hier für mich ein entscheidender Vorteil.
• Jeremy Wagner teilt Best Practices zum Erstellen eines Lazy-Loading-Mechanismus für Bilder und Videos. Es ist definitiv nicht die schnellste Lösung, aber die Ressource teilt mit, wie man die beste Erfahrung und Leistung basierend auf den neuesten Technologien, die in Browsern verfügbar sind, aufbaut.

Barrierefreiheit

• Marcy Sutton erklärt, was neu in Axe 3.0 ist, das jetzt Shadow DOM unterstützt und das Sie in Ihrer automatisierten Testsuite ausführen können.
• Patrick H. Laucke teilt mit, worum es beim neuen :focus-visible CSS-Pseudoselektor geht und wie wir ihn schreiben müssen, um die Abwärtskompatibilität mit Browsern zu gewährleisten, die ihn noch nicht unterstützen.
• Marco Zehe stellt uns den neuen Accessibility Inspector in den Firefox Developer Tools vor. Das sind großartige Neuigkeiten, die dazu beitragen, die Untersuchung von Barrierefreiheitsproblemen viel einfacher als früher zu machen.

CSS

• Amber Wilson teilt einige Einblicke, wie es sich anfühlt, in ein komplexes Projekt geworfen zu werden, um dort das Styling zu übernehmen. Sie sagt zu Recht, dass „niemand gesagt hat, dass CSS einfach ist“, und bringt zum Ausdruck, wie wichtig es ist, dass wir als Entwickler uns unbequemen Situationen stellen, um unser Wissen zu erweitern.
• Ana Tudor ist bekannt für ihre besonderen CSS-Fähigkeiten. Jetzt untersucht und beschreibt sie, wie wir mit einigen cleveren Tricks geschwungene Ecken in CSS erreichen können.

JavaScript

• WebKit hat ein Upgrade für die Zwischenablage-API erhalten, und das Team gibt einige sehr interessante Einblicke, wie es funktioniert und wie Safari einige der häufigsten Herausforderungen mit Zwischenablagedaten (z. B. Bildern) handhabt.
• Wenn Sie mit Schlüsselwertspeichern arbeiten, die nur im Frontend vorhanden sind, ist IDB-Keyval eine großartige, leichtgewichtige Bibliothek, die die Arbeit mit IndexedDB und localStorage vereinfacht.
• Wollten Sie schon immer Grafiken aus Ihren Daten mit einem handgezeichneten, skizzenhaften Look auf einer Website erstellen? Mit Rough.js können Sie genau das tun. Es basiert normalerweise auf Canvas (für eine bessere Leistung und weniger Daten), kann aber auch SVG-Pfade zeichnen.
• Wenn Sie ein Drag-and-Drop-Neuordnungsmodul benötigen, gibt es jetzt eine reibungslose und zugängliche Lösung: Dragon-Drop.
• Viele Jahre lang konnten wir CSS-Werte nur in ihrem berechneten Wert erhalten, und selbst das war weder flexibel noch angenehm zu handhaben. Aber jetzt hat CSS eine richtige objektbasierte API für die Arbeit mit Werten in JavaScript: das CSS Typed Object Model. Es ist bisher nur im kommenden Chrome 66 verfügbar, aber definitiv eine vielversprechende Funktion, die ich gerne bald in meinem Code verwenden würde.
• Die React.js-Dokumentation enthält jetzt einen zusätzlichen Abschnitt, der erklärt, wie Sie Fokuszustände einfach und programmgesteuert verwalten können, um sicherzustellen, dass Ihre Benutzeroberfläche zugänglich ist.
• James Milner teilt mit, wie wir abortable fetch verwenden können, um Anfragen abzubrechen.
• Es gibt bereits einige Artikel über Web-Push-Benachrichtigungen, aber Oleksii Rudenkos Einführungsleitfaden ist eine großartige Einführung, die die Prinzipien sehr gut erklärt.
• In den letzten Jahren haben wir viele neue Funktionen auf der JavaScript-Plattform bekommen. Und da es schwer ist, sich all die neuen Dinge zu merken, fasste Raja Rao DV zusammen: „Alles neu in ECMAScript 2016, 2017 und 2018“.

Arbeitsleben

• Um das Bewusstsein dafür zu schärfen, wie häufig solche Situationen für uns alle sind, teilt James Bennett eine peinliche Situation, in der er einen einfachen Fehler gemacht hat, den er lange nicht herausgefunden hat. Nicht nur ich mache Fehler, nicht nur du und nicht nur James – wir alle machen Fehler, und so peinlich sie in dieser speziellen Situation auch zu sein scheinen, es gibt nichts, worüber man sich schlecht fühlen müsste.
• Adam Blanchard sagt: „Menschen sind Maschinen. Wir brauchen auch Wartung.“ und erstellt einen Vergleich für Ingenieure, um zu verstehen, warum wir uns um uns selbst kümmern müssen und warum wir Menschen brauchen, die sich um uns kümmern. Dies ist ein Einblick in die Arbeit von People Engineers und warum es für Unternehmen so wichtig ist, solche Leute einzustellen, um sicherzustellen, dass ein Team gesund ist.
• Wenn es eine Sache gibt, über die wir in der Webbranche nicht viel reden, dann ist es der Ruhestand. Jan Chipchase hat nun viele interessante Gedanken rund um den Ruhestand geschrieben.
• Rebecca Downes teilt einige Einblicke in ihre Promotion über Remote-Teams und zeigt, unter welchen Umständen Remote-Teams großartig sind und unter welchen nicht.

Darüber hinausgehen…

• Jetzt, wo wir die Probleme zentralisierter Dienste wie Facebook und Google diskutieren, wird die Dezentralisierung als Retter des unabhängigen Webs angesehen. Aber ich bin mir sicher, dass sich nichts ändern wird, wenn wir nicht versuchen, das zugrunde liegende humanitäre Problem mit Technologie zu lösen.
• Vielleicht haben Sie die Nachrichten über den ersten tödlichen Unfall mit einem selbstfahrenden Auto gelesen. Ein trauriger Meilenstein, der zeigt, wie unzuverlässig diese Technologie sein kann und wie weit wir noch davon entfernt sind, uns auf solche Systeme verlassen zu können.
• Vor einem Jahrzehnt versprachen intelligente Geräte, die Art und Weise, wie wir denken und interagieren, zu verändern, und das haben sie auch getan – aber nicht, indem sie uns intelligenter machten. Eric Andrew-Gee untersucht die wissenschaftlichen Beweise dafür, dass digitale Ablenkung unseren Geist schädigt.
• Fred Pearce schrieb darüber, wie wir die größten Rechenzentren der Welt effizienter machen können. Wenn Sie sich fragen, warum dies das angestrebte Ziel ist, ist es wichtig zu wissen, dass diese Rechenzentren für 3 % der gesamten globalen CO2-Emissionen verantwortlich sind – genauso viel wie die Luftfahrtindustrie.
• „Ein stillgelegtes Kohlekraftwerk wird wiedereröffnet, um ausschließlich Kryptowährungen zu betreiben.“ Ich habe keine zusätzlichen Worte dafür.

Wir hoffen, dass Ihnen dieses Webentwicklungs-Update gefallen hat. Die nächste findet am Freitag, den 18. Mai statt. Bleib dran.