Neu in Chrome 88

Pete LePage

Die stabile Version von Chrome 88 wird nach und nach eingeführt.

Dazu sollten Sie Folgendes wissen:

  • Sie können jetzt Erweiterungen mit Manifest V3 in den Chrome Web Store hochladen.
  • Mit der CSS-Eigenschaft aspect-ratio lässt sich das Seitenverhältnis für jedes Element ganz einfach festlegen.
  • In Chrome 88 werden verkettete JavaScript-Timer für ausgeblendete Seiten unter bestimmten Bedingungen stark gedrosselt.
  • Du kannst jetzt Play Billing in deinen vertrauenswürdigen Webaktivitäten verwenden.
  • Alle Videos vom Chrome Dev Summit sind da.
  • Und es gibt noch vieles mehr.

Ich bin Pete LePage, arbeite von zu Hause aus und drehe von zu Hause aus. Als Nächstes sehen wir uns an, was es für Entwickler bei Chrome 88 Neues gibt.

Manifest V3

Chrome 88 unterstützt jetzt mit Manifest V3 erstellte Erweiterungen und Sie können sie in den Chrome Web Store hochladen. Manifest V3 ist eine neue Erweiterungsplattform, mit der Chrome-Erweiterungen standardmäßig sicherer, leistungsfähiger und datenschutzkonformer gestaltet werden.

Remote-gehosteter Code ist beispielsweise nicht zulässig, sodass Rezensenten im Chrome Web Store besser nachvollziehen können, welche Risiken eine Erweiterung birgt. Außerdem sollten Sie Ihre Erweiterungen schneller aktualisieren können.

Als Ersatz für Hintergrundseiten werden Service Worker eingeführt. Da sich Service Worker nur bei Bedarf im Arbeitsspeicher befinden, verwenden Erweiterungen weniger Systemressourcen.

Um Nutzern mehr Transparenz und Kontrolle darüber zu geben, wie Erweiterungen ihre Daten verwenden und freigeben, werden wir in einem zukünftigen Release einen neuen Installationsablauf einführen, bei dem Nutzer vertrauliche Berechtigungen bei der Installation zurückhalten können.

Unter developer.chrome.com findest du weitere Informationen. Dort erfährst du auch, wie du deine aktuelle Erweiterung zu Manifest V3 migrieren kannst.


CSS-Property „aspect-ratio“

Normalerweise haben nur einige Elemente ein Seitenverhältnis, zum Beispiel Bilder. Wenn für sie nur die Breite oder Höhe angegeben ist, wird die andere Seite automatisch anhand des intrinsischen Seitenverhältnisses berechnet.

<!-- Height is auto-computed from width & aspect ratio -->
<img src="..." style="width: 800px;">

In Chrome 88 können Sie mit der Eigenschaft aspect-ratio explizit ein Seitenverhältnis angeben, was ein ähnliches Verhalten ermöglicht.

.square {
  aspect-ratio: 1 / 1;
}

Mit der progressiven Verbesserung können Sie auch prüfen, ob sie im Browser unterstützt wird, und bei Bedarf ein Fallback anwenden. Mit dem neuen CSS 4-Selektor not können Sie Ihren Code etwas übersichtlicher gestalten.

.square {
  aspect-ratio: 1 / 1;
}

@supports not (aspect-ratio: 1 / 1) {
  .square {
    height: 4rem;
    width: 4rem;
  }
}

Vielen Dank an Jen Simmons für den Hinweis, dass dies in der aktuellen technischen Vorschau von Safari unterstützt wird, sodass wir es bald auch in Safari sehen können. In der Demo von Una kannst du sie in Aktion sehen.

Starke Drosselung verketteter JS-Timer

Chrome 88 drosselt verkettete JavaScript-Timer für ausgeblendete Seiten unter bestimmten Bedingungen stark. Dadurch wird die CPU-Nutzung und damit auch die Akkunutzung reduziert. Es gibt einige Grenzfälle, in denen sich dies auf das Verhalten auswirkt. Timer werden jedoch häufig verwendet, wenn eine andere API effizienter und zuverlässiger wäre.

Das war ziemlich viel Fachjargon und etwas mehrdeutig. Alle Details finden Sie in Jakes Artikel Starke Drosselung verketteter JS-Timer ab Chrome 88.

Google Play Billing in Trusted Web Activity

Du kannst jetzt Play Billing in deinen vertrauenswürdigen Webaktivitäten verwenden, um digitale Waren und Abos über die neue Digital Goods API zu verkaufen. Er ist als Ursprungstest in Chrome 88 für Android verfügbar. Im nächsten Release wird er voraussichtlich auf ChromeOS ausgeweitet.

Sobald deine Konten eingerichtet sind, aktualisiere deine vertrauenswürdigen Webaktivitäten, um die Abrechnung über Google Play zu aktivieren, und erstelle deine digitalen Waren in der Play Developer Console. Fügen Sie dann in Ihrer PWA das Token für den Ursprungstest hinzu. Dann können Sie den Code einfügen, um nach vorhandenen Käufen zu suchen, verfügbare Käufe abzufragen und neue Käufe zu tätigen.

// Get list of potential digital goods

const itemService =
  await window.getDigitalGoodsService("https://play.google.com/billing");

const details =
  await itemService.getDetails(['ripe_bananas', 'walnuts', 'pecans' ]);

Adriana und Andre gehen im Vortrag zum Chrome Dev Summit ausführlicher auf das Thema What's new for web apps in Play ein oder sehen Sie sich die docs an.

Und noch mehr

Und natürlich gibt es noch viel mehr.

  • Gemäß einer Änderung im HTML-Standard implizieren Anchor-Tags mit target="_blank" jetzt standardmäßig rel="noopener". Dadurch werden Tab-Napping-Angriffe verhindert.
  • Bei den meisten Betriebssystemen ist die Mausbeschleunigung standardmäßig aktiviert. Dies kann jedoch bei manchen Spielen zu Problemen führen. In Chrome 88 können Sie über die Pointer Lock API die Mausbeschleunigung deaktivieren. Dies bedeutet, dass dieselbe physische Bewegung, ob langsam oder schnell, zur selben Rotation führt, was ein besseres Spielerlebnis und eine höhere Genauigkeit ermöglicht.
  • addEventListener verwendet jetzt ein Abbruchsignal als Option. Durch den Aufruf von abort() wird dieser Event-Listener entfernt. So lassen sich nicht mehr benötigte Ereignis-Listener ganz einfach herunterfahren.

Weitere Informationen

Dies sind nur einige der wichtigsten Punkte. Weitere Änderungen in Chrome 88 finden Sie unter den folgenden Links.

Abo

Wenn Sie über unsere Videos auf dem Laufenden bleiben möchten, abonnieren Sie unseren YouTube-Kanal für Chrome-Entwickler. Wir benachrichtigen Sie per E-Mail, sobald ein neues Video veröffentlicht wird.

Ich bin Pete LePage und sobald Chrome 89 veröffentlicht wird, melde ich mich hier bei Ihnen: Was gibt es Neues bei Chrome?