Thumb3x: Современная обработка изображений для MODX 3



Thumb3x — это мощный и гибкий компонент для обработки изображений, созданный эксклюзивно для MODX 3.

Этот компонент был написан, чтобы заполнить пробел в экосистеме MODX 3, где практически отсутствуют современные и надежные инструменты для работы с изображениями.

Основные возможности
  • В основе лежит высокопроизводительная библиотека Glide 3.0.1, обеспечивающая создание изображений «на лету». Поддерживает современные форматы изображений.
  • Поддержка Источников файлов позволяет работать с изображениями из любого места. Все ключевые параметры (драйвер обработки, права доступа) вынесены в системные настройки.
  • Поддержка не только нарезки и изменения размера, но и наложения фильтров, эффектов и водяных знаков через простые параметры в сниппете.
  • Компонент ведет учет всех сгенерированных файлов в базе данных, что дает основу для аналитики и позволяет управлять кэшем через удобную таблицу в админке.

Документация тут: https://docs.ivan345.com/books/thumb3x/page/thumb3x-dokumentaciia

Компонент в modstore: https://modstore.pro/packages/photos-and-files/thumb3x

Компонент в extras.modx.com: https://extras.modx.com/package/thumb3x
Ivan K.
Ivan K.
12 июля 2025, 21:26
modx.pro
4 466

Комментарии: 51

Николай Савин
13 июля 2025, 11:44
Основана на лучшей из существующих PHP библиотек (насколько я знаю) Intervention Image — за это прям мое почтение. Почти наверняка будут вопросы — а почему бы не использовать уже встроенную в MODX либу phpthumb, зачем на ровном месте тащить что-то другое. Таков современный мир — микросервисы решают.
    Николай Савин
    13 июля 2025, 11:45
    Может и для двоечки устроим праздник?
      Ivan K.
      13 июля 2025, 13:21
      Я готов и для MODX2 написать подобный компонент. Если этот комментарий наберет 15 плюсиков))
        Николай Савин
        14 июля 2025, 17:32
        К утру ждем компонент для двоечки
          Ivan K.
          15 июля 2025, 12:22
          Через несколько дней будет готов компонент и для второй ветки MODX. Glide тоже будет версии 2.
          так как Glide 3.0 требует минимум php 8.1, а у второй версии минималка 7.2
            Raimei
            15 июля 2025, 19:24
            Просто шикарно. Очень ждём!
              Ivan K.
              16 июля 2025, 20:46
              Компонент для MODX2 готов и загружен в репозитории, жду модерации
        Николай Савин
        13 июля 2025, 11:46
        Иван, а чего не пользуешься докой сообщества? Принципиально у себя размещаешь?
          Ivan K.
          13 июля 2025, 12:55
          Из-за лени )) Мне удобней у себя размещать.
          Василий Наумкин
          13 июля 2025, 19:59
          league/glide — отличная штука, использую с самого начала Vesp, уже несколько лет.

          Но на высоконагруженных проектах столкнулся с проблемой, что когда юзер создаёт новый коммент с картинкой, а другие видят это через вебсокеты, то сразу генерируют сотни запросов на конвертацию. Так как нет никакого механизма ограничения конкурентных запросов при холодном кэше, мы получим или кучу 500-х ошибок, или подвисший сервер.

          Решаю это добавлением Varnish для запросов на картинки — он пропускает только 1 запрос на конвертацию, а всем остальным в очереди раздаёт уже результат из кэша.
            Андрей
            15 июля 2025, 22:18
            Здравствуйте. Спасибо большое за компонент.
            Подскажите, планируется ли реализация поддержки pdf-файлов, чтобы было возможно создавать их миниатюры?
              Николай Савин
              17 июля 2025, 22:20
              Так миниатюры создает не компонент, а подключенная библиотека Glide 3.0.1 — Она либо поддерживает работу с PDF, либо нет (я не смотрел)
              Соответственно автор может только своевременно обновлять либу, и никак не в силах предсказывать ее дальнейшее развитие
              Павлик Мышкин
              16 июля 2025, 16:16
              Обнаружил что сниппет пустой
              Папка core вынесена за пределы публичной части. Компонент создал в публичной части пустые файлы:
              core/components/thumb3x/elements/snippets/snippet.thumb3x.php
              core/components/thumb3x/elements/chunks/iskWafCaptchaFormTpl.tpl
                Ivan K.
                16 июля 2025, 17:21
                Посмотрю
                  Ivan K.
                  16 июля 2025, 17:41
                  Загрузил новую исправленную версию в репозитории,
                    Дима Касаткин
                    17 июля 2025, 01:04
                    А разве MODX3 поддерживает официально вынос core за пределы сайта? Вроде этот функционал задепрекейтили
                      Ivan K.
                      17 июля 2025, 08:12
                      Я не тестировал работу компонента если core вынесена за пределы публичной части.
                      Николай Савин
                      17 июля 2025, 22:21
                      Вынос каталога core за пределы публичной части в MODX3 запрещен, из за особенностей работы Composer
                        Павлик Мышкин
                        18 июля 2025, 15:02
                        Пардоньте за оффтоп, у меня сайт продолжал работать с некоторыми компонентами и не ругался ни на что, логи сайта пустые. Получается недостаточно хорошо запретили, типа «Нельзя, но если очень хочется, то можно.»
                          Николай Савин
                          18 июля 2025, 17:26
                          Ну наверное внутри не было компонентов с использованием автозагрузки, это вполне возможно.
                          Тогда PHP внутри пофиг откуда загружать код.
                      Stepan
                      28 сентября 2025, 02:50
                      А куда кешируется все это дело и как очистить кеш?
                        Ivan K.
                        28 сентября 2025, 11:15
                        Пакеты->Thumb3x кнопка «Очистить кэш»
                        Александр
                        29 сентября 2025, 12:07
                        А как грузить TV?
                          Ivan K.
                          01 октября 2025, 16:41
                          Например, так:
                          <img src="[[!Thumb3x?
                              &sourceId=`2`
                              &input=`[[*TV_proba]]` 
                              &options=`w=520&h=520`
                          
                              &quality=`80`
                              &format=`webp`
                          
                          ]]">
                          Параметр: &sourceId=`2` — id источника файлов, которое использует ваш TV

                          Очень рекомендую, когда ведете разработку и меняете параметры вызова сниппета, очищайте кэш картинок, для этого я специально кнопку в админке сделал
                            Александр
                            13 октября 2025, 22:20
                            Не работает внутри чанка.
                            Рабочая конструкция
                            <img src="[[+tv.image:phpthumb=`w=830&h=822&zc=1&f=webp`]]" class=«card-img-top»
                            alt="[[+custom-alt-Image?]]">
                            Меняем на
                            TV называется image с id равному 3
                          Александр
                          13 октября 2025, 22:21
                          Меняем на
                            FastDevLab
                            16 октября 2025, 14:39
                            Иван, привет, хороший компонент. Предложения:
                            1. Сделай настройку хранения миниатюр (assets/components/thumb3x/cache/), чтобы в место стандартного пути можно было указать свой (более короткий).
                            И в документации напиши вариант в виде модификатора, например:
                            {$images | Thumb3x : "w=239&h=331&zc=1"}
                            — так кстати работает, а вот так
                            {$images | Thumb3x : "w=239&h=331&zc=1&f=webp"}
                            — тоже работает, только не меняет формат изображения
                            А вот такое:
                            <img src="[[!Thumb3x?
                                &sourceId=`2`
                                &input=`[[*TV_proba]]` 
                                &options=`w=520&h=520`
                            
                                &quality=`80`
                                &format=`webp`
                            
                            ]]">
                            Как то диковато выглядит — ну если только в шаблоне так что то можно вызывать, в чанах лучше как модификатор
                              Ivan K.
                              18 октября 2025, 17:08
                              Здравствуйте. Обязательно займусь доработкой, но в ноябре.
                              Евгений
                              19 ноября 2025, 15:24
                              пишите что все пакеты старые, а как же pthumb? thumb3x лучше?
                                Николай Савин
                                19 ноября 2025, 18:53
                                pthumb последний раз обновлялся 11 лет назад. Там даже нет поддержки PHP8, Composer Namespace и т.п.
                                Конечно же не нужно его использовать, если есть современные альтернативы
                                  FastDevLab
                                  24 ноября 2025, 20:22
                                  pthumb последний раз обновлялся 11 лет назад. Там даже нет поддержки PHP8 — работает он с php 8, прямо сейчас работаю с ним на MODX 3.1.2 + PHP 8.2.
                                  Конечно же не нужно его использовать, если есть современные альтернативы — нету адекватных пока, к сожалению. Thumb3x не плох, может качественнее сжимает, современные библиотеки и на этом все пожалуй) Путь сжатых изображений настроить нельзя (кому как, а мне это надо), базовую конструкцию типа
                                  {$images | Thumb3x : "w=239&h=331&zc=1&f=webp"}
                                  — не до конца воспринимает, в webp не конвертирует, а надо бы (только из за этих 2х нюансов уже им не пользуюсь). Будет апдейт, который это поправит без проблем на него перейду.
                                    Ivan K.
                                    24 ноября 2025, 21:31
                                    {$images | Thumb3x: «w=239&h=331&zc=1&f=webp»}
                                    — не до конца воспринимает, в webp не конвертирует, а надо бы (только из за этих 2х нюансов уже им не пользуюсь). Будет апдейт, который это поправит без проблем на него перейду.
                                    Так попробуйте и все будет конвертировать (правильный ключ «fm»):
                                    {$images | Thumb3x : "w=239&h=331&zc=1&fm=webp"}
                                    Вот официальный сайт библиотеки если что.
                                    glide.thephpleague.com/
                                      FastDevLab
                                      25 ноября 2025, 07:08
                                      Отлично. Ну еще проблему с путями решить и норм) Но судя по комментам о Thumb2x, картинки весят больше, чем после обработки pthumb — что тоже ставит новые библиотеки под вопрос, а лучше ли они. Пока pthumb выглядит поинтереснее, да и в принципе не сложно ему самостоятельный небольшой апдейт сделать, чтобы был заточен чисто по php 8+
                                  FastDevLab
                                  24 ноября 2025, 20:35
                                  Пока не лучше (если только по качеству картинки после ее сжатия, и может по силе сжатия — это не тестил (их размер после обработки)), смотрите другой мой комент.
                                  Дмитрий
                                  05 февраля 2026, 02:40
                                  @Ivan K. Привет, подскажи, пожалуйста, нет ли у тебя в планах разместить доку для Thumb3x и Thumb2x на docs.modx.pro? Ну или как-то вообще решить этот вопрос с документацией в экосистеме русскоязычного modx. Для таких системообразующих компонентов это мастхэв, мне кажется. Благодарю за ответ!
                                    Ivan K.
                                    05 февраля 2026, 08:47
                                    Привет.
                                    в планах разместить доку для Thumb3x и Thumb2x на docs.modx.pro?
                                    Нет в планах.

                                    Ну или как-то вообще решить этот вопрос с документацией в экосистеме русскоязычного modx
                                    Есть на русском языке документация:
                                    docs.ivan345.com/books/thumb3x/page/thumb3x-dokumentaciia
                                      Дмитрий
                                      05 февраля 2026, 13:12
                                      Я видел, что документация есть, вопрос был именно про docs.modx.pro, чтобы она не пропала, если не будет вашего сайта, вдруг. Спасибо.
                                    Сергей
                                    05 июля 2026, 12:06
                                    Здравствуйте.
                                    подскажите как сделать правильно.
                                    для категории миниатюры создаются, а на странице товара уменьшенное изображение вывести не могу.
                                    пишет Недопустимый тип файла
                                    что не так делаю???

                                    <img class=«uk-cover» [[!Thumb3x?
                                    &sourceId=`1`
                                    &input=`[[+tv.image-dekor]]`
                                    &options=`w=600&h=600`
                                    &quality=`80`
                                    &format=`webp`
                                    ]] alt="[[*longtitle]]" uk-cover uk-img >
                                      Ivan K.
                                      05 июля 2026, 12:09
                                      Здравствуйте.
                                      А что выводит [[+tv.image-dekor]]? если просто вставить в чанк
                                        Сергей
                                        05 июля 2026, 12:15
                                        думаю что должно выводить обработанное тв поле товара
                                          Ivan K.
                                          05 июля 2026, 12:16
                                          Проверьте что выводит, сдается мне, что там пусто)
                                            Сергей
                                            05 июля 2026, 12:36
                                            браузер это выводит с огромной шириной
                                            <img class=«uk-cover» Недопустимый="" тип="" файла.="" alt=«Декор Дуб Карпентер темный» uk-cover="" uk-img="" style=«width: 6660px; height: 666px;»>

                                            <----img src="[[!Thumb3x? &input=`path/to/image.jpg` &options=`w=600&h=600`]]" alt="">
                                            в таком виде картинка появляется и в списке обработанных и на странице, но мне нужно в шаблон товара ее воткнуть и не понимаю как вставить
                                              Ivan K.
                                              05 июля 2026, 12:57
                                              Вы меня не понимаете, что выводит [[+tv.image-dekor]] ??? без сниппета Thumb3x
                                                Сергей
                                                05 июля 2026, 13:02
                                                без сниппета Thumb3x выводит полную картинку из тв поля image-dekor
                                                <img class=«uk-cover» uk-cover uk-img [[*image-dekor]]> вот так выводит.

                                                если в снимет вставляю [[*image-dekor]] то пишет исходный файл не найден
                                                  Ivan K.
                                                  05 июля 2026, 13:05
                                                  <img class=«uk-cover» uk-cover uk-img [[*image-dekor]]>
                                                  Если прям так выводит это не допустимый вариант, нужен путь к изображению!
                                                    Сергей
                                                    05 июля 2026, 13:20
                                                    так у меня в шаблоне — на экран выводит картинку
                                                      Ivan K.
                                                      05 июля 2026, 13:22
                                                      Нужен путь к файлу, а не кусок html кода
                                                        Сергей
                                                        05 июля 2026, 16:11
                                                        все получилось спасибо
                                    Павел Романов
                                    29 августа 2026, 12:39
                                    Спасибо за компонент, все супер, но есть нюанс ).
                                    Использование водяного знака подразумевает отсутствие возможности скачать исходный файл без WM, однако, по пути сгенерированного изображения легко понять где лежит исходник. То есть, если исходное изображение находится по адресу:
                                    /images/products/253/001.jpg
                                    То путь к сгенерированному будет выглядеть так:
                                    /cache_url/images/products/253/001.jpg/***.jpg
                                    Соответственно, можно легко понять, где лежит картинка без водяного знака в исходном качестве.

                                    В pThumb например, есть параметр pthumb.ptcache_images_basedir, с помощью которого можно исключить часть пути к исходному изображению при кешировании.
                                    Для вышеописанного примера, если в pthumb.ptcache_images_basedir прописать images/products, то URI результирующего изображения будет:
                                    /cache_url/253/001.932b7ffc.jpg
                                    И тут уже гораздо сложнее понять расположение исходника.
                                      Ivan K.
                                      29 августа 2026, 15:26
                                      Выпустил обновление и обновил документацию.
                                      Коротко теперь можно менять пути кэша.

                                      Если задача — действительно закрыть доступ к изображениям без водяного знака, разместите оригиналы вне корня сайта: создайте «Источник файлов» с базовым путём за пределами публичной директории (например {core_path}storage/images/) и укажите его в настройке thumb3x.source_id. Thumb3x читает файлы через файловую систему, а не по HTTP, поэтому обработка продолжит работать, а наружу будет отдаваться только папка кэша — уже с водяным знаком.
                                    Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
                                    51