Nieuw in Chrome 67

  • Progressive Web Apps komen naar de desktop
  • De generieke sensor-API maakt het veel gemakkelijker om toegang te krijgen tot apparaatsensoren zoals de versnellingsmeter, gyroscoop en meer.
  • En BigInt 's maken het omgaan met grote gehele getallen veel eenvoudiger.

En er is nog veel meer !

Ik ben Pete LePage . Laten we erin duiken en kijken wat er nieuw is voor ontwikkelaars in Chrome 67!

Wilt u de volledige lijst met wijzigingen? Bekijk de Chromium-bronrepositorywijzigingslijst .

Desktop PWA's

Spotify's progressieve web-app op de desktop

Desktop Progressive Web Apps worden nu ondersteund op ChromeOS 67 en we zijn al begonnen met ondersteuning voor Mac en Windows. Eenmaal geïnstalleerd, worden ze op dezelfde manier gestart als andere apps en worden ze uitgevoerd in een app-venster , zonder adresbalk of tabbladen. Servicemedewerkers zorgen ervoor dat ze snel en betrouwbaar zijn. Dankzij de app-vensterervaring voelen ze zich geïntegreerd. En ze creëren een boeiende ervaring voor uw gebruikers.

Aan de slag gaan is niet anders dan wat u vandaag al doet. Al het werk dat u voor uw bestaande Progressive Web App heeft gedaan, is nog steeds van toepassing . U hoeft alleen maar rekening te houden met enkele extra breekpunten .

Als uw app voldoet aan de standaard PWA-criteria , activeert Chrome de gebeurtenis beforeinstallprompt , maar wordt de gebruiker hier niet automatisch om gevraagd. Sla in plaats daarvan de gebeurtenis op; Voeg vervolgens een gebruikersinterface (zoals een app-installatieknop) toe aan uw app om de gebruiker te laten weten dat uw app kan worden geïnstalleerd. Wanneer de gebruiker vervolgens op de knop klikt, roept u de prompt op voor de opgeslagen gebeurtenis; Chrome toont de prompt vervolgens aan de gebruiker. Als ze op Toevoegen klikken, voegt Chrome uw PWA toe aan hun plank en opstartprogramma.

Bekijk mijn Google I/O-lezing waarin Jenny en ik gedetailleerd ingaan op de technische en speciale ontwerpoverwegingen waar je aan moet denken bij het bouwen van een progressieve desktopweb-app.

En als je hiermee op Mac of Windows wilt gaan spelen, bekijk dan het volledige Desktop Progressive Web App-bericht voor details over hoe je ondersteuning met een vlag kunt inschakelen.

Generieke sensor-API

Sensorgegevens worden in veel apps gebruikt om ervaringen mogelijk te maken zoals meeslepend gamen, fitnesstracking en augmented of virtual reality. Deze gegevens zijn nu beschikbaar voor de webapp met behulp van de Generic Sensor API .

De API bestaat uit een basissensorinterface met daarop een reeks concrete sensorklassen. Het hebben van een basisinterface vereenvoudigt het implementatie- en specificatieproces voor de concrete sensorklassen. De Gyroscoopklasse is bijvoorbeeld superklein!

const sensor = new Gyroscope({frequency: 500});
sensor.start();

sensor.onreading = () => {
    console.log("X-axis " + sensor.x);
    console.log("Y-axis " + sensor.y);
    console.log("Z-axis " + sensor.z);
};

De kernfunctionaliteit wordt gespecificeerd door de basisinterface, en Gyroscoop breidt deze slechts uit met drie attributen die de hoeksnelheid vertegenwoordigen. Chrome 67 ondersteunt de versnellingsmeter, gyroscoop, oriëntatiesensor en bewegingssensor.

Intel heeft verschillende demo's samengesteld van de generieke sensoren-API en voorbeeldcode , en ze hebben ook de Sensors for the Web bijgewerkt! post van september met alles wat je moet weten.

BigInt s

BigInt 's zijn een nieuwe numerieke primitief in JavaScript die gehele getallen met willekeurige precisie kan weergeven. Grote integer-ID's en zeer nauwkeurige tijdstempels kunnen in JavaScript niet veilig worden weergegeven als Numbers , wat vaak leidt tot bugs in de echte wereld (waardoor we dergelijke getallen vaak als tekenreeksen weergeven).

let max = Number.MAX_SAFE_INTEGER;
// → 9_007_199_254_740_991
max = max + 1;
// → 9_007_199_254_740_992 - Yay!
max = max + 1;
// → 9_007_199_254_740_992 - Uh, no?

Met BigInt s kunnen we berekeningen met gehele getallen veilig opslaan en uitvoeren zonder dat ze overlopen. Tegenwoordig betekent het omgaan met grote gehele getallen doorgaans dat we onze toevlucht moeten nemen tot een bibliotheek die BigInt -achtige functionaliteit zou emuleren.

let max = BigInt(Number.MAX_SAFE_INTEGER);
// → 9_007_199_254_740_991n
max = max + 9n;
// → 9_007_199_254_741_000n - Yay!

Wanneer BigInt algemeen beschikbaar wordt, kunnen we deze runtime-afhankelijkheden laten vallen ten gunste van native BigInts . Niet alleen is de native implementatie sneller, het helpt ook om de laad-, parseer- en compileertijd te verkorten, omdat we die extra bibliotheken niet hoeven te laden.

En meer!

Dit zijn slechts enkele van de veranderingen in Chrome 67 voor ontwikkelaars. Er is natuurlijk nog veel meer.

De Credential Management API wordt ondersteund sinds Chrome 51 en biedt een raamwerk voor het maken, ophalen en opslaan van inloggegevens. Dit werd gedaan via twee typen referenties: PasswordCredential en FederatedCredential . De Web Authentication API voegt een derde referentietype toe, PublicKeyCredential , waarmee browsers een gebruiker kunnen authenticeren met een privé/openbaar sleutelpaar dat is gegenereerd door een authenticator zoals een beveiligingssleutel, een vingerafdruklezer of een ander apparaat dat een gebruiker kan authenticeren. Chrome 67 maakt de API mogelijk met behulp van U2F/CTAP 1-authenticators via USB-transport op de desktop.

Lees er meer over in het artikel Enabling Strong Authentication with WebAuthn van Eiji.

Google I/O is een wrap

Als je I/O niet hebt gehaald, of misschien wel, maar niet alle webgesprekken hebt gezien, bekijk dan de Chrome- en Web-afspeellijst om op de hoogte te blijven van het laatste nieuws van Google I/O!

Nieuw in DevTools

Zorg ervoor dat u Nieuw in Chrome DevTools bekijkt, om te zien wat er nieuw is voor DevTools in Chrome 67.

Abonneren

Klik vervolgens op de abonneerknop op ons YouTube-kanaal en je ontvangt een e-mailmelding wanneer we een nieuwe video lanceren.

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