Chrome 133 beta

Rachel Andrew

Data publikacji: 15 stycznia 2024 r.

O ile nie zaznaczono inaczej, poniższe zmiany dotyczą najnowszej wersji beta Chrome na Androida, ChromeOS, Linuxa, macOS i Windowsa. Więcej informacji o funkcjach wymienionych tutaj znajdziesz w podanych linkach lub na liście na stronie ChromeStatus.com. Chrome 133 jest w wersji beta od 15 stycznia 2024 r. Najnowsze informacje możesz pobrać ze strony Google.com na komputerze lub ze Sklepu Google Play na urządzeniu z Androidem.

CSS i interfejs

Ta wersja dodaje 7 nowych funkcji CSS i interfejsu.

Zaawansowana funkcja CSS attr()

Wprowadza rozszerzenie attr() określone w CSS na poziomie 5, które umożliwia używanie typów innych niż <string> we wszystkich właściwościach CSS (oprócz istniejącej obsługi pseudoelementu content).

Więcej informacji znajdziesz w artykule Ulepszenie usługi porównywania cen.attr()

Pseudoklasa CSS :open

Klasa pseudoelementu :open pasuje do elementów <dialog> i <details>, gdy są otwarte, oraz do elementów <select> i <input>, gdy są w trybach, w których jest wyświetlany selektor.

Zapytania dotyczące kontenerów stanu przewijania CSS

Używaj zapytań o kontenery, aby określać styl elementów podrzędnych kontenerów na podstawie ich stanu przewijania.

Kontener zapytania jest kontenerem przewijania lub elementem, na który wpływa pozycja przewijania kontenera przewijania. Możesz wysyłać zapytania o te stany:

  • stuck: kontener o stałej pozycji jest przyklejony do jednej z krawędzi pola przewijania.
  • snapped: kontener z przyciąganiem przewijania jest obecnie przyciągnięty w poziomie lub w pionie.
  • scrollable: czy kontener przewijania można przewijać w kierunku, o który pytasz.

Nowy container-type: scroll-state umożliwia wysyłanie zapytań do kontenerów.

#sticky {
  position: sticky;
  container-type: scroll-state;
}

@container scroll-state(stuck: top) {
  #sticky-child {
    font-size: 75%;
  }
}

Więcej informacji znajdziesz w sekcji Usługi porównywania cen.scroll-state()

CSS text-box, text-box-trim i text-box-edge

Aby uzyskać optymalną równowagę treści tekstowej, właściwości text-box-trim i text-box-edge oraz właściwość skrócona text-box umożliwiają precyzyjną kontrolę nad pionowym wyrównaniem tekstu.

Właściwość text-box-trim określa, które boki mają zostać przycięte (górny lub dolny), a właściwość text-box-edge określa, jak ma zostać przycięta krawędź.

Te właściwości umożliwiają precyzyjne kontrolowanie odstępów pionowych za pomocą danych o czcionce. Więcej informacji znajdziesz w artykule CSS text-box-trim.

Wartość hint atrybutu popover

Interfejs Popover API określa działanie 2 wartości atrybutu popover: auto i manual. Ta funkcja opisuje trzecią wartość, popover=hint. Wskazówki, które są najczęściej powiązane z zachowaniami typu „etykietka”, działają nieco inaczej. Główna różnica polega na tym, że element hint jest podrzędny względem elementu auto podczas otwierania zagnieżdżonych stosów wyskakujących okienek. Dlatego można otworzyć niezwiązane wyskakujące okienko hint, gdy otwarty jest stos wyskakujących okienek auto.

Przykładem może być otwarty selektor <select> (popover=auto) i wyświetlana etykietka wywoływana najechaniem kursorem (popover=hint). To działanie nie zamyka selektora <select>.

Ulepszenia dotyczące wywoływania wyskakujących okienek i pozycjonowania kotwic

Dodaje imperatywny sposób ustawiania relacji wywołujących między wyskakującymi okienkami za pomocą elementu popover.showPopover({source}). Umożliwia relacjom wywołującym tworzenie niejawnych odwołań do elementu kotwicy.

Wyskakujące okienko zagnieżdżone w elemencie wywołującym nie powinno go ponownie wywoływać

W tym przypadku kliknięcie przycisku prawidłowo aktywuje wyskakujące okienko, ale kliknięcie samego okienka nie powinno go zamykać.

<button popovertarget=foo>Activate
  <div popover id=foo>Clicking me shouldn't close me</div>
</button>

Wcześniej tak się działo, ponieważ kliknięcie wyskakującego okienka powodowało propagację zdarzenia do elementu <button> i aktywowało element wywołujący, który zamykał wyskakujące okienko. Zmieniliśmy to na oczekiwane działanie.

Interfejsy Web API

Animation.overallProgress

Zapewnia deweloperom wygodną i spójną reprezentację postępu animacji w kolejnych iteracjach, niezależnie od charakteru osi czasu. Bez właściwości overallProgress musisz ręcznie obliczyć, jak daleko zaawansowana jest animacja, uwzględniając liczbę iteracji animacji oraz to, czy currentTime animacji jest procentem całkowitego czasu (jak w przypadku animacji sterowanych przewijaniem), czy bezwzględną wartością czasu (jak w przypadku animacji sterowanych czasem).

Metoda pause() obiektu Atomics

Dodaje metodę pause() do obiektu przestrzeni nazw Atomics, aby zasugerować procesorowi, że bieżący kod wykonuje blokadę spinlock.

Raportowanie skrótów CSP w przypadku skryptów

Złożone aplikacje internetowe często muszą śledzić pobierane przez siebie zasoby podrzędne ze względów bezpieczeństwa.

W szczególności nadchodzące standardy branżowe i sprawdzone metody (np. PCI-DSS w wersji 4) wymagają, aby aplikacje internetowe prowadziły spis wszystkich pobieranych i wykonywanych skryptów.

Ta funkcja korzysta z CSP i interfejsu API do raportowania, aby raportować adresy URL i wartości skrótu (w przypadku CORS/tego samego pochodzenia) wszystkich zasobów skryptów, które wczytuje dokument.

Przenoszenie z zachowaniem stanu DOM

Dodaje element DOM (Node.prototype.moveBefore), który umożliwia przenoszenie elementów w drzewie DOM bez resetowania stanu elementu.

Podczas przenoszenia zamiast usuwania i wstawiania zachowywany jest stan, np.:

  • <iframe> elementu pozostaje wczytanych.
  • Aktywny element pozostaje zaznaczony.
  • Wyskakujące okienka, okna pełnoekranowe i okna modalne pozostają otwarte.
  • Przejścia i animacje CSS są kontynuowane.

Udostępnij atrybut attributionsrc w <area>

Dopasowuje wyświetlanie atrybutu attributionsrc w przypadku <area> do dotychczasowego sposobu przetwarzania tego atrybutu, nawet jeśli nie był on wyświetlany.

Dodatkowo warto obsługiwać atrybut w przypadku elementu <area>, ponieważ jest on podstawową powierzchnią nawigacyjną, a Chrome obsługuje już ten atrybut na innych powierzchniach elementów <a> i window.open.

Udostępnianie przybliżonych danych renderTime z innych domen w czasie działania elementu i LCP (niezależnie od Timing-Allow-Origin)

Wpisy dotyczące czasu elementu i LCP mają atrybut renderTime, który jest zgodny z pierwszą klatką, w której wyrenderowano obraz lub tekst.

Ten atrybut jest obecnie chroniony w przypadku obrazów z innych domen przez wymaganie nagłówka Timing-Allow-Origin w zasobie obrazu. To ograniczenie można jednak łatwo obejść (np. wyświetlając w tej samej ramce obraz pochodzący z tej samej domeny i obraz pochodzący z innej domeny).

Ponieważ to ograniczenie wprowadzało zamieszanie, planujemy je usunąć i zamiast tego zwiększyć wszystkie czasy renderowania o 4 ms, gdy dokument nie jest odizolowany od innych domen. Jest to wystarczająco duża wartość, aby uniknąć wycieku przydatnych informacji o dekodowaniu obrazów z innych domen.

Cofnij responseStart i wprowadź firstResponseHeadersStart

Gdy 103 Early Hints jest włączone, odpowiedzi mają dwie sygnatury czasowe:

  • Gdy pojawią się wczesne wskazówki (103)
  • Gdy dotrą nagłówki końcowe (np. 200)

Gdy udostępniliśmy Chrome 115firstInterimResponseStart, aby umożliwić pomiar tych dwóch sygnatur czasowych, zmieniliśmy też znaczenieresponseStart (używanego przez czas do pierwszego bajta (TTFB)) na „ostateczne nagłówki”. Spowodowało to problem ze zgodnością z przeglądarkami i narzędziami, które nie wprowadziły podobnej zmiany w przypadku tych powszechnie używanych danych.

Chrome 133 cofa tę responseStart zmianę, aby rozwiązać problem z kompatybilnością, i zamiast tego wprowadza firstResponseHeadersStart, aby umożliwić witrynom pomiar czasu do otrzymania ostatecznych nagłówków przy zachowaniu pierwotnej definicji TTFB.

Interfejs FileSystemObserver

FileSystemObserverInterfejs powiadamia witryny o zmianach w systemie plików. Witryny obserwują zmiany w plikach i katalogach, do których użytkownik wcześniej przyznał uprawnienia, na lokalnym urządzeniu użytkownika lub w systemie plików Bucket (znanym też jako Origin Private File System) i otrzymują powiadomienia o podstawowych informacjach o zmianach, takich jak ich rodzaj.

Blokowanie w funkcji Oszczędzanie energii

Gdy Oszczędzanie energii jest aktywne, Chrome zamraża „grupę kontekstów przeglądania”, która jest ukryta i nieaktywna od ponad 5 minut, jeśli jakakolwiek podgrupa ramek tego samego pochodzenia w tej grupie przekracza próg wykorzystania procesora, chyba że:

  • Umożliwia prowadzenie konferencji audio lub wideo (wykrywane przez identyfikację mikrofonu, kamery lub przechwytywania ekranu/okna/karty albo RTCPeerConnection z otwartym kanałem RTCDataChannel lub aktywnym ścieżką MediaStreamTrack).
  • Steruje urządzeniem zewnętrznym (wykrytym za pomocą interfejsów WebUSB, Web Bluetooth, WebHID lub Web Serial).
  • zawiera blokadę internetową lub połączenie IndexedDB, które blokuje aktualizację wersji lub transakcję w innym połączeniu;

Zamrażanie polega na wstrzymaniu wykonywania. Jest on formalnie zdefiniowany w interfejsie Page Lifecycle API.

Próg wykorzystania procesora zostanie skalibrowany tak, aby zamrażać około 10% kart w tle, gdy oszczędzanie energii jest aktywne.

Wiele map importu

Mapy importu muszą się wczytywać przed dowolnym modułem ES i w każdym dokumencie może być tylko jedna mapa importu. To sprawia, że są one podatne na uszkodzenia i mogą być powolne w użyciu w rzeczywistych scenariuszach: każdy moduł, który wczytuje się przed nimi, powoduje awarię całej aplikacji, a w aplikacjach z wieloma modułami stają się dużym zasobem blokującym, ponieważ najpierw musi się wczytać cała mapa wszystkich możliwych modułów.

Ta funkcja umożliwia korzystanie z wielu map importu w jednym dokumencie przez ich scalanie w spójny i deterministyczny sposób.

Nagłówki dostępu do pamięci

Umożliwia uwierzytelnionym elementom osadzonym włączenie niepodzielonych plików cookie. Te nagłówki wskazują, czy niepodzielone pliki cookie są (lub mogą być) uwzględniane w danym żądaniu sieciowym, i umożliwiają serwerom aktywowanie uprawnień „storage-access”, które zostały już przyznane. Udostępnienie alternatywnego sposobu aktywowania uprawnienia „storage-access” umożliwia korzystanie z niego zasobom niebędącym elementami iframe i może skrócić czas oczekiwania w przypadku uwierzytelnionych elementów osadzonych.

Obsługa tworzenia ClipboardItem za pomocą Promise<DOMString>

Symbol ClipboardItem, który jest danymi wejściowymi metody asynchronicznego schowka write(), akceptuje teraz w konstruktorze wartości ciągu znaków oprócz obiektów Blob. ClipboardItemData może być obiektem Blob, ciągiem tekstowym lub obietnicą, która zwraca obiekt Blob lub ciąg tekstowy.

WebAssembly Memory64

Propozycja memory64 dodaje obsługę liniowych pamięci WebAssembly o rozmiarze większym niż 2^32 bitów. Nie zawiera nowych instrukcji, ale rozszerza istniejące instrukcje, aby umożliwić 64-bitowe indeksy pamięci i tabel.

Interfejs Web Authentication API: metoda PublicKeyCredential getClientCapabilities()

Metoda PublicKeyCredential getClientCapabilities() umożliwia określenie, które funkcje WebAuthn są obsługiwane przez klienta użytkownika. Metoda zwraca listę obsługiwanych funkcji, co umożliwia programistom dostosowywanie uwierzytelniania i przepływów pracy do konkretnych funkcji klienta.

WebGPU: 1-elementowe formaty wierzchołków (i unorm8x4-bgra)

Dodaje dodatkowe formaty wierzchołków, które nie były dostępne w pierwszej wersji WebGPU z powodu braku obsługi lub starszych wersji macOS (które nie są już obsługiwane przez żadną przeglądarkę). Formaty wierzchołków z 1 komponentem umożliwiają aplikacjom żądanie tylko niezbędnych danych, podczas gdy wcześniej musiały one żądać co najmniej 2 razy więcej danych w przypadku 8- i 16-bitowych typów danych. Format unorm8x4-bgra nieco ułatwia wczytywanie kolorów wierzchołków zakodowanych w formacie BGRA przy zachowaniu tego samego shadera.

algorytm X25519 interfejsu Web Cryptography API,

Algorytm „X25519” udostępnia narzędzia do uzgadniania kluczy za pomocą funkcji X25519 określonej w [RFC7748]. Identyfikator algorytmu „X25519” może być używany w interfejsie SubtleCrypto do uzyskiwania dostępu do zaimplementowanych operacji: generateKey, importKey, exportKey, deriveKey i deriveBits.

Nowe wersje próbne origin

W Chrome 133 możesz wziąć udział w tych nowych eksperymentach z źródłem.

Rezygnacja z blokowania w funkcji Oszczędzanie energii

Ta wersja próbna umożliwia witrynom rezygnację z blokowania w funkcji Oszczędzanie energii, które zostanie wprowadzone w Chrome 133.

Wycofania i usunięcia

Ta wersja Chrome wprowadza wycofania i usunięcia wymienione poniżej. Listy planowanych wycofań, bieżących wycofań i poprzednich usunięć znajdziesz na stronie ChromeStatus.com.

Ta wersja Chrome wycofuje jedną funkcję.

Wycofanie limitu WebGPU maxInterStageShaderComponents

Element maxInterStageShaderComponents limit został wycofany z powodu kombinacji czynników. Planowana data usunięcia w Chrome 135.

  • Nadmiarowość w przypadku maxInterStageShaderVariables: ten limit służy już podobnemu celowi, kontrolując ilość danych przekazywanych między etapami shadera.
  • Niewielkie rozbieżności: chociaż istnieją niewielkie różnice w sposobie obliczania tych 2 limitów, są one nieznaczne i można nimi skutecznie zarządzać w ramach limitu maxInterStageShaderVariables.
  • Uproszczenie: usunięcie maxInterStageShaderComponents upraszcza interfejs shadera i zmniejsza złożoność dla deweloperów. Zamiast zarządzać 2 osobnymi limitami, które różnią się od siebie w niewielkim stopniu, mogą skupić się na bardziej odpowiednio nazwanym i wszechstronnym limicie maxInterStageShaderVariables.

Ta wersja Chrome usuwa 2 funkcje.

Wcześniej, gdy zasób był wstępnie pobierany za pomocą <link rel=prefetch>, Chrome ignorował semantykę pamięci podręcznej (czyli max-age i no-cache) przy pierwszym użyciu w ciągu 5 minut, aby uniknąć ponownego pobierania. Chrome usuwa teraz ten przypadek specjalny i używa normalnej semantyki pamięci podręcznej HTTP.

Oznacza to, że aby korzystać z <link rel=prefetch>, programiści stron internetowych muszą uwzględnić odpowiednie nagłówki pamięci podręcznej (Cache-Control lub Expires).

Dotyczy to też niestandardowego <link rel=prerender>.

Usuwanie wywoływania strony powitalnej Chrome za pomocą kart pierwszego uruchomienia z początkowymi ustawieniami

Umieszczenie wartości chrome://welcome we właściwości first_run_tabs pliku initial_preferences nie będzie miało żadnego efektu. Została ona usunięta, ponieważ jest zbędna w stosunku do widoku wyświetlanego po pierwszym uruchomieniu, który pojawia się na platformach komputerowych.