Nowości na platformie internetowej w maju

Poznaj kilka ciekawych funkcji, które w maju 2023 r. pojawiły się w stabilnych i beta-wersjach przeglądarek.

W maju 2023 r. stały się stabilne wersje Firefox 113, Chrome 113, Chrome 114 i Safari 16.5. Zobaczmy, co to oznacza dla platformy internetowej.

WebGPU

Chrome 113 zawiera WebGPU, który jest następcą interfejsów API do grafiki WebGL i WebGL 2. Zapewnia nowoczesne funkcje, takie jak procesor GPU, mniejszy narzut na procesor GPU, możliwość renderowania w wielu obszarach roboczych z jednego urządzenia graficznego oraz lepszą, bardziej przewidywalną wydajność.

Obsługa przeglądarek

  • Chrome: 113.
  • Edge: 113.
  • Firefox Technology Preview: obsługiwana.
  • Safari Technology Preview: obsługiwane.

Źródło

Zestawy źródeł własnych

Zestawy źródeł własnych (FPS) są częścią Piaskownica prywatności. To sposób, w jaki organizacje mogą deklarować relacje między witrynami, aby przeglądarki mogły decydować, kiedy zezwolić witrynom w zestawie na ograniczony dostęp do plików cookie innych firm. Funkcja FPS rozpoczął wdrażanie etapowe w Chrome 113.

Funkcje mediów CSS i inne

W przypadku usług porównywania cen Chrome 113 zawiera funkcje multimedialne overflow-inline i overflow-block.

Obsługa przeglądarek

  • Chrome: 113.
  • Edge: 113.
  • Firefox: 66.
  • Safari: 17.

Źródło

oraz funkcję multimediów update.

Obsługa przeglądarek

  • Chrome: 113.
  • Edge: 113.
  • Firefox: 102.
  • Safari: 17.

Źródło

Dostępna jest też funkcja wygładzania linear(), o którym więcej informacji znajdziesz w artykule Tworzenie złożonych krzywych animacji w CSS za pomocą funkcji wygładzania linear().

Obsługa przeglądarek

  • Chrome: 113.
  • Edge: 113.
  • Firefox: 112.
  • Safari: 17.2.

Funkcje CSS Kolor poziomu 4

Firefox 113 zawiera notacje funkcyjne color(), lab(), lch(), oklab(), oklch()color-mix() oraz właściwość forced-color-adjust. Oznacza to, że nowe przestrzenie barw i funkcje są teraz obsługiwane we wszystkich 3 głównych silnikach. Więcej informacji o tych przestrzeniach barw i funkcjach znajdziesz w przewodniku po kolorach CSS w wysokiej rozdzielczości.

Obsługa przeglądarek

  • Chrome: 111.
  • Edge: 111.
  • Firefox: 113.
  • Safari: 16.2.

Źródło

Większa kontrola nad wyborami :nth-child()

Firefox 113 umożliwia też przekazywanie listy selektorów do funkcji :nth-child()nth-last-child(). Więcej informacji na ten temat oraz przykłady znajdziesz w artykule Więcej kontroli nad wyborami :nth-child() za pomocą składni S.

Obsługa przeglądarek

  • Chrome: 111.
  • Edge: 111.
  • Firefox: 113.
  • Safari: 9.

Compressions Streams API

Dzięki uwzględnieniu w przeglądarce Firefox 113 interfejs Compressions Streams API umożliwia kompresję i dekompresję strumieni, a teraz obsługiwany przez wszystkie 3 główne silniki. Oznacza to, że aplikacje JavaScript nie muszą już zawierać biblioteki kompresji.

Obsługa przeglądarek

  • Chrome: 80.
  • Edge: 80.
  • Firefox: 113.
  • Safari: 16.4

Źródło

Zagnieżdżanie CSS

Safari 16.5 rozwiązuje większość problemów, ale zawiera też obsługę zagnieżdżania CSS za pomocą nowego selektora zagnieżdżania >, który służy do zagnieżdżania powiązanych reguł stylów w sposób znany deweloperom, którzy korzystali z przetwarzaczy:

.nesting {
 
color: hotpink;

 
> .is {
   
color: rebeccapurple;

   
> .awesome {
     
color: deeppink;
   
}
 
}
}

Obsługa przeglądarek

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

Źródło

Równowaga między nagłówkami: text-wrap: balance

Od Chrome 114 możesz używać text-wrap: balance. Dzięki temu możesz zrównoważyć nagłówki, unikając problemu polegającego na umieszczeniu pojedynczego słowa w ostatnim wierszu, co zapewni lepszy i czytelniejszy wynik. Więcej informacji znajdziesz w artykule CSS – przenoszenie tekstu: balans.

Obsługa przeglądarek

  • Chrome: 114.
  • Edge: 114.
  • Firefox: 121.
  • Safari: 17.4

Źródło

CHIPS: pliki cookie z niezależnym stanem partycji

W ramach prac nad stopniowym wycofywaniem plików cookie innych firm CHIPS umożliwia akceptację plików cookie innych firm dzielonych według witryn najwyższego poziomu za pomocą nowego atrybutu pliku cookie Partitioned. CHIPS jest dostępny w Chrome 114.

Popover API

W Chrome 114 znajdziesz też interfejs Popover API, który ułatwia tworzenie przejściowych elementów interfejsu użytkownika wyświetlanych na wierzchu wszystkich innych interfejsów aplikacji internetowej.

Dotyczy to elementów interaktywnych, takich jak menu akcji, sugestie elementów formularza, selektory treści i interfejsy do nauki.

Nowy atrybut popover umożliwia automatyczne wyświetlanie dowolnego elementu w górnej warstwie. Oznacza to, że deweloper nie musi już martwić się pozycjonowaniem, układaniem elementów, skupieniem czy interakcjami z klawiaturą.

Więcej informacji znajdziesz w artykule [EN] Wprowadzenie do interfejsu popover API.

Obsługa przeglądarek

  • Chrome: 114.
  • Edge: 114.
  • Firefox: 120.
  • Safari: 17.

Źródło

Wersje beta przeglądarek

Wersje beta przeglądarki umożliwiają przeglądanie funkcji, które pojawią się w następnej wersji stabilnej. To świetny czas na przetestowanie nowych funkcji lub usunięcia, które mogą wpłynąć na Twoją witrynę, zanim zostaną wprowadzone na całym świecie. Nowe wersje beta to Firefox 114, Chrome 115 i Safari 16.6. Te wersje wprowadzają na platformę wiele przydatnych funkcji. Przeczytaj informacje o wersji, aby poznać wszystkie szczegóły. Oto kilka najważniejszych informacji.

Chrome 115 zawiera wiele wartości właściwości CSS display. Oznacza to, że display: flex staje się display: block flex, a display: block staje się display: block flow. Pojedyncze wartości są zachowywane jako starsze wersje słów kluczowych, a gdy pojawią się w Chrome Stable, będą dostępne w wielu silnikach.

W Chrome 115 są też dostępne rozszerzenia ScrollTimeline i ViewTimeline specyfikacji Web Animations. Umożliwiają one korzystanie z animacji przewijanych za pomocą CSS i JavaScriptu.

Firefox 114 zawiera interfejs WebTransport API, który jest nowoczesną wersją interfejsu WebSockets. Zapewnia on obsługę wielu strumieni, strumieni jednokierunkowych i dostarczania poza kolejnością.

Cześć cyklu Nowości w internecie