В последнее время часто поднимаются вопросы (и это хорошо и правильно) оптимизации сайтов. Один из пунктов в списке оптимизаций — это реализация ленивой загрузки (она же lazy load) изображений.
Коротко о том, что это и как реализуется:
Для примера рассмотрим вывод на странице простого изображения:
<img class="justImage" src="image.jpg">

Суть ленивой загрузки проста — изначально изображения на страницу выводятся с пустым атрибутом src, а путь прописывается в атрибуте data-src:
<img class="justImage" data-src="image.jpg">

В итоге загрузки картинки не происходит. Все, что остается сделать — это при появлении изображения в области видимости браузера (при прокрутке страницы, например) переместить данные из data-src в src, в результате чего картинка загрузится и отобразится.
В результате браузер при загрузке страницы не грузит сразу же все изображения, на ней присутствующие, а делает это по мере необходимости, то есть страница становится доступной гораздо быстрее. Как минимум, PageSpeed крайне положительно реагирует на это.
Это базовая реализация, можно вместо пустого src выводить размытую картинку с малым весом, или базовый цвет, или прелоадер и т.д.
Накидал на коленке плагин, упрощающий реализацию Lazy load для MODX Revolution. Он ищет img с классом lazy, забирает значение src, перекладывает его в data-src, подключает к странице скрипт yall.js (Yet Another Lazy Loader), исходники и описание скрипта тут: github.com/malchata/yall.js
Скрипт весит всего 2Кб, поэтому я его подключаю не отдельным файлом, а сразу в код страницы. Возможно, это не совсем правильно, если считаете, что правильнее по-другому — напишите в комментах, обсудим =)
То есть все, что требуется после установки плагина — это прописать класс lazy тем img, к которым нужно применить ленивую загрузку:
<img class="justImage lazy" src="image.jpg">

Плагин оформил в виде пакета дополнения MODX Revolution, вчера этот пакет появился в репозитарии MODX, так что можно просто установить пакет lazy load из репозитария и использовать функционал lazy load.
Либо можно добавить плагин вручную, дать ему любое имя и поставить галочку на событии OnWebPagePrerender:
<?php
    if ($modx->event->name == 'OnWebPagePrerender') {
        $content = &$modx->resource->_output;
        preg_match_all('/]+>/i', $content, $images);
        if (count($images)) {
            foreach ($images[0] as $image) {
                preg_match('/(class)=("[^"]*")/i', $image, $classValue);
                $imageClasses = explode(" ", str_replace('"', '', $classValue[2]));
                if (in_array("lazy", $imageClasses)) {
                    $img_real = str_replace(" src=", " data-src=", $image);
                    $content = str_replace($image, $img_real, $content);
                  }
            }
        }
    }

Как обычно, код без бубна вставляться не хочет, поэтому здесь чуть модифицирую код по сравнению с тем, что в пакете репозитария.
Инлайн js код в этом модифицированном плагине отсутствует, поэтому нужно вручную в футере подключить скрипт github.com/malchata/yall.js/blob/master/dist/yall.min.js, предварительно скачав его и добавить строчку инициализации:
<sc ript src="путь_до_файла/yall.min.js"></sc ript>
    <sc ript>document.addEventListener("DOMContentLoaded", yall);</sc ript>

Все равно криво добавляется, пробелы уберите в «sc ript»
Не уверен, что парсер местный еще что-то не съел, поэтому оставлю ссылку на статью, где корректный код выведен: Плагин Lazy load для MODX Revolution
Но, еще раз, плагин доступен в виде пакета lazy load, достаточно просто установить пакет и добавить класс lazy картинкам.