Откройте для себя некоторые интересные функции, которые появились в стабильных и бета-версиях веб-браузеров в январе 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 , целью которого является сделать более предсказуемым постоянное вытеснение хранилища при сильном нехватке памяти.