Откройте для себя некоторые интересные функции, которые появились в стабильных и бета-версиях веб-браузеров в январе 2024 года.
Стабильные версии браузера
В январе 2024 года Firefox 122 , Chrome 121 и Safari 17.3 стали стабильными. В этом посте рассматриваются новые функции, добавленные в веб-платформу.
<hr>
в <select>
Firefox 122 добавляет элементы <hr>
в качестве допустимых дочерних элементов <select>
. Это помогает улучшить читаемость списков выбора с большим количеством опций. Все основные браузерные движки теперь поддерживают эту функцию. Однако стоит отметить, что ни один браузер в настоящее время не отображает <hr>
в дереве доступности.
Поддержка браузера
- 119
- 119
- 122
- 17
HTMLSelectElement.showPicker
Также для элементов <select>
в Firefox есть метод showPicker()
для HTMLSelectElement
. Это тот же самый инструмент выбора, который обычно отображается при выборе элемента, но его можно активировать нажатием кнопки или другим взаимодействием с пользователем.
Самый большой API-интерфейс Contentful Paint (LCP)
Firefox 122 также поддерживает LCP API . Этот API производительности предоставляет информацию о времени для самого большого изображения или текста перед взаимодействием пользователей с веб-страницей. Подробную информацию о LCP можно найти в документации LCP .
Свойства полосы прокрутки CSS
В Chrome 121 добавлена поддержка свойств полосы прокрутки scrollbar-color
и scrollbar-width
. Подробнее об этом читайте в статье Оформление полосы прокрутки .
CSS font-palette
Свойство font-palette
позволяет выбрать определенную палитру для отображения цветового шрифта. Это свойство теперь поддерживает анимацию, поэтому переключение между палитрами становится плавным переходом между двумя выбранными палитрами.
Методы transfer()
и transferToFixedLength()
класса ArrayBuffer
Firefox включает методы JavaScript transfer()
и transferToFixedLength()
класса ArrayBuffer
. Метод transfer()
создает новый ArrayBuffer
с тем же содержимым байтов, что и текущий ArrayBuffer
, а затем отсоединяет исходный ArrayBuffer
. Метод transferToFixedLength()
работает таким же образом, но создает ArrayBuffer
фиксированного размера.
Обновления API правил спекуляций
Сайты используют API Speculation Rules , чтобы программно сообщать Chrome, какие страницы нужно предварительно отрисовывать, что повышает удобство работы пользователей за счет сокращения времени навигации по страницам.
Chrome 121 включает поддержку правил документов : они представляют собой расширение синтаксиса правил спекуляции, которое позволяет браузеру получать список URL-адресов для спекулятивной загрузки из элементов на странице. Правила документа могут включать критерии, по которым можно использовать эти ссылки. Это, в сочетании с новым полем «стремления» , позволяет автоматически выполнять предварительную выборку или предварительную отрисовку ссылок на страницах сразу же, при наведении или наведении курсора мыши.
Бета-версии браузера
Бета-версии браузера дают вам предварительный просмотр того, что будет в следующей стабильной версии браузера. Это прекрасное время для тестирования новых функций или удалений, которые могут повлиять на ваш сайт, прежде чем мир получит эту версию. Новые бета-версии — Firefox 123 , Chrome 122 и Safari 17.4 . Эти выпуски привносят в платформу множество замечательных функций. Ознакомьтесь со всеми подробностями в примечаниях к выпуску. Вот лишь несколько основных моментов.
Бета-версия Firefox 123 включает в себя декларативный теневой DOM .
Также в Firefox 123 поддерживается код состояния информационного ответа HTTP 103 Early Hints
для предварительной загрузки ресурсов , которые могут потребоваться странице, пока сервер подготавливает полный ответ.
В бета-версии Safari 17.4 есть много хорошего. Для CSS есть поддержка @scope
, align-content
в блочных контейнерах и ячейках таблицы, а также псевдоэлементов ::grammar-error
и ::spelling-error
, а также многое другое.
В формах поддержка режима вертикального письма в элементах управления формой, метод showPicker()
для <input type="date">
и поддержка <hr>
внутри <select>
в iOS.
JavaScript также получает некоторые новые функции, среди прочего, благодаря поддержке методов detached()
, transfer()
и transferToFixedLength()
класса ArrayBuffer
.
Бета-версия Chrome 122 включает unsanitized
опцию в методе read()
API Async Clipboard для получения несанкционированного формата HTML. Для JavaScript появились новые помощники итераторов и новые методы для встроенного класса Set
.
Также в Chrome 122 есть API Storage Buckets , целью которого является сделать более предсказуемым постоянное вытеснение хранилища при сильном нехватке памяти.