Узнайте о некоторых интересных функциях, которые появились в стабильных и бета-версиях веб-браузеров в мае 2023 года.
Стабильные версии браузера
В мае 2023 года Firefox 113 , Chrome 113 , Chrome 114 и Safari 16.5 стали стабильными. Давайте посмотрим, что это значит для веб-платформы.
Веб-графический процессор
Chrome 113 включает WebGPU , преемника графических API WebGL и WebGL 2 для Интернета. Он обеспечивает современные функции, такие как вычисления на графическом процессоре, меньшие затраты на доступ к оборудованию графического процессора, возможность рендеринга на несколько холстов с одного графического устройства, а также лучшую и более предсказуемую производительность.
Собственные наборы
Первичные наборы (FPS) являются частью Privacy Sandbox . Это способ для организаций объявить отношения между сайтами, чтобы браузеры могли решить, когда разрешить ограниченный доступ к сторонним файлам cookie для сайтов в наборе. FPS начал поэтапное внедрение Chrome 113.
Медиа-функции CSS и многое другое
Что касается CSS, Chrome 113 включает в себя медиа-функции overflow-inline и overflow-block .
И функция update мультимедиа.
Также включена функция замедления linear() , о которой вы можете узнать больше в статье Создание сложных кривых анимации в CSS с помощью функции замедления linear() .
Поддержка браузера
- 113
- 113
- 112
- 17.2
Возможности CSS Color Level 4
Firefox 113 включает функциональные обозначения color() , lab() , lch() , oklab() , oklch() и color-mix() , а также свойство принудительной настройки цвета. Это означает, что новые цветовые пространства и функции теперь поддерживаются всеми тремя основными движками. Вы можете узнать больше об этих цветовых пространствах и функциях в руководстве по цветам CSS высокой четкости .
Больше контроля над выбором :nth-child()
Firefox 113 также добавляет возможность передавать список селекторов в :nth-child() и nth-last-child() . Узнайте больше об этом и посмотрите примеры в статье «Больше контроля над выбором :nth-child() с помощью синтаксиса of S» .
Поддержка браузера
- 111
- 111
- 113
- 9
API потоков сжатия
Теперь API Compressions Streams поддерживается во всех трех основных движках благодаря включению в Firefox 113 и позволяет сжимать и распаковывать потоки. Это означает, что приложениям JavaScript больше не требуется использовать библиотеку сжатия.
CSS-вложение
Safari 16.5 в основном решил проблемы, но также добавил поддержку вложенности CSS с новым селектором вложенности > , используемым для вложения связанных правил стиля, способом, который будет знаком разработчикам, которые использовали препроцессоры:
.nesting {
color: hotpink;
> .is {
color: rebeccapurple;
> .awesome {
color: deeppink;
}
}
}
Балансировка заголовков с text-wrap: balance
В Chrome 114 вы можете использовать text-wrap: balance . Это позволяет сбалансировать заголовки, избегая проблемы наличия одного слова в последней строке, обеспечивая более приятный и читабельный результат. Вы можете узнать больше в CSS text-wrap: Balance .
CHIPS: файлы cookie с независимым разделенным состоянием
В рамках работы по поэтапному отказу от сторонних файлов cookie CHIPS позволяет разрешить разделение сторонних файлов cookie по сайтам верхнего уровня с использованием нового атрибута файлов cookie Partitioned . CHIPS доступен в Chrome 114.
API-интерфейс Поповера
Также в Chrome 114 есть API Popover , упрощающий создание элементов временного пользовательского интерфейса (UI), которые отображаются поверх всего другого пользовательского интерфейса веб-приложения.
К ним относятся интерактивные с пользователем элементы, такие как меню действий, предложения элементов формы, средства выбора контента и обучающий пользовательский интерфейс.
Новый атрибут popover позволяет автоматически отображать любой элемент на верхнем слое . Это означает, что разработчику больше не нужно беспокоиться о позиционировании, расположении элементов, фокусе или взаимодействии с клавиатурой.
Узнайте больше в статье «Введение в API popover» .
Бета-версии браузера
Бета-версии браузера дают вам предварительный просмотр того, что будет в следующей стабильной версии браузера. Это прекрасное время для тестирования новых функций или удалений, которые могут повлиять на ваш сайт, прежде чем мир получит эту версию. Новые бета-версии — Firefox 114 , Chrome 115 и Safari 16.6 . Эти выпуски привносят в платформу множество замечательных функций. Ознакомьтесь со всеми подробностями в примечаниях к выпуску, вот лишь несколько основных моментов.
Chrome 115 включает несколько значений свойства CSS display . Это означает, что display: flex становится display: block flex и display: block становится display: block flow . Отдельные значения сохраняются как устаревшие ключевые слова, а в стабильной версии Chrome несколько значений становятся доступными для всех движков.
Также в Chrome 115 есть расширения ScrollTimeline и ViewTimeline спецификации веб-анимации. Они позволяют использовать анимацию, управляемую прокруткой, с помощью CSS и JavaScript.
Firefox 114 включает API WebTransport — современное обновление WebSockets, обеспечивающее поддержку нескольких потоков, однонаправленных потоков и доставки вне очереди.
Часть новой веб-серии.