Nowości na platformie internetowej we wrześniu

Poznaj kilka ciekawych funkcji, które obecnie są dostępne w wersji stabilnej i beta. przeglądarek we wrześniu 2024 r.

Rachel Andrew

stabilne wersje przeglądarek,

We wrześniu 2024 r. Firefox 130, Safari 18 oraz Wersja Chrome 129 stała się stabilna. W tym poście omawiamy nowe funkcje dodane do platformy internetowej.

Ekskluzywne harmonijki z atrybutem name dla <details>

Firefox 130 obsługuje atrybut name elementu <details>. Te grupy <details>, gdzie tylko jeden element grupy może być otwarty na poziomie obecnie się znajdujesz. Dzięki temu możesz stworzyć akordeon na wyłączność bez używania JavaScriptu.

Obsługa przeglądarek

  • Chrome: 120.
  • Edge: 120.
  • Firefox: 130.
  • Safari: 17.2

Animowanie do pozycji automatycznej (i inne funkcje)

Chrome 129 dodaje właściwość CSS interpolate-size i funkcję calc-size().

Właściwość CSS interpolate-size umożliwia stronie korzystanie z animacji i przejść z kluczowych słów dotyczących rozmiaru domyślnego w usłudze porównywania cen, takich jak auto, min-content i fit-content, w przypadkach, gdy można je animować.

Obsługa przeglądarek

  • Chrome: 129.
  • Edge: nieobsługiwane.
  • Firefox: nieobsługiwane.
  • Safari: nieobsługiwane.

Źródło

Funkcja CSS calc-size() jest funkcją CSS podobną do funkcji calc(), jednak obsługuje również operacje na dokładnie jednym słowie kluczowym o obsługiwanym rozmiarze. Obsługiwane słowa kluczowe dotyczące rozmiaru to auto, min-content, max-content i fit-content.

Obsługa przeglądarek

  • Chrome: 129.
  • Edge: 129.
  • Firefox: nieobsługiwane.
  • Safari: nieobsługiwane.

Źródło

Więcej informacji: Animacja do wysokości: auto; (i innych słów kluczowych związanych z określaniem rozmiaru) w CSS.

Formatowanie czasu w JavaScript

W Chrome 129 jest też dostępna funkcja Intl.DurationFormat, która umożliwia formatowanie czasu trwania, np. „1 godz. 40 min 30 sek.”, w różnych lokalizacjach.

Obsługa przeglądarek

  • Chrome: 129.
  • Edge: 129.
  • Firefox: nieobsługiwane.
  • Safari: 16.4

Źródło

WebCodecs API

Interfejs API Web Codecs jest teraz obsługiwana w przeglądarce Firefox 130 na komputerach, programistów, mają niski dostęp do poszczególnych klatek strumienia wideo i na kolejne fragmenty. Nowe interfejsy: VideoEncoder, VideoDecoder, EncodedVideoChunk, VideoFrame i VideoColorSpace. Ten interfejs API nie do końca udostępnij opcję Baseline Nowość, ponieważ nie jest jeszcze obsługiwana w przeglądarce Firefox na Androida, Przeglądarka Firefox Nightly jest dostępna na Androidzie.

Obsługa przeglądarek

  • Chrome: 94.
  • Edge: 94.
  • Firefox: 130.
  • Safari: 16.4

Źródło

Zapytania o styl CSS dotyczące właściwości niestandardowych

Safari 18 obsługuje kilka nowych funkcji, w tym zapytania dotyczące stylu CSS. Zapytania dotyczące stylów umożliwiają tworzenie stylów do wielokrotnego użytku i ich stosowanie jako grupy. Na przykład, gdy masz komponent wielokrotnego użytku z wieloma odmianami.

Obsługa przeglądarek

  • Chrome: 111.
  • Edge: 111.
  • Firefox: funkcja nieobsługiwana.
  • Safari: 18.

Źródło

Dowiedz się więcej o zapytaniach dotyczących stylu w usłudze porównywania cen.

Przechodzenie między widokami tego samego dokumentu

Safari 18 obsługuje też przejścia między widokami tego samego dokumentu w przypadku aplikacji SPA, co pozwala tworzyć wizualne przejścia między różnymi stanami aplikacji.

Obsługa przeglądarek

  • Chrome: 111.
  • Edge: 111.
  • Firefox: funkcja nieobsługiwana.
  • Safari: 18.

Źródło

Dowiedz się więcej o przejściach między widokami tego samego dokumentu.

Wersje beta przeglądarek

Przeglądarki w wersji beta dają podgląd funkcji, które pojawią się w następnej kolejności wersji stabilnej. To świetny moment, aby przetestować nowe funkcje lub usunięcia treści, które mogą mieć wpływ na Twoją witrynę, zanim trafią one na cały świat. Nowe wersje beta to Firefox 131, Chrome 130 i Safari 18.1. Te wersje wprowadzają na platformie wiele świetnych funkcji. Wszystkie szczegóły znajdziesz w informacjach o wersji. Oto kilka z nich w Google Ads.

Firefox 131 zawiera nowe pomocniki iteratora JavaScript oraz Pliki cookie mające stan niezależnych partycji (CHIPS) są teraz włączone.

Chrome 130 obsługuje zarówno język box-decoration-break: clone, jak i wbudowane fragmentacja (układ linii) i fragmentacja blokowa (fragmenty utworzone dla drukowanie i multikolacje). Narzędzie IndexedDB udostępnia też lepsze raportowanie błędów, i nowy atrybut connected dla interfejsu Web Serial SerialPort.

Safari 18.1 to wersja z poprawkami błędów istniejących funkcji.