Есть ли какой-либо недостаток установки глобального фонового CSS3-перехода на всех элементах?

Question

Я начал играть с переходами CSS3 в одном из моих проектов и обнаружил, что в основном хочу иметь переход на цвет фона для каждого элемента, который меняет его при наведении.

Если я это сделаючто-то вроде

a {
  transition-property: background;
  transition-duration: 0.15s;
  transition-timing-function: ease-out;
  transition-delay: 0;
}

или даже

* {
  transition-property: background;
  transition-duration: 0.15s;
  transition-timing-function: ease-out;
  transition-delay: 0;
}

есть ли недостатки?Поскольку это не повлияет на элементы, которые не меняют цвет фона, единственная проблема, которая приходит мне в голову, заключается в том, что это будет иметь некоторый эффект на браузер.

Может ли использование слишком большого количества переходов вызвать браузербыть медлительным?Или есть какие-то особые случаи, когда я должен отключить переходы все вместе?

Answer 1

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

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

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

Современные браузеры поставляются с аппаратным ускорением для ряда вещей (IE9 + для всего ); В сочетании с современным оборудованием вряд ли можно заметить снижение производительности при переходах, по крайней мере, на настольных компьютерах и ноутбуках. Мобильное оборудование (смартфоны и планшеты) может быть более ограниченным, но если вы работаете с адаптивным дизайном, вы можете легко отключить переходы с помощью переключателей @media.

Это всего лишь два моих цента. Я сам не слишком много играл с переходами, но подытожу: я бы предпочел быть конкретным при применении переходов, но не 1018 * вредно * применять их универсально , если вы знаете, что вы делаешь .

Конечно, вы всегда можете отключить переходы для определенных элементов, создав новое правило с любым выбранным вами селектором и присвоив ему transition-property: none.

Answer 2

Вам нужно отключить все переходы при запуске автоматического теста. Отключение перехода поможет вам, прекратив использовать BrowserDriver.wait () .. И запустится быстрее!