Какой рейтинг вас больше интересует?
|
Главная / Главные темы / Тэг «препроцессоры»
Почему стоит использовать препроцессоры 2014-02-28 00:13:00
... , нежели использовать препроцессоры. Мы долго ... почему стоит использовать препроцессоры.
Читать ...
+ развернуть текст сохранённая копия
У меня достаточно неплохой опыт в верстке — несколько лет.
За это время было многое — и табличная верстка, и собственные фреймворки, и IE6, и адаптивный дизайн, да что угодно — я всегда старался быть рядом с bleeding edge, как говорится.
Больше CSS-фреймворков (привет, бутстрап) и Emmet-а мне нравятся препроцессоры и я расскажу, почему. Возможно, покажется, что моя статья несколько устарела и сейчас все используют препроцессоры как само собой разумеющееся, но, увы, это не так. Недавно я встретил человека, который говорил о том, что ему быстрее писать CSS-код, нежели использовать препроцессоры. Мы долго спорили, на самом деле, ну очень долго, в итоге я решил выложить свои мысли здесь, в одном месте.
Less или Sass?
Ну, на самом деле, это дело каждого. Мне не нравился Sass из-за его медлительности — Less побыстрее выполнялся всегда, в итоге в один момент я решил перейти на Less, но через некоторое время оказалось, что мне не хватает его мощности! Увы, я так и не нашел, как реализовать банальный миксин уровня вот этого.
Но и медлительность Sass не устраивала, но именно в тот момент, когда я хотел обратно вернуться на Sass, но терзался сомнениями, мне посоветовали libsass, а т.к. я использую Grunt — мне было достаточно подключить только grunt-sass (и ничего больше, например, установка Ruby и гемов). Для меня выбор был ясен и с тех пор — только libsass. Мощность самого Sass и с скорость C — что еще нужно?
Stylus я пока не пробовал, как-нибудь потом.
Почему все-таки препроцессоры?
Я не скажу ничего нового, скорее всего, но я хочу показать, почему стоит использовать препроцессоры.
Читать дальше →
Тэги: css, less, sass, веб-разработка, препроцессоры
[Из песочницы] О переменных в CSS и абстракциях в веб-программировании 2013-12-22 18:15:33
Предлагаю вашему вниманию перевод статьи из блога популяризатора веб-технологий Криса Койера ...
+ развернуть текст сохранённая копия
Предлагаю вашему вниманию перевод статьи из блога популяризатора веб-технологий Криса Койера About Variables in CSS and Abstractions in Web Languages. В статье автор поднимает вопрос о том, действительно ли CSS нуждается в дополнениях, которые делают его сложнее для восприятия, а порог вхождения — выше, когда у разработчиков уже сегодня есть возможность подняться одним уровнем абстракции вверх.
Переменные приходят в CSS. Уже сегодня есть конкретные реализации, так что их теперь не остановить. В Firefox они появились в версии 29, а в Chrome их можно использовать без префиксов в версиях 29 и старше, если у вас в настройках включён флаг Enable experimental Web Platform features (в русской локали «Включить экспериментальные функции веб-платформы» — прим. перев.).
Скажу сразу, можно сколько угодно спорить о том, хорошо это или плохо, но изменить уже ничего нельзя. Однако, так как мне всё же хочется обсудить эту тему, я продолжу. Читать дальше →
Тэги: css, haml, sass, абстракция, веб-разработка, давно, препроцессоры, теги, читают
Prepros: open-source компилятор файлов для front-end разработки 2013-08-04 17:58:19
...
+ развернуть текст сохранённая копия
Здравствуйте, уважаемые Хабражители.
Данная статья посвящена фантастическому, на мой взгляд, open-source приложению Prepros, которое может облегчить рабочий процесс многим фронт-энд разработчикам.
Prepros умеет компилировать файлы LESS, Sass, SCSS, Stylus, Jade, Slim, Coffeescript, LiveScript, Haml и Markdown, минифицировать и объединять в один JavaScript-файлы и это еще не все.
Под катом — более подробный обзор приложения.
Читать дальше →
Тэги: coffeescript, css, haml, html, jade, javascript, less, livereload, livescript, markdown, open, sass, scss, slim, source, stylus, web, web-разработка, веб-разработка, препроцессор
Автопрефиксер — окончательное решение проблемы префиксов в CSS 2013-04-16 19:35:06
... />
Понятно, что языки препроцессоров не позволяют решить ...
+ развернуть текст сохранённая копия
Автопрефиксер — утилита нового поколения для добавления префиксов к экспериментальным свойствам из CSS 3. Она берёт с Can I Use последние данные о префиксах и популярности браузеров, читает ваш файл стилей, находит свойства и значения, которым действительно нужны префиксы и добавляет их.
Вы просто пишите обычный CSS:
a {
transition: transform 1s
}
Автопрефиксер сам заменит нужные (и только нужные) свойства и значения (обратите внимание на -webkit-transform ):
a {
-webkit-transition: -webkit-transform 1s;
-ms-transition: -ms-transform 1s;
-o-transition: -o-transform 1s;
-webkit-transition: transform 1s;
-o-transition: transform 1s;
transition: transform 1s
}
Эта утилита работает во время выкладки сайта на сервера (и на машине программиста во время разработки), так что не заметна для клиентов и не требует какой-то поддержки от браузеров.
Проблема
К сожалению текущие инструменты плохо решают задачу:
- Писать вереницы свойств руками — очевидно плохое решение. Такой код невозможно читать, легко забыть поправить остальные свойства при редактировании.
- В Sass и LESS вам нужно самому следить за актуальностью префиксов и копировать примеси из проекта в проект. К тому же примеси могут решить проблему только у свойств, а не у значений (например,
calc() ).
- Compass или Bourbon уже лучше, там список примесей хранится централизовано и его легче держать актуальным (но практика показывает, что обычно в примеси добавляют все префиксы не следя за актуальностью). Проблема значений всё так же не решена.
- Самая главная проблема Sass и LESS, что вам всё равно нужно постоянно думать «из CSS 3 это свойство или нет?» — и в зависимости от этого использовать примесь или нет. Эту проблему немного решил Stylus — у него синтаксис примесей не отличается от обычных свойств, так что префиксы добавляются невидимо. Впрочем, проблема актуальности и значений всё равно остались.
- Есть ещё скрипты добавления префиксов прямо в браузере, например Prefix Free, но лучше всего обрабатывать стили на этапе разработки и выкладки, а не повторять обработку каждый раз в браузере клиентов.
Понятно, что языки препроцессоров не позволяют решить проблему полностью, нужен был фундаментально новый инструмент.
Читать дальше →
Тэги: <, css, martians>>, блог, веб-разработка, компания, препроцессор, префикс
Дайджест интересных новостей и материалов из мира айти за последнюю неделю №52 (6 — 12 апреля 2013) 2013-04-12 23:47:55
Предлагаем вашему вниманию очередную подборку с ссылками на новости, интересные материалы и полезные ...
+ развернуть текст сохранённая копия
Предлагаем вашему вниманию очередную подборку с ссылками на новости, интересные материалы и полезные ресурсы.
Кстати, сегодня исполняется ровно год с момента поста нашего первого дайджеста на Хабре. Вам спасибо, что до сих пор нас читате, нам спасибо, что все еще продолжаем это дело :)
Читать дальше →
Тэги: blink, css, css3, github, glass, google, group, html, html5, jquery, parallax, yandex, zfort, блог, браузеры, веб-дизайн, веб-разработка, дайджест, интересный, компания, новость, препроцессор, ресурс, сми, ссылка
Главная / Главные темы / Тэг «препроцессоры»
|
Взлеты Топ 5
Падения Топ 5
|