Какой метод использовать лучше @extend %шаблона или @extend .класса?

Question

[Саша]

Здравствуйте.
Какой метод использовать лучше, удобней, какой занимает меньше времени при компиляции?
@extend %шаблона или @extend .класса ?
Если не ошибаюсь, они работают одинаково.

Спасибо!

Answer 1

[timfcsm]

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

%placeholder {
  font-weight: bold;
}
a%placeholder {
  text-decoration: none;
}
.item {
 @extend %placeholder
}

скомпилится в

.item {
  font-weight: bold;
}
a.item {
  text-decoration: none;
}

a

.placeholder {
  font-weight: bold;
}
a.placeholder {
  text-decoration: none;
}
.item {
 @extend .placeholder
}

скомпилится в

.placeholder, .item {
  font-weight: bold;
}
a.placeholder, a.item {
  text-decoration: none;
}

соответственно если применить это по пять раз, в первом случае сгенерируется 5 блоков правил для разных селекторов, а во втором для одного блока правил добавится куча селекторов, к которым он применяется

Comments

[Саша]

timfcsm в общем оптимальней использовать экстенд класса.
Спасибо!