Я создаю сайт, в котором используется прокручиваемый плагин, который в основном оживляет прокрутку. Я очень беспокоюсь о производительности, как если бы я вставлял некоторые изображения на сайт, он выглядит довольно изменчивым при прокрутке/анимации.
Основной проблемой, которую я могу обнаружить с помощью изображений, является проблема reflow/repaint, когда изображение не имеет правильных размеров и поэтому масштабируется (я должен иметь дело с этим, я знаю о наилучшей практике).
С учетом этого утверждения (изображения будут масштабированы). Что должно быть лучше, элемент изображения или divs с этими изображениями в качестве фона для производительности?
Я сделал это jsFiddles, что в моем инструменте памяти браузера Chrome, показывают, что опция фонового изображения использует меньше памяти.
<img/>
: http://jsfiddle.net/ek6Xn/
<img src="..." />
background-image
: http://jsfiddle.net/ek6Xn/1/
<div></div>
div {
background:url(...);
background-size:100% 100%;
}
Рекомендации: