Nowości na platformie internetowej w styczniu

Odkryj ciekawe funkcje, które zostały udostępnione w przeglądarkach stabilnych i beta w styczniu 2024 r.

Stabilne wersje przeglądarek

W styczniu 2024 r. Firefox 122 oraz Chrome 121 i Safari 17.3 stały się stabilne. W tym poście omawiamy nowe funkcje dodane do platformy internetowej.

<hr> w: <select>

W przeglądarce Firefox 122 elementy <hr> są dozwolone jako elementy podrzędne elementów <select>. Zwiększa to czytelność wybranych list z dużą liczbą opcji. Obecnie wszystkie główne wyszukiwarki obsługują tę funkcję. Warto jednak pamiętać, że obecnie żadna przeglądarka nie udostępnia elementu <hr> w drzewie ułatwień dostępu.

Obsługa przeglądarek

  • 119
  • 119
  • 122
  • 17

HTMLSelectElement.showPicker

Także w przypadku elementów <select> w Firefoksie metoda showPicker() dla właściwości HTMLSelectElement. Jest to ten sam selektor, który normalnie wyświetla się po wybraniu elementu, ale może być aktywowany po naciśnięciu przycisku lub innej interakcji użytkownika.

Obsługa przeglądarek

  • 121
  • 121
  • 122

Źródło

Interfejs API największego wyrenderowania treści (LCP)

Firefox 122 obsługuje też interfejs API LCP. Ten interfejs API wydajności dostarcza informacje o czasie dotyczące największego obrazu lub wyrenderowanego tekstu, zanim użytkownik wejdzie w interakcję ze stroną internetową. Więcej informacji o LCP znajdziesz w dokumentacji LCP.

Obsługa przeglądarek

  • 77
  • 79
  • 122
  • x

Źródło

Właściwości paska przewijania CSS

W Chrome 121 dodano obsługę właściwości paska przewijania scrollbar-color i scrollbar-width. Więcej informacji na ten temat znajdziesz w artykule Style paska przewijania.

Obsługa przeglądarek

  • 121
  • 121
  • 64
  • x

Źródło

Animacja CSS font-palette

Właściwość font-palette pozwala wybrać konkretną paletę do renderowania czcionki w kolorze. Ta właściwość obsługuje teraz animację, więc przełączanie się między paletami staje się płynnym przejściem między 2 wybranymi paletami.

Metody transfer() i transferToFixedLength() obiektu ArrayBuffer

Firefox obejmuje metody transfer() JavaScript i transferToFixedLength() metod ArrayBuffer. Metoda transfer() tworzy nowy element ArrayBuffer o takiej samej zawartości w bajtach jak bieżący element ArrayBuffer, a następnie odłącza pierwotny element ArrayBuffer. Metoda transferToFixedLength() działa w ten sam sposób, ale tworzy stały rozmiar ArrayBuffer.

Obsługa przeglądarek

  • 114
  • 114
  • 122
  • 17,4

Źródło

Aktualizacje interfejsu Speculation Rules API

Witryny używają interfejsu API reguł spekulacyjnych, aby automatycznie informować Chrome o tym, które strony mają być wyrenderowane wstępnie. Dzięki temu przeglądanie stron jest bardziej komfortowe dla użytkowników.

Chrome 121 zapewnia obsługę reguł dokumentów – są one rozszerzeniem składni reguł spekulacyjnych, które umożliwiają przeglądarce pobieranie listy adresów URL z elementów strony na potrzeby ładowania spekulacyjnego. Reguły dokumentu mogą zawierać kryteria określające, które z tych linków mogą być używane. Razem z nowym polem „zainteresowanie” umożliwia automatyczne pobieranie lub wstępne renderowanie linków na stronach bezpośrednio po najechaniu kursorem myszy lub po najechaniu na nie kursorem myszy.

Wersje przeglądarki (beta)

Wersje beta zawierają podgląd funkcji, które pojawią się w następnej stabilnej wersji przeglądarki. To doskonała okazja do przetestowania nowych funkcji lub usunięcia, które mogą wpłynąć na Twoją witrynę, zanim udostępnimy ją użytkownikom na całym świecie. Nowe wersje beta to Firefox 123, Chrome 122 i Safari 17.4. Wprowadziliśmy w nich wiele świetnych funkcji. Wszystkie szczegóły znajdziesz w informacjach o wersji. Oto kilka najważniejszych informacji.

W przeglądarce Firefox 123 w wersji beta dostępny jest deklaracyjny model cienia DOM.

Dodatkowo przeglądarka Firefox 123 obsługuje kod stanu odpowiedzi informacyjnej HTTP 103 Early Hints na potrzeby wstępnego wczytywania zasobów, których strona może potrzebować, gdy serwer przygotowuje pełną odpowiedź.

W Safari w wersji beta 17.4 jest sporo dobrych funkcji. W przypadku CSS obsługujemy znaczniki @scope, align-content w kontenerach blokowych i komórkach tabeli oraz pseudoelementy ::grammar-error i ::spelling-error oraz wiele innych elementów.

W formularzach dostępna jest obsługa trybu pisania pionowego w elementach sterujących formularza, metodę showPicker() w przypadku <input type="date"> oraz obsługę <hr> w <select> na iOS.

JavaScript uzyskuje też nowe funkcje, które obsługują m.in. metody detached(), transfer() i transferToFixedLength() ArrayBuffer.

Chrome 122 w wersji beta zawiera opcję unsanitized w metodzie read() interfejsu Async Clipboard API, która umożliwia pobranie niesprawdzonego formatu HTML. W przypadku JavaScriptu dostępne są nowe pomocnicze iteratory i nowe metody dla wbudowanej klasy Set.

W Chrome 122 jest też dostępny interfejs Storage buckets API, który ma na celu zwiększenie przewidywalności trwałego usuwania pamięci masowej przy dużym wykorzystaniu pamięci.