Nieuw in Chroom 78

Piet LePage

Chrome 78 wordt nu uitgerold!

Ik ben Pete LePage , laten we erin duiken en kijken wat er nieuw is voor ontwikkelaars in Chrome 78!

CSS-eigenschappen en waarden-API

CSS-variabelen, technisch gezien aangepaste eigenschappen genoemd, zijn geweldig. Hiermee kunt u uw eigen eigenschappen in uw hele CSS definiëren en gebruiken. Maar aangepaste eigenschappen zijn niet veel meer dan eenvoudig zoeken en vervangen.

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

Als u een variabele voor een kleur gebruikte, maar een URL als waarde toewijst, wordt de regel gewoon stilzwijgend genegeerd. Met de CSS Properties and Values ​​API 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 net zo eenvoudig als het aanroepen van window.CSS.registerProperty() en het opgeven van de naam van de eigenschap die u definieert, het type eigenschap dat het is, of deze zou moeten erven, en de initiële waarde ervan.

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

Bekijk de slimmere aangepaste eigenschappen van Sam Richard met Houdini's nieuwe API- artikel op web.dev voor volledige details.

Nieuwere servicemedewerkers

Er worden nu byte-voor-byte controles uitgevoerd voor service worker-scripts die zijn geïmporteerd door importScripts() . In het verleden was de enige manier om een ​​geïnstalleerde servicemedewerker 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 aan 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 elke keer dat er een updatecontrole wordt uitgevoerd voor een servicemedewerkerbestand op het hoogste niveau, of de inhoud van geïmporteerde scripts al dan niet is gewijzigd. Als dit het geval is, wordt de updatestroom voor de volledige servicemedewerker geactiveerd. Dit brengt Chrome in overeenstemming met de specificaties en komt overeen met wat Firefox en Safari doen.

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

Nieuwe oorsprongsproeven

Origin-proefversies bieden ons de mogelijkheid om experimentele functies en API's te valideren, en maken het voor u mogelijk om feedback te geven over hun bruikbaarheid en effectiviteit bij een bredere implementatie.

Experimentele functies zijn doorgaans alleen beschikbaar achter een vlag, maar als we een Origin-proefversie voor een functie aanbieden, kunt u zich voor die origin-proefperiode registreren om de functie voor alle gebruikers op uw oorsprong in te schakelen.

Als u zich aanmeldt voor een origin-proefversie, kunt u demo's en prototypes bouwen die uw bètatestgebruikers tijdens de proefperiode kunnen uitproberen, zonder dat ze speciale vlaggen in Chrome hoeven om te zetten.

Er is meer informatie over origin-proefversies in de Origin Trials Guide for Web Developers . U kunt een lijst met actieve Origin-proefversies bekijken en u hiervoor aanmelden op de pagina Chrome Origin-proefversies .


Native bestandssysteem

Een Origin-proefversie voor de Native File System API start in Chrome 78 en loopt naar verwachting door 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 web-app toegang heeft verleend, zorgt deze API ervoor dat web-apps wijzigingen rechtstreeks in bestanden en mappen op het apparaat van de gebruiker kunnen lezen of opslaan.

Ik ben erg enthousiast over alle nieuwe ervaringen die dit mogelijk maakt, waarbij ik niet langer bestanden hoef 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 loopt naar verwachting door tot en met Chrome 80.

Met de SMS Receiver API, nu beschikbaar als origin-proefversie, kan uw web-app speciaal opgemaakte sms-berichten ontvangen voor de oorsprong van uw app. Hieruit kunt u programmatisch een OTP uit een sms-bericht verkrijgen en gemakkelijker een telefoonnummer voor de gebruiker verifiëren.

Eiji schreef Verifieer telefoonnummers op internet met de SMS Receiver API met alle details en hoe u zich kunt aanmelden voor de origin-proefperiode.

Chrome Dev Summit 2019

Vergeet niet af te stemmen op de Chrome Dev Summit op 11 en 12 november, deze wordt live gestreamd op het Chrome Developers YouTube-kanaal .


Verder lezen

Dit behandelt slechts enkele van de belangrijkste hoogtepunten. Controleer 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 Chrome Developers YouTube-kanaal , zodat u een e-mailmelding ontvangt wanneer we een nieuwe video lanceren, of voeg onze RSS-feed toe aan uw feedreader.

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