Nieuw in Chroom 78

Pete LePage

Chrome 78 wordt nu uitgerold!

Ik ben Pete LePage . Laten we eens kijken wat er nieuw is voor ontwikkelaars in Chrome 78!

API voor CSS-eigenschappen en -waarden

CSS-variabelen, technisch gezien aangepaste eigenschappen genoemd, zijn geweldig. Ze laten je je eigen eigenschappen definiëren en gebruiken in je CSS. Maar aangepaste eigenschappen zijn niet veel meer dan een simpele zoek-en-vervang-functie.

html {
  --my-color: green;
}
.thing {
  color: var(--my-color);
}

Als u een variabele voor een kleur gebruikt, maar een URL als waarde toekent, wordt de regel zonder pardon verwijderd. Met de API voor CSS-eigenschappen en -waarden kunt u een type en een standaard fallback-waarde voor uw aangepaste eigenschappen definiëren.

html {
  --my-color: url(‘not-a-color'); // Oops, not a color!
}
.thing {
  color: var(--my-color);
}

Het registreren van een eigenschap is heel eenvoudig: u roept window.CSS.registerProperty() aan en geeft de naam op van de eigenschap die u definieert, het type eigenschap, of deze moet overerven en wat de beginwaarde is.

window.CSS.registerProperty({
  name: '--my-color',
  syntax: '<color>',
  inherits: false,
  initialValue: 'black',
});

Bekijk het artikel Slimmere aangepaste eigenschappen met Houdini's nieuwe API van Sam Richard op web.dev voor meer informatie.

Jongere servicemedewerkers

Byte-voor-byte controles worden nu uitgevoerd voor service worker-scripts die geïmporteerd zijn met importScripts() . Voorheen was de enige manier om een ​​geïnstalleerde service worker te dwingen wijzigingen in een geïmporteerd script op te pikken, het wijzigen van de URL van het geïmporteerde script, meestal door een semver-waarde of hash in de URL toe te voegen.

importScripts('https://example.com/v1.1.0/index.js');
importScripts('https://example.com/index.abcd1234.js');

Vanaf Chrome 78 controleert Chrome bij elke updatecontrole voor een service worker-bestand op het hoogste niveau ook of de inhoud van geïmporteerde scripts is gewijzigd. Zo ja, dan wordt de volledige updateflow voor de service worker geactiveerd. Dit zorgt ervoor dat Chrome voldoet aan de specificatie en komt overeen met wat Firefox en Safari doen.

Jeff beschikt standaard over alle details in Fresher service workers, inclusief enkele belangrijke zaken die u moet weten over hoe de HTTP-cache de updatecyclus beïnvloedt.

Nieuwe oorsprongsproeven

Met Origin-tests kunnen we experimentele functies en API's valideren. Ook kunt u feedback geven over de bruikbaarheid en effectiviteit ervan bij een bredere implementatie.

Experimentele functies zijn normaal gesproken alleen beschikbaar achter een vlaggetje, maar wanneer we een Origin-proefversie voor een functie aanbieden, kunt u zich registreren voor die Origin-proefversie om de functie voor alle gebruikers op uw Origin in te schakelen.

Als u deelneemt aan een Origin-proefversie, kunt u demo's en prototypes bouwen die uw bètatestgebruikers tijdens de proefperiode kunnen uitproberen, zonder dat ze speciale markeringen in Chrome hoeven aan te passen.

Meer informatie over Origin-proefversies vindt u in de Origin Trials Guide voor webontwikkelaars . U kunt een lijst met actieve Origin-proefversies bekijken en u hiervoor aanmelden op de Chrome Origin Trials- pagina.


Native bestandssysteem

Een Origin-proefversie voor de Native File System API start in Chrome 78 en zal naar verwachting doorlopen tot en met Chrome 80.

Met de Native File System API kunnen ontwikkelaars krachtige webapps bouwen die communiceren met bestanden op het lokale apparaat van de gebruiker. Nadat een gebruiker een webapp toegang heeft verleend, kunnen webapps via deze API rechtstreeks bestanden en mappen op het apparaat van de gebruiker lezen en er wijzigingen in opslaan.

Ik ben erg enthousiast over alle nieuwe ervaringen die dit mogelijk maakt: ik hoef geen bestanden meer te uploaden of downloaden waarmee ik wil werken. Bekijk mijn bericht over het Native File System voor alle details, inclusief code, een demo en hoe we eraan werken om gebruikers veilig te houden.

SMS-ontvanger

Een Origin-proefversie voor de SMS Receiver API start in Chrome 78 en zal naar verwachting doorlopen tot en met Chrome 80.

Met de SMS Receiver API, nu beschikbaar als proefversie, kan uw webapp speciaal geformatteerde sms-berichten ontvangen voor de bron van uw app. Hiermee kunt u programmatisch een eenmalig wachtwoord (OTP) uit een sms-bericht halen en gemakkelijker een telefoonnummer van de gebruiker verifiëren.

Eiji schreef Verify telefoonnummers op het web met de SMS Receiver API, met alle details en hoe je je kunt aanmelden voor de Origin-proefversie.

Chrome Dev Summit 2019

Vergeet niet om op 11 en 12 november naar de Chrome Dev Summit te kijken. Deze wordt live gestreamd op het YouTube-kanaal van Chrome Developers .


Verder lezen

Dit zijn slechts enkele van de belangrijkste hoogtepunten. Bekijk de onderstaande links voor aanvullende wijzigingen in Chrome 78.

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. U kunt ook onze RSS-feed toevoegen aan uw feedreader.

Ik ben Pete LePage en zodra Chrome 79 uitkomt, vertel ik u wat er nieuw is in Chrome!