Poznaj kilka ciekawych funkcji, które w maju 2023 r. pojawiły się w stabilnych i beta-wersjach przeglądarek.
stabilne wersje 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ść.
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
.
oraz funkcję multimediów update
.
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
Funkcje CSS Kolor poziomu 4
Firefox 113 zawiera notacje funkcyjne color()
, lab()
, lch()
, oklab()
, oklch()
i 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.
Większa kontrola nad wyborami :nth-child()
Firefox 113 umożliwia też przekazywanie listy selektorów do funkcji :nth-child()
i 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
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.
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;
}
}
}
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.
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.
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ą.