Chrome 89 wordt nu uitgerold naar de stabiele versie.
Dit is wat u moet weten:
- WebHID, WebNFC en Web Serial hebben hun oorspronkelijke proefperiode afgerond en zijn nu beschikbaar in de stabiele versie.
- We dichten een maas in de wet die een aantal ontwikkelaars gebruikten om de PWA-installatiecontroles te omzeilen.
- Web Share en Web Share Target verschijnen op het bureaublad.
- En er is nog veel meer .
Ik ben Pete LePage en ik werk en fotografeer vanuit huis. Laten we eens kijken wat er nieuw is voor ontwikkelaars in Chrome 89!
WebHID, WebNFC en webserienummer
Ik ben erg enthousiast over WebHID, WebNFC en Web Serial. Ze bieden gebruikers nieuwe scenario's die voorheen onmogelijk waren, namelijk interactie met echte hardware.
Ze stellen makers in staat om verbinding te maken met leuke, eigenzinnige hardware, videoconferentie-apps en de speciale telefoonknoppen op speciale speakers te gebruiken. Of talloze andere toepassingen.
Met behulp van Web Serial en ongeveer 60 regels code creëerde @AndreBan een pagina die kan communiceren met de MicroPython REPL op een Raspberry Pi Pico . Web Serial wordt ook door Espruino gebruikt in hun webgebaseerde IDE .
Op CDS 2019 schreef Francois een leuk geheugenspel met behulp van Web NFC. Je moest de telefoon op de juiste kaart tikken, in de juiste volgorde.
En mijn favoriet: @bramus gebruikte WebHID om verbinding te maken met een StreamDeck en bouwde een Daft Punk-drumpad . Heb je geen StreamDeck? Bekijk dan zijn demovideo op YouTube en de code op GitHub .
Het maakt niet uit of uw site communiceert met uw hardware of dat uw hardware met meerdere sites kan communiceren: gebruikers profiteren ervan, omdat ze geen speciale drivers of software hoeven te installeren.
Op web.dev/devices kunt u meer te weten komen over de apparaten waarmee u verbinding kunt maken. U kunt ook de handleidingen voor WebHID , WebNFC en Web Serial raadplegen.
Wijzigingen in de installeerbaarheidscriteria van PWA
Offline ondersteuning is al vanaf het begin een belangrijk onderdeel van de criteria voor installeerbaarheid van Progressive Web Apps. Net als bij andere geïnstalleerde apps verwachten gebruikers dat deze betrouwbaar werkt. De app moet snel zijn en ze mogen nooit de offline dino zien!
Later dit jaar willen we een maas in de wet dichten waardoor sommige sites de installeerbaarheidscriteria konden halen zonder een offline ervaring. Als je PWA al een offline ervaring heeft, ben je klaar. Je hoeft niets te doen, maar als je die niet hebt, is het tijd om er een toe te voegen!
Vanaf Chrome 89 ziet u een waarschuwing in DevTools onder het tabblad Problemen als uw PWA geen geldig antwoord geeft wanneer deze offline is. Lighthouse geeft dan aan dat er een probleem is. De handhaving hiervan start later dit jaar in Chrome 93.
U kunt zelf bepalen wat voor soort offline ervaring u wilt bieden. Idealiter biedt u zoveel mogelijk van uw ervaring. Maar het kan minimaal zo simpel zijn als een offline fallbackpagina .
Meer informatie over de wijziging en waarom we deze doorvoeren, vindt u in Verbetering van offline ondersteuningsdetectie voor Progressive Web App .
Weet je niet zeker waar je moet beginnen? Bekijk dan Workbox . Deze dienst heeft een reeks bibliotheken die een productieklare service worker voor je PWA kunnen aansturen. Of, voor een eenvoudige offline fallbackpagina, vind je in het artikel 'Een offline fallbackpagina maken' alle code die je nodig hebt. Je kunt de code kopiëren en direct in je site plakken.
Web Share en Web Share Target voor Desktop
Als uw site gebruikers toestaat bestanden te maken, te bewerken of ermee te werken, moet u de Web Share- en Web Share Target-API's gebruiken. Deze API's zijn al enige tijd beschikbaar op mobiele apparaten, maar worden nu ook ondersteund op ChromeOS en Windows.
Met Web Share kunnen gebruikers bestanden of gegevens naar andere geïnstalleerde apps op hun apparaat sturen. Zo kunnen ze bijvoorbeeld een foto van Google Photos delen met Twitter.
async function share(title, text, url) {
try {
await navigator.share({title, text, url});
return true;
} catch (ex) {
console.error('Share failed', ex);
return false;
}
}
Als u zich als doel wilt registreren zodat andere apps bestanden of gegevens met u kunnen delen, kunt u de Web Share Target API gebruiken.
"share_target": {
"action": "/?share-target",
"method": "POST",
"enctype": "multipart/form-data",
"params": {
"files": [
{
"name": "file",
"accept": ["image/*"],
},
],
},
},
Raadpleeg Integreren met de OS-deelinterface met de Web Share API en Gedeelde gegevens ontvangen met de Web Share Target API voor handleidingen om aan de slag te gaan.
En meer
En natuurlijk is er nog veel meer.
Chrome staat nu await op het hoogste niveau toe binnen JavaScript-modules.
Om verwarring bij gebruikers te voorkomen, hebben we het pictogram in de omnibox voor installeerbare PWA's bijgewerkt.
En als u een vertrouwde webactiviteit hebt gebruikt om uw PWA beschikbaar te maken in de Play Store voor ChromeOS, kunt u zich aanmelden voor de proefversie van de Digital Goods API .
Verder lezen
Dit zijn slechts enkele van de belangrijkste hoogtepunten. Bekijk de onderstaande links voor aanvullende wijzigingen in Chrome 89.
- Wat is er nieuw in Chrome DevTools (89)
- Chrome 89-verouderde en verwijderde versies
- ChromeStatus.com-updates voor Chrome 88
- Wat is er nieuw in JavaScript in Chrome 88
- Wijzigingslijst voor Chromium-bronrepository
Abonneren
Wilt u op de hoogte blijven van onze video's? Abonneer u dan op ons YouTube-kanaal voor Chrome-ontwikkelaars . U ontvangt dan een e-mailmelding wanneer we een nieuwe video lanceren.
Ik ben Pete LePage en zodra Chrome 90 uitkomt, vertel ik je alles over de nieuwe functies in Chrome!
Credits
De foto van de Raspberry Pi's en Arduino zijn van Harrison Broadbent op Unsplash