Cacher is the code snippet organizer for pro developers

В этой статье описывается простой способ отложить загрузку изображений без использования JQuery, максимального повышения скорости загрузки страницы. Теперь для Вас не будет являться секретом как разобраться с тяжелыми изображениями, на которые так жестоко ругается гугл при тесте скорости страницы.

Одной из главных причин медленной загрузки, это изображения. Для того что б облегчить страдания браузера воспользуемся не хитрым (но очень клевым) способом от Patrick’a Sexton’a.

Вставим место всем знакомого <img src=”ссылка на картинку”> данный тег:

1 где your-image-here является ссылкой на изображение.

Далее добавим перед закрывающим body () данный скрипт:

1 2 3 4 5 6 7 8 9 В следствии чего загрузка изображений будет происходить после загрузки страницы.

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

ПС. Еще очень хороший пример применения отложенной загрузки Вы можете посмотреть в данном решении.