Перейти до вмісту
Пошук в
  • Детальніше...
Шукати результати, які ...
Шукати результати в ...

Шаблонизаторы SASS LESS


ArtemPitov

Recommended Posts

Доброго времени суток 

 

Возник вопрос по поводу шаблонизаторов СSS, немного почитал о них, синтаксис весьма интересный и простой, кто работал SASS / LESS, на практике он сильно упрощает жизнь  ?

 

ЗЫ // Какие Вы можете посоветовать шаблонизаторы PHP и стоит ли вообще использовать их в быту ?  

Надіслати
Поділитися на інших сайтах

ЗЫ // Какие Вы можете посоветовать шаблонизаторы PHP и стоит ли вообще использовать их в быту ?  

PHP сам по себе язык "шаблонизатор"

Даже не вздумайте использовать что то "другое" тем более смарти

Разного рода шаблонизаторы используют дилетанты в проектировании архитектуры ПО

Надіслати
Поділитися на інших сайтах

Спасибо, я о PHP примерно тоже думал  :-)

Надіслати
Поділитися на інших сайтах

пробовал sass, но на уровне "поиграться". интересная штука, но мне применять пока негде.

пробовал less - не понравился. не такой удобный, как sass, как по мне.

Надіслати
Поділитися на інших сайтах

LESS . Представьте себе вы в в контроллере вместо того чтоб присвоить 1 раз переменную $color = '#000' дублируете ее 100 раз. А Less помогает этого избежать.

SASS. так же включает в себя переменные и еще он упрощает css , основываясь на вложенности

Шаблонизаторы PHP , я кардинально не согласенс выше сказанным мнением. Шаблонизаторы - это удобно, и мне в 100 раз удобней прописать знак = чтоб сделать экранирование, кеширование статитики  и тд..тп....

Змінено користувачем Гість
Надіслати
Поділитися на інших сайтах

Sass и Less - это никаким боком не шаблонизаторы, это CSS препроцессоры и к PHP они никакого отношения не имеют (как и к шаблонам).

 

ЗЫ // Какие Вы можете посоветовать шаблонизаторы PHP и стоит ли вообще использовать их в быту ?  

PHP сам по себе не нуждается в шаблонизаторах, так что смысл их использовать есть только, если вы понимаете зачем они вам нужны. Например, если есть какая-то платформа интернет-магазинов и нужно дать возможность пользователям менять дизайн их магазинов (в том числе структуру шаблонов) при этом не давая возможности выполнять php код - вот тут и пригодятся шаблонизаторы.

Надіслати
Поділитися на інших сайтах


Sass и Less - это никаким боком не шаблонизаторы, это CSS препроцессоры и к PHP они никакого отношения не имеют (как и к шаблонам).

 

PHP сам по себе не нуждается в шаблонизаторах, так что смысл их использовать есть только, если вы понимаете зачем они вам нужны. Например, если есть какая-то платформа интернет-магазинов и нужно дать возможность пользователям менять дизайн их магазинов (в том числе структуру шаблонов) при этом не давая возможности выполнять php код - вот тут и пригодятся шаблонизаторы.

Да Вы правы препроцессоры СSS, но суть вопроса в том нужны ли они в быту или проще сделать дополнительные те же классы с дефолтом для проекта (цвет, размер, и тд. ) и дописывать к элементам по типу как в бутстрпе с блоками, последний  вариант весить меньше будет по идее  

Надіслати
Поділитися на інших сайтах

SASS / LESS,

Smarty

PHP

 

смешались в кучу, кони, люди (с)

 

Любой язык, framework требует изучения и понимания его внутренней структуры

 

Я согласен, что PHP лучший шаблонизатор.

 

а smarty - платформо независим с точки зрения шаблона, а не ядра.

Надіслати
Поділитися на інших сайтах

или проще сделать дополнительные те же классы с дефолтом

 

@color: #4D926F;

#header {
  color: @color;
}
h2 {
  color: @color;
}

Чем плох?

Один раз задал и забыл, и меняешь только в одном месте.

 

И код стилей становится платформо независимым

<?php
$color = '#000';
?>

#header {
  color: <?php echo $color; ?>;
}
h2 {
  color: <?php echo $color; ?>;
}

Зависит от наличия PHP

Надіслати
Поділитися на інших сайтах

я вообще не понимаю зачем эти php шаблонизаторы нужны

1. нужно изучать доп. синтаксис, разный для кажного шаблонизатора

2. скорость работы сайта уменьшается так как появляется еще один слой

3. возможностей по сравнению с php, который сам по себе является шаблонизатором - меньше

и все для чего? Чтобы вместо

<?php echo $foo; ?>

написать

{$foo}

  • +1 1
Надіслати
Поділитися на інших сайтах

Да дошли до вывода, что в PHP шаблонизаторы это не нужная приблуда

 

А вот по поводу "минимизации" сss возникла вот такая мысль, есть смысл делать или нет дефолтные стили, а потом их дописывать нужным элементам ? 

 

.px15{

font-size:15px !important;

}

 

.defBgColor{

...

}

 

.defBorderRadius{

..

}

Надіслати
Поділитися на інших сайтах

я вообще не понимаю зачем эти php шаблонизаторы нужны

1. нужно изучать доп. синтаксис, разный для кажного шаблонизатора

2. скорость работы сайта уменьшается так как появляется еще один слой

3. возможностей по сравнению с php, который сам по себе является шаблонизатором - меньше

и все для чего? Чтобы вместо

<?php echo $foo; ?>

написать

{$foo}

 

 

Потому что можно взять и открыть шаблон, и добавить туда только макрос - а не данные.

 

 

а для шаблонизатора php также нужны еще и живые данные

 

smarty далеко пошел, в том числе и с кешированием. отдельных блоков.

Надіслати
Поділитися на інших сайтах

я вообще не понимаю зачем эти php шаблонизаторы нужны

1. нужно изучать доп. синтаксис, разный для кажного шаблонизатора

2. скорость работы сайта уменьшается так как появляется еще один слой

3. возможностей по сравнению с php, который сам по себе является шаблонизатором - меньше

и все для чего? Чтобы вместо

<?php echo $foo; ?>

написать

{$foo}

Согласен по всем пунктам

Надіслати
Поділитися на інших сайтах

потому что нужно разделять

слой VIEW от модели и контроллера.

ну да верно, это как не как каноны ООП

Надіслати
Поділитися на інших сайтах

потому что нужно разделять

слой VIEW от модели и контроллера.

Шаблонизатор никак не "слой" view

Это костыль

Надіслати
Поділитися на інших сайтах

Ну... про костыли я уже слышал

 

 

Шаблонизатор получает на вход данные

 

И каким способом он это выведет - никого не интересует

 

И именно поэтому - это слой VIEW

Надіслати
Поділитися на інших сайтах

потому что нужно разделять

слой VIEW от модели и контроллера.

 

ну да верно, это как не как каноны ООП

 

 

эмм.. а вы видите связь между ООП и MVC ?

 

https://ru.wikipedia.org/wiki/%D0%9E%D0%B1%D1%8A%D0%B5%D0%BA%D1%82%D0%BD%D0%BE-%D0%BE%D1%80%D0%B8%D0%B5%D0%BD%D1%82%D0%B8%D1%80%D0%BE%D0%B2%D0%B0%D0%BD%D0%BD%D0%BE%D0%B5_%D0%BF%D1%80%D0%BE%D0%B3%D1%80%D0%B0%D0%BC%D0%BC%D0%B8%D1%80%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5

https://ru.wikipedia.org/wiki/Model-View-Controller

Надіслати
Поділитися на інших сайтах

 Объекты обменивающиеся сообщениями и взаимодействующие друг с другом, чем не ООП в MVC ? 

Надіслати
Поділитися на інших сайтах

Кроме того код шаблона не активный и это становится безопасным для редактирования шаблона пользователем.

 

выполнить код в шаблоне - невозможно, в частности, smarty вырежет php код

Надіслати
Поділитися на інших сайтах

кто работал SASS / LESS, на практике он сильно упрощает жизнь  ?

 

 

Работал и работаю.

 

Начинал именно с LESS. Потом возможностей стало мало, перешел на SASS.

 

Но теперь только Stylus.  Ничего лучшего нет.  Превосходит оба предыдущих языка по всем аспектам.

 

Кроме того Stylus на порядок быстрее компилируется чем SASS.  Раз эдак в 10 или 15 быстрее.

Впрочем и сам SCSS можно заставить работать на порядок быстрее если перейти с Java/Ruby на платформу node.js.  Но, к сожалению, SCSS без связки Compass - штука на порядок менее полезная, а Compass на node.js заставить работать нельзя.

 

Вообще, все эти штуки называются препроцессоры. очень и очень они полезны.  Попробовав раз, возвращаться к обычному CSS нет желания.

Змінено користувачем sitecreator
Надіслати
Поділитися на інших сайтах

пробовал sass, но на уровне "поиграться". интересная штука, но мне применять пока негде.

пробовал less - не понравился. не такой удобный, как sass, как по мне.

 

less весьма удобный, я бы даже сказал, что намного удобнее sass.  Всякие миксины вызываются без всяких дополнительных префиксов и ненужных символов.

Но мне не хватило в нем условных операторов.  Впрочем, несколько поизвращавшись и их можно в less сделать, т. к. он позволяет делать вставки кода на Javascript.  Но это извращение.

Надіслати
Поділитися на інших сайтах

Работал и работаю.

 

Начинал именно с LESS. Потом возможностей стало мало, перешел на SASS.

 

Но теперь только Stylus.  Ничего лучшего нет.  Превосходит оба предыдущих языка по всем аспектам.

 

Кроме того Stylus на порядок быстрее компилируется чем SASS.  Раз эдак в 10 или 15 быстрее.

Впрочем и сам SCSS можно заставить работать на порядок быстрее если перейти с Java/Ruby на платформу node.js.  Но, к сожалению, SCSS без связки Compass - штука на порядок менее полезная, а Compass на node.js заставить работать нельзя.

 

Вообще, все эти штуки называются препроцессоры. очень и очень они полезны.  Попробовав раз, возвращаться к обычному CSS нет желания.

Какие преимущества препроцессоров  Вы можете выделить на практике по сравнении писать это все "по старинке"  ? И почувствовать всю мощь как я понимаю можно только на крупных проектах когда работает команда ?  

Надіслати
Поділитися на інших сайтах

Какие преимущества препроцессоров  Вы можете выделить на практике по сравнении писать это все "по старинке"  ? И почувствовать всю мощь как я понимаю можно только на крупных проектах когда работает команда ?  

 

команда тут вообще никаким боком.

 

Почитайте описание хоть одного препроцессора и все сами поймете. попробуйте.

 

Вы программист?

Вы писали когда нибудь на ассемблере?

Вот если потом перейдете на Си++, то сразу почувствуете разницу.

 

Кода становится меньше. Его быстрее писать. Проще изменять.

Не нужно думать о вендорных префиксах и прочей лабуде.

 

пример:

background: -webkit-linear-gradient(top, #fff, #c5c5c5);
background: -moz-linear-gradient(top, #fff, #c5c5c5);
background: -o-linear-gradient(top, #fff, #c5c5c5);
background: -ms-linear-gradient(top, #fff, #c5c5c5);
background: linear-gradient(to bottom, #fff, #c5c5c5);
-pie-background: linear-gradient(to bottom, #fff, #c5c5c5);
behavior: url("/catalog/view/theme/default/stylesheet/PIE.htc");

показанный выше код - это всего навсего линейный градиент, написанный так, что работает на любом браузере, даже на ie, не знающем, что такое линейный градиент.

К тому же здесь учтено, что старые браузеры поддерживают старую спецификацию направления "top", а новые поддерживают новую "to bottom".

Я даже намеренно убрал лишние строчки для самых старых браузеров, иначе код получился бы еще длиннее.

 

Это было бы если я писал бы код на голом CSS.

 

А вот как это выглядит на Stylus:

background: linear-gradient(to bottom, #fff, #c5c5c5);

Т. е. я просто написал валидный код по последней спецификации, а остальное на выходе сгенерирует сам Stylus (см. выше результат).

 

И колоссальное преимущество Stylus в том, что вообще не нужно думать о миксинах или функциях когда дело идет о вендорных префиксах и результате для всех браузеров на свете.  Вы даже можете вообще не знать что такое Stylus, и писать при этом на обычном CSS, но Stylus сам сгенерирует нужный код где надо.  В других препроцессорах вам нужно всегда самостоятельно заботиться о том чтобы вставить в нужное место указание на то, что нужно генерировать вендорные коды.  Причем это нужно делать в каждом месте.  Поэтому мой выбор - Stylus. В нем еще масса других преимуществ.

 

И при необходимости я легко могу поменять цвета всего лишь в одной строчке и без необходимой проверки во всех браузерах (а вдруг я что-то забыл и в одном из браузеров цвет выглядит не так?)

 

Я могу цвет определить с помощью переменной. меняя всего одну переменную, цвет поменяется везде автоматически где нужно.

Змінено користувачем sitecreator
Надіслати
Поділитися на інших сайтах

Створіть аккаунт або увійдіть для коментування

Ви повинні бути користувачем, щоб залишити коментар

Створити обліковий запис

Зареєструйтеся для отримання облікового запису. Це просто!

Зареєструвати аккаунт

Вхід

Уже зареєстровані? Увійдіть тут.

Вхід зараз
  • Зараз на сторінці   0 користувачів

    • Ні користувачів, які переглядиють цю сторінку
×
×
  • Створити...

Important Information

На нашому сайті використовуються файли cookie і відбувається обробка деяких персональних даних користувачів, щоб поліпшити користувальницький інтерфейс. Щоб дізнатися для чого і які персональні дані ми обробляємо перейдіть за посиланням . Якщо Ви натиснете «Я даю згоду», це означає, що Ви розумієте і приймаєте всі умови, зазначені в цьому Повідомленні про конфіденційність.