- In Chrome 62 ist die Netzwerkinformations-API noch nützlicher, da sie statt theoretischer Ergebnisse tatsächliche Leistungsmesswerte liefert.
- Unterstützung für variable OpenType-Schriftarten
- Sie können Mediastreams aus HTML-Media-Elementen erfassen.
- Ich möchte Sie an eine wichtige Änderung in Chrome 62 erinnern.
Und es gibt noch viel mehr!
Ich bin Pete LePage. Sehen wir uns an, was es in Chrome 62 für Entwickler Neues gibt.
Vollständige Liste der Änderungen ansehen Liste der Änderungen am Chromium-Quell-Repository
Netzwerkqualitäts-Indikator
Die Network Information API ist schon seit einiger Zeit in Chrome verfügbar, liefert aber nur theoretische Netzwerkgeschwindigkeiten für die Verbindung des Nutzers. Angenommen, Sie sind mit einem WLAN verbunden, aber mit einem Mobilfunk-Hotspot, der nur eine 2G-Geschwindigkeit hat. Die API würde „WLAN“ melden.
console.log(navigator.connection.type);
> wifi
In Chrome 62 wurde die API erweitert, um tatsächliche Messwerte zur Netzwerkleistung vom Client bereitzustellen. Anhand dieser Signale zur Netzwerkqualität kannst du Inhalte an das Netzwerk anpassen. Bei sehr langsamen Verbindungen können Sie beispielsweise die Seitenladeleistung verbessern, indem Sie eine reduzierte Version bereitstellen.
Um die Anwendungslogik zu vereinfachen, gibt die API die gemessene Netzwerkleistung im Vergleich zu einer Mobilfunkverbindung zurück. Wenn Sie beispielsweise mit einer superschnellen Glasfaserverbindung verbunden sind, meldet die API 4G
.
console.log(navigator.connection.effectiveType);
> 4G
Diese Signale sind auch als HTTP-Anfrageheader verfügbar und werden über Client-Hinweise aktiviert. Weitere Informationen findest du im Beispiel und in der Spezifikation.
OpenType-Variable-Schriftarten
Traditionell enthielt eine Schriftart nur eine einzige Instanz einer Schriftfamilie, z. B. eine Schriftstärke oder einen Schriftschnitt. Wenn Sie eine normale, fett formatierte und kursive Schrift verwenden möchten, müssten Sie drei separate Schriftarten einfügen, was die Textmenge auf Ihrer Seite erhöht.
Eine variable OpenType-Schriftart entspricht mehreren einzelnen Schriftarten, die in einer einzigen Schriftdatei kompakt verpackt werden können. Durch Anpassung der CSS-Eigenschaft font-variation-settings
lassen sich unter anderem Stretch, Stil und Gewicht ganz einfach anpassen und so eine unendliche Anzahl von Stilvarianten erstellen. Diese drei Schriftarten können jetzt in einer einzigen kompakten Datei kombiniert werden.
.heading {
font-family: "Avenir Next Variable";
font-size: 48px;
font-variation-settings: 'wght' 700, 'wdth' 75;
}
.content {
font-family: "Avenir Next Variable";
font-size: 24px;
font-variation-settings: 'wght' 400;
}
Mit OpenType-Variable-Fonts haben wir ein leistungsstarkes neues Tool, mit dem wir responsive Typografie erstellen und das Seitengewicht reduzieren können. Weitere Informationen finden Sie im Artikel Introducing OpenType Variable Fonts von John Hudson.
Medienerfassung über DOM-Elemente
Mit der Media Capture from DOM Elements API können Sie jetzt Inhalte wie Audio und Video direkt aus HTMLMediaElements
in MediaStream
live erfassen.
Nachdem captureStream()
auf ein HTML-Medienelement aufgerufen wurde, können die gestreamten Inhalte manipuliert, verarbeitet, per Fernzugriff gesendet oder aufgezeichnet werden. Stellen Sie sich vor, Sie könnten mit Web Audio Ihren eigenen Equalizer oder Vocoder erstellen. Sie können die Inhalte auch mit WebRTC auf eine Remote-Website streamen. Die Möglichkeiten sind nahezu endlos.
Labels „Nicht sicher“ für einige HTTP-Seiten
Wie bereits angekündigt, werden ab Chrome 62 HTTP-Seiten, auf denen Nutzer Daten eingeben, in Chrome mit einem Label in der Adressleiste als „Nicht sicher“ gekennzeichnet. Dieses Label wird auch im Inkognitomodus für alle HTTP-Seiten angezeigt.
…und vieles mehr
Das sind nur einige der Änderungen in Chrome 62 für Entwickler. Es gibt natürlich noch viele weitere.
- Die Payment Request API ist jetzt in Chrome für iOS verfügbar.
- Mit dem WebVR-Ursprungstest können Sie experimentelle, umfassende VR-Inhalte erstellen.
Abonniere dann unseren YouTube-Kanal. Du erhältst dann eine E-Mail-Benachrichtigung, sobald wir ein neues Video veröffentlichen.
Ich bin Pete LePage. Sobald Chrome 63 veröffentlicht wird, erzähle ich Ihnen hier, was es Neues in Chrome gibt.