Префикс -webkit- доминирует в CSS настолько, что некоторые сайты без него работают неправильно. Это свидетельствует о следовании разработчиков не самым лучшим практикам в последние годы и это привело к неудачному, но практически вынужденному решению со стороны Mozilla. В Firefox версии 46 или 47 (это апрель или май 2016 года), Mozilla планирует реализовать поддержку нестандартных префиксов -webkit-, чтобы улучшить совместимость Firefox с сайтами, активно использующими -webkit (как правило, это сайты, ориентированные на мобильные устройства).

Это не новая идея, Microsoft Edge уже поддерживает ряд префиксов ‘-webkit-‘ ради совместимости. Opera реализовывала эти префиксы в 2012, а затем перешла на основанный на WebKit движок Blink.

W3C и производители браузеров не планировали использование вендорных префиксов на рабочих сайтах:

“Официальная политика W3C состоит в том, чтобы не использовать экспериментальные свойства в продакшене, но люди все равно это делают, так как хотят, чтобы сайты выглядели круче и были на пике техники” — W3C об оптимизации контента для разных браузеров

Тем не менее, разработчики применяют префиксы, чтобы использовать новейшие возможности браузеров максимально быстро. Префиксы вызвали беспорядок с доминированием WebKit, но они же заставили веб двигаться вперед ускоренными темпами.

Подход Mozilla и Microsoft безопасен для большинства сайтов. На многих сайтах будет использоваться префикс -moz- или же не потребуется никаких действий для совместимости с будущим обновлением Firefox. Но как профессиональные веб-разработчики, мы должны тщательно рассмотреть и понять, какие последствия это повлечет. Вы наверняка знаете, какие из ваших сайтов могут пострадать от этого обновления.

Итак, пришло время переосмыслить подход к префиксам и протестировать сайты с ними.

Поддерживаемые префиксы

Есть целый ряд префиксов -webkit-, которые Mozilla может реализовать. Исходя тех данных, что я собрал, Mozilla не стремится к совпадению своего списка поддерживаемых префиксных свойств со списком Edge, так как не все из них нужны для совместимости движка раскладки.

Судя по wiki-странице по совместимости, Mozilla собирается реализовать следующее:

  • -webkit-flexbox
  • -webkit- prefixed gradients
  • -webkit-transforms
  • -webkit-transitions
  • -webkit-appearance
  • -webkit-background-clip
  • -webkit-device-pixel-ratio
  • -webkit-animation
  • -webkit-border*

Также в список могут попасть и другие свойства, например, @-webkit-keyframes.

Кросс-браузерное тестирование будет иметь решающее значение

Если вы из тех веб-разработчиков, которые не используют префикс -moz-, чтобы избежать тестирования новейших возможностей CSS в Firefox, представьте что у вас дедлайн, клиент дергает вас за руку и вы тестируете свой сайт в Firefox 46 или 47. Эти версии выйдут уже в апреле-мае, поэтому у нас еще есть время, чтобы планировать заранее.

Чтобы протестировать сайт в этих условиях уже сейчас, вы можете использовать ночную сборку Firefox, с флагом layout.css.prefixes.webkit заданным в конфигурации (about:config) в значение true — это уже сделано по умолчанию. Не все префиксы -webkit- добавлены, но основные моменты протестировать можно. Я хотел бы подождать до марта, прежде чем тестировать ночные сборки Firefox более тщательно.

Еще одно важное замечание: Microsoft Edge уже интерпретирует и отображает префиксы -webkit- таким образом. Это значит, что специфические стили WebKit, добавленные вами на сайт, уже работают в тех браузерах, от которых вы этого не ожидаете. Если вы еще не проверяли это, запустите Microsoft Edge на Windows 10 и убедитесь сами.

Вендорные префиксы уходят в прошлое

К счастью, все идет к тому, что вендорные префиксы уйдут, а команды разработчиков браузеров будут искать лучшие решения. Разработчики Chrome/Blink скорректировали свой подход:

“Продвигаясь вперед, мы вместо использования вендорных префиксов для новых свойств, будем поддерживать беспрефиксный вариант, но под специальным конфигурационным флагом enable experimental web platform features в about:flags пока это свойство не будет готовым к использованию по умолчанию” — команда разработчиков Chrome/Blink

Разработчики Firefox также близки к аналогичному подходу:

Текущий тренд в Mozilla это избегание вендорных префиксов за счет отключения не готовых свойств и использовании непрефиксной версии при достаточной стабильности. Это общая политика: в отдельных случаях возможны исключения — Борис из Mozilla

Microsoft Edge также собирается отказаться от вендорных префиксов:

“Microsoft также собирается отказаться от вендорных префиксов в Edge. Это значит, что разработчики, которые стремятся использовать специфичные возможности HTML и CSS не будут использовать специфичный префикс для Edge. Вместо этого они будут просто писать код в соответствии со стандартами” — Mashable

Постепенной деградации, основанной на префиксах больше не будет

Этот уход от вендорных префиксов означает одну вещь — постепенная деградация с помощью вендорных префиксов не имеет перспектив.

Использование вендорных префиксов для применения стилей для конкретного браузера (например, только для Chrome) не являлось целью их введения; рекомендацией для разработчиков всегда было использование всех префиксов (от -webkit- до -o-). Если вы используете возможности, которые зависят от префиксных свойств и используете префиксы для постепенной деградации вашего дизайна в других браузерах, то это больше не работает.

Заключение

Времена меняются. Доминирование WebKit невольно повлекло проблемы с несовместимостью, что заставляет производителей остальных браузеров реализовывать префиксы -webkit-. Эта проблема исчерпает себя по мере отказа производителей браузеров от вендорных префиксов, но пока разработчики должны проверять, что префиксы не вызовут неожиданных результатов в не-WebKit браузерах.

Полезные ссылки