Опубликовано: 27 мая 2025 г.
Chrome 137 уже выпускается, и в этом посте мы расскажем о некоторых ключевых функциях релиза. Прочитайте полные заметки о выпуске Chrome 137 .
Основные моменты этого выпуска:
Используйте reading-flow и reading-order для обеспечения логического порядка табуляции в сложных макетах. Функция CSS if() обеспечивает лаконичный способ выражения условных значений. JavaScript Promise Integration (JSPI) позволяет приложениям WebAssembly интегрироваться с обещаниями JavaScript.
reading-flow и reading-order CSS
Свойство CSS reading-flow управляет порядком, в котором элементы в макете flex, grid или block подвергаются воздействию инструментов доступности, а также тем, как они фокусируются с помощью линейных последовательных методов навигации. Это решает давнюю проблему с макетами grid и flex, где порядок вкладок может отключаться от порядка, в котором располагаются элементы.
Он принимает одно ключевое значение со значением по умолчанию normal , которое сохраняет поведение упорядочивания элементов в порядке DOM. Чтобы использовать его внутри контейнера flex, установите его значение либо flex-visual , либо flex-flow . Чтобы использовать его внутри контейнера grid, установите его значение либо grid-rows , grid-columns , либо grid-order .
Свойство CSS reading-order позволяет вручную переопределять порядок элементов в контейнере потока чтения. Чтобы использовать это свойство внутри контейнера grid, flex или block, установите значение reading-flow в контейнере на source-order и установите reading-order отдельного элемента на целочисленное значение.
Чтобы узнать больше, прочитайте статью Использование CSS reading-flow для логической последовательной навигации по фокусу .
Функция CSS if()
Функция CSS if() обеспечивает лаконичный способ выражения условных значений. Она принимает ряд пар условие-значение, разделенных точкой с запятой. Функция последовательно оценивает каждое условие и возвращает значение, связанное с первым истинным условием. Если ни одно из условий не оценивается как истинное, функция возвращает пустой поток токенов.
div {
color: var(--color);
background-color: if(style(--color: white): black; else: white);
}
.dark {
--color: black;
}
.light {
--color: white;
}
<div class="dark">dark</div>
<div class="light">light</div>
Интеграция обещаний JavaScript WebAssembly (JSPI)
JavaScript Promise Integration (JSPI) — это API, который позволяет приложениям WebAssembly интегрироваться с обещаниями JavaScript.
Он позволяет программе WebAssembly выступать в качестве генератора обещаний и позволяет программе WebAssembly взаимодействовать с API, содержащими обещания.
В частности, когда приложение использует JSPI для вызова API, содержащего обещание (JavaScript), код WebAssembly приостанавливается, а исходному вызывающему объекту программы WebAssembly дается обещание, которое будет выполнено, когда программа WebAssembly окончательно завершится.
И многое другое!
Конечно, есть еще много чего:
- В качестве продолжения разбиения хранилища Chrome реализовал разбиение доступа к URL-адресам BLOB-объектов по ключу хранилища.
- Теперь реализованы форматы пикселей с плавающей точкой Canvas.
- Поддерживается
offset-path: shape()поэтому вы можете использовать адаптивные фигуры для задания пути анимации.
Дальнейшее чтение
Это охватывает только некоторые ключевые моменты. Проверьте следующие ссылки для дополнительных изменений в Chrome 137.
- Заметки о выпуске Chrome 137 .
- Что нового в Chrome DevTools (137) .
- Обновления ChromeStatus.com для Chrome 137 .
- Календарь релизов Chrome .
Подписаться
Чтобы оставаться в курсе событий, подпишитесь на канал Chrome Developers на YouTube , и вы будете получать уведомления по электронной почте каждый раз, когда мы запускаем новое видео. Или следите за нами на X или LinkedIn для получения новых статей и сообщений в блоге.
Как только выйдет Chrome 138, мы сразу же расскажем вам, что нового в Chrome!
,
Опубликовано: 27 мая 2025 г.
Chrome 137 уже выпускается, и в этом посте мы расскажем о некоторых ключевых функциях релиза. Прочитайте полные заметки о выпуске Chrome 137 .
Основные моменты этого выпуска:
Используйте reading-flow и reading-order для обеспечения логического порядка табуляции в сложных макетах. Функция CSS if() обеспечивает лаконичный способ выражения условных значений. JavaScript Promise Integration (JSPI) позволяет приложениям WebAssembly интегрироваться с обещаниями JavaScript.
reading-flow и reading-order CSS
Свойство CSS reading-flow управляет порядком, в котором элементы в макете flex, grid или block подвергаются воздействию инструментов доступности, а также тем, как они фокусируются с помощью линейных последовательных методов навигации. Это решает давнюю проблему с макетами grid и flex, где порядок вкладок может отключаться от порядка, в котором располагаются элементы.
Он принимает одно ключевое значение со значением по умолчанию normal , которое сохраняет поведение упорядочивания элементов в порядке DOM. Чтобы использовать его внутри контейнера flex, установите его значение либо flex-visual , либо flex-flow . Чтобы использовать его внутри контейнера grid, установите его значение либо grid-rows , grid-columns , либо grid-order .
Свойство CSS reading-order позволяет вручную переопределять порядок элементов в контейнере потока чтения. Чтобы использовать это свойство внутри контейнера grid, flex или block, установите значение reading-flow в контейнере на source-order и установите reading-order отдельного элемента на целочисленное значение.
Чтобы узнать больше, прочитайте статью Использование CSS reading-flow для логической последовательной навигации по фокусу .
Функция CSS if()
Функция CSS if() обеспечивает лаконичный способ выражения условных значений. Она принимает ряд пар условие-значение, разделенных точкой с запятой. Функция последовательно оценивает каждое условие и возвращает значение, связанное с первым истинным условием. Если ни одно из условий не оценивается как истинное, функция возвращает пустой поток токенов.
div {
color: var(--color);
background-color: if(style(--color: white): black; else: white);
}
.dark {
--color: black;
}
.light {
--color: white;
}
<div class="dark">dark</div>
<div class="light">light</div>
Интеграция обещаний JavaScript WebAssembly (JSPI)
JavaScript Promise Integration (JSPI) — это API, который позволяет приложениям WebAssembly интегрироваться с обещаниями JavaScript.
Он позволяет программе WebAssembly выступать в качестве генератора обещаний и позволяет программе WebAssembly взаимодействовать с API, содержащими обещания.
В частности, когда приложение использует JSPI для вызова API, содержащего обещание (JavaScript), код WebAssembly приостанавливается, а исходному вызывающему объекту программы WebAssembly дается обещание, которое будет выполнено, когда программа WebAssembly окончательно завершится.
И многое другое!
Конечно, есть еще много чего:
- В качестве продолжения разбиения хранилища Chrome реализовал разбиение доступа к URL-адресам BLOB-объектов по ключу хранилища.
- Теперь реализованы форматы пикселей с плавающей точкой Canvas.
- Поддерживается
offset-path: shape()поэтому вы можете использовать адаптивные фигуры для задания пути анимации.
Дальнейшее чтение
Это охватывает только некоторые ключевые моменты. Проверьте следующие ссылки для дополнительных изменений в Chrome 137.
- Заметки о выпуске Chrome 137 .
- Что нового в Chrome DevTools (137) .
- Обновления ChromeStatus.com для Chrome 137 .
- Календарь релизов Chrome .
Подписаться
Чтобы оставаться в курсе событий, подпишитесь на канал Chrome Developers на YouTube , и вы будете получать уведомления по электронной почте каждый раз, когда мы запускаем новое видео. Или следите за нами на X или LinkedIn для получения новых статей и сообщений в блоге.
Как только выйдет Chrome 138, мы сразу же расскажем вам, что нового в Chrome!