Существует такой скрипт, который определяет поддерживает ли браузер определенное свойство и добавляет префиксы?

Question

[eugene_d_dev]

Допустим, есть спорное css-свойство transform. Просто уж очень много мест где всплывает это свойство. Суть в быстродействии. Зачем пользователям с современными браузерами ненужные префиксы, если подойдет просто название "transform". Вот скрипт должен проверять поддерживает ли браузер определенное css свойство, если нет - то добавляет нужный префикс. Если да - то ничего не добавляет))) Где-то видел этот скрипт. Может кто знает))) Именно в самом коде javascript, а не css. Чтобы не было лишних вопросов, что делает скрипт. Он проверяет один раз поддерживает ли браузер transform и в случае не поддержки добавляет нужный префикс всем transform в JAVASCRIPT файле. Именно в js. Не css. Классы менять нету возможности, если кто-нибудь захочет подсказать "лучший вариант". Значение вычисляется.

Comments

[Дмитрий Кравченко]

Надеюсь, что такой библиотеки никогда не напишут.
> Зачем пользователям с современными браузерами ненужные префиксы
А зачем всем пользователям ненужный js код?

[eugene_d_dev]

Дмитрий Кравченко: Ненужный js код? Какая еще библиотека?))) Там несколько строк кода. Сперва проверка поддержки, допустим, transform. Далее либо добавляет префиксы, либо нет.

[Дмитрий Кравченко]

fajjet: куда добавляет?
пишет в node.style? нужно пройтись по всем нодам в документе и изменить их, потом мониторить изменение исходных стилей при ховерах, или других изменениях в DOM
может лишний css динамически в head пропишет?
тогда это похоже на парсинг всего css на js, вместо браузера на c++ или чем они там оперируют, а это может быть и полмегабайта текста

Лишний процент веса стилей меняется на жуткий геморрой разработчика

Answer 1

[Сергей Протько]

А теперь подумайте о тех бедалагах, которые помимо того что пользуются ущербными браузерами, так им еще приходится процесить CSS на каждый запрос к вашему сайту. И ради чего? ради того что бы пользователи нормальных браузеров могли сэкономить пол килобайта. gzip устраняет кучу дублирования в css, а разница в плане времени разбора css незначительна.

Так что берем в руки autoprefixer и делаем прекомпиляцию на сервере, + сервим в gzip + кеширование.

--- updated ---
Сори, попутал с transform в css файликах.

Для js ничего предложить не могу, только такое:
www.kirupa.com/html5/vendor_prefixes_javascript.htm

Comments

[eugene_d_dev]

Внимательнее читаем вопросик)) Именно в js.

[Сергей Протько]

fajjet: внимательно читаем ответ. В этом нет смысла, вы экономите пол килобайта CSS и при этом заставляете бедалаг грузить модернизер или еще чего + препроцессор или же тот самый prefix-free. Не говоря уж о том что разбор CSS будет усложнен отдельной жирной обработкой CSS.

Короче говоря - бросте дурное, от этой затеи плохо и вам и пользователям.

[eugene_d_dev]

Сергей Протько: Да не css это)))) Префиксы в javascript.)) Никакой огромной библиотеки там нет. Одна проверка браузера на поддержку свойства транфсорм. Если не поддерживает добавляет всем трансформам в скрипте нужный префикс))

[Сергей Протько]

fajjet: а, в js... сори, смутило transform.

Answer 2

[Кирилл]

1. https://github.com/postcss/postcss, в его состав входит autoprefier, это именно то, что вам нужно.
   
2. Так же можно использовать библиотеку modernizr.com, она определяет возможности браузера и добавляет определенный класс к тегу html. Если браузер не поддерживает transform, то добавится класс "no-transform" и уже в обычном css можно будет написать фоллбэк.
   

Comments

[eugene_d_dev]

Редактировал вопрос, именно в js))

Answer 3

[trueClearThinker]

Почему вы думаете, что скрипт отработает быстрее, чем будет обработан CSS?

Comments

[eugene_d_dev]

Друг, я редактировал вопрос. Читай концовку)))

Answer 4

[Mikhail Osher]

Абсолютный бред.
Единственное нормальное решение - писать css (бонус за препроцессоры) + autoprefixer.