Deze pagina is vertaald door de Cloud Translation API.

Nieuw in Chrome 94

Pete LePage

Dit is wat u moet weten:

De standaardkleurruimte voor <canvas> -elementen is nu formeel gedefinieerd in de specificatie als SRGB , en u kunt deze wijzigen in Display P3 .
WebCodecs is een nieuwe, laagdrempelige manier om toegang te krijgen tot ingebouwde audio- en videocodecs, belangrijk voor het streamen van games, video-editors en dergelijke.
WebGPU start zijn origin-proefperiode.
De PWA Summit vindt plaats van 6 tot 7 oktober.
En er is nog veel meer .

Ik ben Pete LePage , ik werk en fotografeer vanuit huis. Laten we erin duiken en kijken wat er nieuw is voor ontwikkelaars in Chrome 94.

Standaardkleurruimte voor `canvas`

De manier waarop kleuren op het scherm worden weergegeven, is voor sommige gebruikers van cruciaal belang. Voor fotografen, printillustratoren en vele anderen moeten de kleuren op het scherm overeenkomen met wat er wordt afgedrukt. Vanaf Chrome 94 worden <canvas> -elementen volledig in kleur beheerd met behulp van sRGB . Voorheen was sRGB gebruikelijk, maar niet expliciet gedefinieerd in de specificaties.

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

Belangrijker nog is dat u nu kunt opgeven welke kleurruimte u wilt gebruiken bij het maken van een <canvas> rendering context 2d-object, of een ImageData object, inclusief de P3-kleurruimte.

Webcodecs

Video op een pagina plaatsen is eenvoudig genoeg. Maar als je iets ingewikkelders moet doen en interactie moet hebben met de componenten van een videostream, is dat moeilijk en moet je meestal Web Assembly gebruiken om je eigen codecs te verzenden!

Maar het verzenden van uw eigen codec betekent dat u code schrijft die de browser al heeft, en dat deze geen voordeel kan halen uit hardwareversnelling! De Web Codecs API maakt het mogelijk om de mediacomponenten en codecs te gebruiken die al in de browser staan.

Persoonlijk heb ik er altijd moeite mee gehad om de juiste opdrachtregelopties te onthouden om een video voor internet te coderen of om een GIF naar een videobestand te converteren. Met behulp van de API's die beschikbaar zijn via WebCodecs, kon ik snel een webapp bouwen die een bestand leest en de juiste bestanden exporteert die nodig zijn voor het web.

Het pad van een Canvas of een ImageBitmap naar het netwerk of naar opslag — Het pad van een `Canvas` of een `ImageBitmap` naar het netwerk of naar opslag

Webapps die volledige controle vereisen over de manier waarop media-inhoud wordt verwerkt, zoals video-editors, videoconferenties, streaming-apps, enzovoort. De toegang tot de ingebouwde mediabedieningen in de browser is enorm.

Het is moeilijk om binnen dertig seconden iets nuttigs weer te geven, dus bekijk Videoverwerking met WebCodecs op web.dev voor een diepgaande duik met veel code en een paar coole demo's!

WebGPU

WebGPU is een nieuwe API die moderne grafische mogelijkheden blootlegt, met name Direct3D 12, Metal en Vulkan. Je kunt het zien als WebGL, maar het biedt toegang tot meer geavanceerde functies van de GPU en biedt ook ondersteuning voor het uitvoeren van algemene berekeningen op de GPU .

Er wordt een origin-proef gestart in Chrome 94, en zowel Safari als Firefox werken momenteel aan hun implementaties.

Een Babylon.js-demo van een ruwe zee die wordt gesimuleerd met behulp van de compute shader-mogelijkheden van WebGPU.

François heeft een geweldig artikel, Toegang tot moderne GPU-functies met WebGPU op web.dev met de details, en vergelijkt de prestaties van matrixvermenigvuldiging op de CPU met de GPU. Hier is een hint. De GPU wint .

PWA-top

De PWA Summit vindt plaats van 6 tot 7 oktober. Het is een gratis, online conferentie die erop gericht is iedereen te helpen slagen met Progressive Web Apps. De PWA Summit is een samenwerking tussen mensen van een handvol verschillende bedrijven die betrokken zijn bij de creatie van PWA-technologieën: Google, Intel, Microsoft en Samsung.

Er zijn een heleboel geweldige gesprekken en inhoud. Meer informatie en registratie kunt u vinden op PWASummit.org . Ik hoop dat ik je daar zie!

En meer!

Natuurlijk is er nog veel meer.

Met de prioritaire scheduler.postTask() methode kunt u taken plannen en hun prioriteiten dynamisch wijzigen, of ze allemaal tegelijk annuleren.

Als je ooit hebt gevochten met een nieuwe lay-out wanneer schuifbalken verschijnen, zal de eigenschap scrollbar-gutter je blij maken. Het biedt controle over de aanwezigheid van schuifbalkgoten, waardoor u wijzigingen in de lay-out kunt voorkomen naarmate de inhoud groter wordt.

Het gebruik van WebSQL in contexten van derden is nu verouderd en wordt naar verwachting verwijderd in Chrome 97. De Web SQL Database-standaard werd in november 2010 verlaten. Deze is nooit geïmplementeerd in Firefox en is in 2019 verouderd in Safari. Deze zal worden verouderd en verwijderd uit Chrome wanneer het gebruik laag genoeg is. Als u nog steeds WebSQL gebruikt, is dit een goed moment om uw migratie ervan af te plannen.

En de virtuele toetsenbord-API geeft u meer controle over hoe en wanneer het virtuele toetsenbord op het scherm wordt weergegeven. Hiermee kunt u expliciet elk scrollgedrag bepalen, of wijzigingen in de lay-out wanneer het toetsenbord verschijnt of verdwijnt.

Verder lezen

Dit behandelt slechts enkele van de belangrijkste hoogtepunten. Controleer de onderstaande links voor aanvullende wijzigingen in Chrome 94.

Als u op de hoogte wilt blijven, abonneert u zich op het YouTube-kanaal van Chrome Developers . U ontvangt dan een e-mailmelding wanneer we een nieuwe video lanceren.

Ik ben Pete LePage, en zodra Chrome 95 uitkomt, ben ik hier om je te vertellen wat er nieuw is in Chrome!