Diese Seite wurde von der Cloud Translation API übersetzt.

Neu in Chrome 94

Pete LePage

Dazu sollten Sie Folgendes wissen:

Der Standardfarbraum für <canvas>-Elemente ist in der Spezifikation jetzt formal als SRGB definiert und Sie können ihn in Display P3 ändern.
WebCodecs ist eine neue, einfache Möglichkeit für den Zugriff auf integrierte Audio- und Video-Codecs. Sie ist wichtig für Streamingspiele, Video-Editoren und Ähnliches.
WebGPU startet den Ursprungstest.
Der PWA Summit findet vom 6. bis 7. Oktober statt.
Und es gibt viele weitere.

Ich bin Pete LePage, arbeite von zu Hause aus und fotografiere von zu Hause aus. Als Nächstes sehen wir uns an, was es für Entwickler bei Chrome 94 Neues gibt.

Standardfarbraum für `canvas`-Elemente

Für manche Nutzende ist es wichtig, wie Farben auf dem Bildschirm gerendert werden. Für Fotografen, Illustratoren und viele andere müssen die Farben auf dem Bildschirm mit dem Gedruckten übereinstimmen. Ab Chrome 94 werden <canvas>-Elemente vollständig mithilfe von sRGB farbig verwaltet. Früher war sRGB eine konventionelle Methode, die in der Spezifikation aber nicht explizit definiert wurde.

opts = {colorSpace:'display-p3'};
const ctx = canvas.getContext('2d', opts);

Und was noch wichtiger ist: Sie können jetzt angeben, welcher Farbraum verwendet werden soll, wenn Sie ein 2D-Objekt mit <canvas>-Renderingkontext oder ein ImageData-Objekt, einschließlich des P3-Farbraums, erstellen.

WebCodecs

Die Platzierung von Videos auf einer Seite ist einfach genug. Es ist jedoch schwierig, eine komplexere Lösung zu finden und mit den Komponenten eines Videostreams zu interagieren. Außerdem müssen Sie normalerweise Web Assembly verwenden, um Ihre eigenen Codecs zu versenden.

Wenn Sie Ihren eigenen Codec veröffentlichen möchten, müssen Sie Codec schreiben, den der Browser bereits hat, und die Hardwarebeschleunigung nicht nutzen. Mit der Web Codecs API können die Medienkomponenten und -Codecs verwendet werden, die sich bereits im Browser befinden.

Ich persönlich hatte schon immer Schwierigkeiten, mir den richtigen Befehlszeilen-Schalter zu merken, um ein Video für das Web zu codieren oder ein GIF in eine Videodatei zu konvertieren. Mit den über WebCodecs verfügbaren APIs konnte ich schnell eine Webanwendung erstellen, die eine Datei liest und die richtigen Dateien exportiert, die für das Web benötigt werden.

Der Pfad von einem Canvas oder einer ImageBitmap zum Netzwerk oder Speicher — Der Pfad von einem `Canvas`- oder `ImageBitmap` zum Netzwerk oder Speicher

Webanwendungen, die vollständige Kontrolle über die Verarbeitung von Medieninhalten erfordern, z. B. Video-Editoren, Videokonferenzen, Streaming-Apps usw. Der Zugriff auf die integrierten Mediensteuerelemente ist enorm.

Innerhalb von 30 Sekunden alles Nützliche zu zeigen, ist schwierig. Sehen Sie sich deshalb auf web.dev Videoverarbeitung mit WebCodecs an. Dort finden Sie jede Menge Code und ein paar coole Demos.

WebGPU

WebGPU ist eine neue API mit modernen Grafikfunktionen, insbesondere Direct3D 12, Metal und Vulkan. Sie können sich die Anwendung wie WebGL vorstellen, bietet jedoch Zugriff auf erweiterte Features der GPU und unterstützt auch allgemeine Berechnungen auf der GPU.

Es startet einen Ursprungstest in Chrome 94 und sowohl Safari als auch Firefox arbeiten derzeit an ihrer Implementierung.

Eine Babylon.js-Demo einer rauen See wird mit der Compute-Shader-Funktion von WebGPU simuliert.

François hat einen ausführlichen Artikel mit dem Titel Access modern GPU features with WebGPU auf web.dev veröffentlicht. Darin wird die Leistung der auf der CPU ausgeführten Matrixmultiplikation mit der der GPU verglichen. Hier ist ein Tipp. Die GPU gewinnt.

PWA Summit

Der PWA Summit findet vom 6. bis 7. Oktober statt. Es ist eine kostenlose Onlinekonferenz, die darauf ausgerichtet ist, allen mit progressiven Web-Apps zum Erfolg zu verhelfen. Der PWA Summit ist ein Gemeinschaftsprojekt von einigen Unternehmen, die an der Entwicklung von PWA-Technologien beteiligt sind: Google, Intel, Microsoft und Samsung.

Es gibt jede Menge gute Vorträge und jede Menge Inhalte. Weitere Informationen und die Möglichkeit zur Anmeldung findest du unter PWASummit.org. Ich hoffe, Sie dort zu sehen!

…und vieles mehr

Natürlich gibt es noch viel mehr.

Mit der priorisierten scheduler.postTask()-Methode können Sie Aufgaben planen und ihre Prioritäten dynamisch ändern oder alle zusammen abbrechen.

Falls Sie schon einmal gegen eine Layoutänderung gekämpft haben, als Bildlaufleisten eingeblendet werden, ist die Eigenschaft scrollbar-gutter genau das Richtige für Sie. Damit können Sie steuern, ob Bildlaufleisten im Spaltenabstand angezeigt werden. So verhindern Sie, dass Layoutänderungen beim Maximieren des Inhalts vorgenommen werden.

Die Verwendung von WebSQL in Drittanbieterkontexten wurde verworfen und in Chrome 97 wird erwartet. Der Web SQL-Datenbankstandard wurde im November 2010 eingestellt. Es wurde nie in Firefox implementiert und wurde 2019 in Safari eingestellt. Sie wird eingestellt und aus Chrome entfernt, wenn die Nutzung gering genug ist. Wenn Sie noch WebSQL verwenden, ist jetzt ein guter Zeitpunkt, um mit der Planung Ihrer Migration zu beginnen.

Mit der Virtual Keyboard API kannst du besser steuern, wie und wann die virtuelle Bildschirmtastatur angezeigt wird. Damit können Sie das Scrollverhalten explizit steuern und das Layout ändern, wenn die Tastatur ein- oder ausgeblendet wird.

Weitere Informationen

Dies sind nur einige der wichtigsten Punkte. Weitere Änderungen in Chrome 94 finden Sie unter den folgenden Links.

Abonnieren Sie den YouTube-Kanal für Chrome-Entwickler, um auf dem Laufenden zu bleiben. Dann werden Sie per E-Mail benachrichtigt, wenn wir ein neues Video veröffentlichen.

Ich bin Pete LePage. Sobald Chrome 95 veröffentlicht wird, melde ich Ihnen, was es bei Chrome Neues gibt.