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. Udostępnia ona nowoczesne funkcje, takie jak obliczanie na GPU, łatwiejszy dostęp do sprzętu GPU, możliwość renderowania na 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. Dzięki temu organizacje mogą deklarować relacje między witrynami, aby przeglądarki mogły decydować, kiedy zezwalać na ograniczony dostęp do plików cookie innych firm w przypadku witryn w danym zestawie. FPS został wdrożony etapami w Chrome 113.

Funkcje mediów CSS i inne

W przypadku CSS Chrome 113 zawiera funkcje multimedialne overflow-inlineoverflow-block.

Obsługa przeglądarek

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

Źródło

I funkcja multimediów update.

Obsługa przeglądarek

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

Źródło

Dodano też funkcję wygładzania linear(), o której dowiesz się więcej z artykułu 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 dotyczące poziomu 4 kolorów

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 wprowadza też możliwość przekazywania 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

Interfejs Compressions Streams API, który umożliwia kompresowanie i dekompresowanie strumieni, jest teraz obsługiwany we wszystkich 3 głównych silnikach ze względu na jego włączenie w Firefoxa 113. 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 w 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ównoważenie nagłówków za pomocą 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 przelotnych 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 edukacyjne.

Nowy atrybut popover umożliwia automatyczne wyświetlanie dowolnego elementu w najwyższym poziomie. 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. Wszystkie szczegóły znajdziesz w informacjach o wersji. Poniżej przedstawiamy 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 animowanie elementów za pomocą przewijania 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ą.

Fragment cyklu Nowości w internecie