Проект Interop, объединяющий усилия Google, Apple, Microsoft, Mozilla и других компаний, продолжает менять ландшафт веб-разработки. Благодаря совместной работе над приоритетными задачами, новые возможности CSS внедряются во все популярные браузеры в течение года. Ярким примером успеха стал Subgrid, который после включения в программу 2023 года быстро обрел повсеместную поддержку.
Сейчас начинается планирование Interop 2027, и сообщество активно голосует за наиболее востребованные функции. Среди них выделяется концепция CSS-функций. Подобно JavaScript, разработчики смогут определять собственные функции через @function, что позволит оптимизировать код и упростить сложные вычисления, например, конвертацию полярных координат в декартовы.
Новые формы элементов
Интересные изменения ожидаются в работе с геометрией элементов. Свойство corner-shape предлагает альтернативу привычному border-radius, позволяя создавать более сложные углы: squircle (суперэллипсы, популярные в дизайне Apple), bevel, notch и scoop. В отличие от использования clip-path, это свойство модифицирует сам border-box, благодаря чему границы, контуры и тени корректно повторяют заданную форму.
Еще более гибкий инструмент — border-shape. Он позволяет самостоятельно рисовать границы с помощью прямых линий, дуг и кривых Безье. Основные преимущества этой технологии:
- Полный контроль над формой элемента.
- Корректное отображение рамок и теней, следующих за контуром.
- Возможность плавной анимации между различными формами границ.
Хотя некоторые из этих функций пока доступны только в Chromium-браузерах, включение их в Interop 2027 значительно повысит шансы на их скорое появление в Firefox и Safari. Использование этих возможностей уже сегодня может стать отличным примером прогрессивного улучшения интерфейсов.
Источник: joshwcomeau.com