Как сделать правильную под-загрузку изображений на сайте?
Доброго вечера Тостеровцы.
Столкнулся с заморочкой при верстке очередного дизайна.
Дело в том что первый див на сайте, он имеет свойства width: 100% & height: 100vh;
И подгружает в себя картинку разрешением 1920х1080 кубиков маинкрафта.
Картинка весом в 500 кб, и на моем сравнительно быстром интернете, при заходе на сайт, подгружается рывками.
Не представляю что будет на мобильном гаджете или интернете с маленькой скоростью...
Прорисовывается воспоминание в моей голове.
Как то раз, на каком- то ресурсе видел, как такая же, почти, картинка загрузилась в меньшем разрешении,
Т.е были видны пиксели, и в течении секунды пиксели нормализовались в то, что и должно быть.
Имею желание катастрофическое, иметь у себя на сайте такой же эффект.
Подскажите пожалуйста, Тостеровцы, как реализовать подобное и сделать свою жизнь лучше?
Спасибо.
PS. Пойду пока покушаю, проголодался....
Алексей Николаев: Да, что то изменилось, эффект описанный мной, вроде появился. Только вот загрузка рывками так и осталась, хотя загрузилось изображение гораздо быстрее.
Alex Lapikov если я верно вас понял, то так и должно быть, т.к. клиент в этот момент загружает не только эту картинку, но и многие другие ресурсы, которые у вас используются (на один браузер ограничение до 10 одновременно загружаемых ресурсов, не скажу точно но вроде как 6-8).
Простой
Средний
