n-wp.ru — блог о WordPress
Как сделать постепенное отображение изображений | jQuery lazy load plugin | n-wp.ru

Как сделать постепенное отображение изображений | jQuery lazy load plugin

Блоги с обилием графики, множеством больших картинок грузятся долго — пока все изображения подгрузятся…. Частично можно решить проблему с загрузкой изображений с помощью правильно настроенного браузерного кэширования. Например, плагин W3 Total Cache имеет в настройках такое кэширование. Можно настроить браузерное кэширование изображений и самостоятельно, без дополнительных плагинов. В этом случае браузер будет закачивать изображения из блога к себе в кэш один раз. При последующих обращениях к этому изображению он будет его подгружать не с сайта, а из своего кэша. Таким образом можно уменьшить нагрузку на сервер и увеличить скорость загрузки страниц блога, ведь загрузить изображение из кэша, который хранится на компьютере, всегда легче, нежели чем тянуть изображение каждый раз заново из интернета. Сейчас стала распространенной и другая технология, позволяющая увеличить скорость загрузки страниц — так называемая ленивая загрузка.

Как сделать постепенное отображение изображений | jQuery lazy load plugin

Ленивой загрузка названа потому, что изображения загружаются на странице не все сразу, а только по мере необходимости. Если вы смотрите верхнюю часть страницы, то изображения, расположенные на нижней, невидимой части страницы, не загружаются. Действительно, зачем они вам нужны, если вы их не видите? Они будут подгружаться по мере их отображения на странице.

В итоге время загрузки страницы резко сокращается. Я использую ленивую загрузку на сайте tiaurus.info — на нем просто море больших картинок, и такая загрузка спасает от лишней нагрузки, существенно сокращая время на загрузку страницы (а на некоторых страницах расположены сотни изображений).

Чтобы добавить ленивую загрузку, можно воспользоваться плагином jQuery lazy load plugin. Он работает в полностью автоматическом режиме.

Скачать
jQuery lazy load plugin
вы перейдете по ссылке http://wordpress.org/extend/plugins/jquery-image-lazy-loading/

tiaurus

Являюсь создателем n-wp.ru — блога о WordPress для новичков. Мне интересно многое, поэтому еще я сделал 123-box.ru — блог о программах для Windows, и tiaurus.info — блог о красоте.

8 комментариев

  • С изображений на JS) Тоже не стоит обильно пичкать JS. Вижу, что поставили на этот блог. А как же кеширование в браузере?! Вот я перешел из этой страницы на другую, потом по ссылке опять вернулся и снова изображения загружаются по новой.. или я ошибаюсь?

    • jQuery lazy load plugin не влияет на кэширование, только на отображение картинок на странице. При браузерном кэшировании если картинка загружается впервые, то она берется с сайта, если повторно — то из кэша браузера.

  • Уже не пригоден. В WP 3.0.4 не удалось завести. А отдельно эффект не работает в FireFox и Seamonkey, однако отработал точно в IE8

  • Можно как то настроить, чтобы ленивой загрузкой загружался только контент, а сайдбар бы нормально грузился?

    вроде настраивать надо в файле jq_img_lazy_load.php

    но что точно прописать не знаю

  • Все оказалось просто, чтоб в сайдбаре картикни грузились без этого эффекта меняем

    на

/* ]]> */