Как я укротил монстра: история создания строительного калькулятора на WordPress

Привет! Меня зовут Юрий, я веб-разработчик, и сегодня я хочу рассказать вам историю одного архитектурного приключения, которое в итоге превратилось из тупого кошмара в довольно неплохой продукт. Это кейс о том, как амбициозное техническое задание сначала поставило WordPress на колени, а затем заставило его летать.

Всё началось с того, что мне в руки попал проект для оренбургской строительной компании Altair56. Задача стояла конкретная: сделать на сайте мощный, детальный калькулятор сметы (он и сейчас доступен по адресу altair056.ru/kalkulyator-smety/). Заказчик хотел не просто «форму обратной связи с тремя ползунками», а полноценный инженерный инструмент. Пользователь выбирает тип работ (например, устройство полов или возведение новых стен), вводит объем (квадратные метры, кубы, погонные метры), а система мгновенно рассчитывает стоимость самой работы и автоматически подтягивает расход всех сопутствующих материалов по сложным формулам.

Звучало круто. Я заварил кофе, открыл редактор кода и совершил классическую ошибку разработчика: переоценил стандартную архитектуру WordPress.

Рождение медленного монстра (Версия 1.0)

На бумаге план казался логичным. Зачем изобретать велосипед, если в WordPress есть прекрасные кастомные типы записей (Custom Post Types) и таксономии? Я создал структуру, где:

  • Категории верхнего уровня (Полы, Стены, Потолки) — это родительские термины таксономии.
  • Подкатегории (Разбор пола, Ремонт, Новые полы) — дочерние термины.
  • Сами строительные работы — это отдельные записи типа construction_work.
  • Материалы и механизмы — вложенные элементы, привязанные через связи или кастомные поля (Advanced Custom Fields) к конкретной работе.

Чтобы вывести это дерево на фронтенде, я написал массивный скрипт. Он брал категории, запускал цикл по подкатегориям, внутри делал WP_Query для поиска работ, а внутри каждой работы запускал еще один цикл для перебора связанных материалов.

Получился классический "Monster Loop" — вложенные циклы глубиной в 3–4 уровня.

Первая версия калькулятора
Первая версия калькулятора

Пока я тестировал систему на десятке демо-работ, всё летало. Я радовался жизни и думал, что проект уже в кармане. Но реальный строительный бизнес суров. Контент-менеджер начал наполнять базу: демонтаж стяжки, укладка ламината, грунтовка, бетоноконтакт, кирпичная кладка, штукатурка... К какому-то моменту количество позиций перевалило за 200.

И тут сервер сказал: «Харэ!».

Страница калькулятора начала грузиться по 20–30 секунд. Каждый визит пользователя генерировал сотни (если не тысячи) тяжелых запросов к базе данных через wp_posts и wp_postmeta. База данных захлебывалась в JOIN-ах. Процессор хостинга раскалялся, а оперативная память таяла на глазах, пожираемая неоптимальными объектами WordPress. Калькулятор безбожно тупил, превратившись в неповоротливого монстра. Стало очевидно: оставлять это в продакшене нельзя. Проекту срочно требовалась полная перезагрузка.

Эволюция и оптимизация: Версия 2.0

Я понял, что пытаться заставить стандартный WP_Query быстро ворочать сотнями связанных объектов внутри циклов — это утопия. WordPress хорош для блогов и корпоративных сайтов, но для динамических калькуляторов с кучей математики его ядро нужно использовать иначе.

Я полностью переписал архитектуру, создав Версию 2.0. Главная идея рефакторинга заключалась в разделении логики хранения и логики вывода.

  1. Кастомные таблицы БД. Я отказался от хранения мета-полей материалов в стандартной wp_postmeta. Вместо этого я создал несколько легких, отлично индексированных кастомных таблиц в MySQL: одну для самих работ, другую — для формул и расхода материалов.
  2. Никаких тяжелых циклов на бэкенде при генерации страницы. Теперь при открытии калькулятора PHP не собирал дерево на лету. Вместо этого сервер отдавал чистый, легковесный каркас страницы.
  3. Перенос вычислений на сторону клиента (JavaScript). Я превратил калькулятор в подобие SPA (Single Page Application). При первой загрузке страницы происходил один-единственный быстрый AJAX-запрос, который забирал из кэша весь массив данных по работам и материалам в формате JSON.
  4. Реактивный расчет. Все вложенные циклы, которые раньше вешали сервер, переехали в браузер пользователя. Теперь, когда клиент вводит площадь, JavaScript на лету просчитывает формулы (например, Q * 0.13 для кислорода или Q * 0.2 для мешков с мусором). Браузер делает это за доли миллисекунды.

Результат превзошел ожидания. Время загрузки страницы упало с 10 секунд до честных 0.4 секунды. Нагрузка на сервер снизилась практически до нуля, а сам калькулятор стал отзывчивым, плавным и быстрым, сколько бы работ в него ни добавляли.

Калькулятор версия 2.0
Калькулятор версия 2.0

И заодно раскрытая вкладка работы

Вкладка работы
Вкладка работы

Что под капотом: устройство калькулятора сегодня

Если вы зайдете на сайт Altair56 сейчас, вы увидите результат этой долгой работы. Калькулятор разбит на логические блоки: Полы, Стены, Перекрытия, Отделка.

Давайте заглянем внутрь одной позиции, чтобы понять, насколько детально всё просчитано. Возьмем, к примеру, «Устройство бетонной стяжки армированной». Это не просто фиксированная цена за квадратный метр (3980.22 руб.). Как только пользователь вводит необходимую площадь Q, калькулятор мгновенно разворачивает скрытую от праздных глаз технологическую карту и считает:

  • Объем ПГС по формуле Q * 0.103 кубических метров.
  • Вес портландцемента (Q * 0.028 тонн).
  • Расход грунтовки (Q * 0.4 кг).
  • Количество маяков (Q * 0.5 штук).
  • Стальную арматурную сетку с учетом нахлеста по параметрам длины и ширины сетки (Q * 1 / (L * W) * 1.1).

Каждая позиция — от демонтажа плинтуса до сложной декоративной штукатурки откосов — имеет жестко прописанные математические зависимости. Калькулятор учитывает даже такие мелочи, как расход бензина АИ-95 для вибротрамбовки при устройстве подстилающего слоя (Q * 0.3 литра на квадрат)!

Для обычного клиента это выглядит как магия: ввел площадь квартиры, нажал пару кнопок и получил честную, прозрачную до копейки смету, с которой уже не страшно идти к строителям.

Функциональная админка

Отдельная история — это панель управления. Часто разработчики делают красивый фасад сайта, но внутри админки оставляют черт ногу сломит. Я пошел по другому пути. Поскольку цены на стройматериалы в Оренбурге (и в целом по стране) меняются быстрее, чем погода, админка должна была стать максимально дружелюбной к контент-менеджеру.

Админка калькулятора
Админка калькулятора
Админка калькулятора продолжение
Админка калькулятора продолжение

Я спроектировал кастомный интерфейс управления сметами.

  • Глобальное управление ценами: если дорожает цемент или мешки для мусора, менеджеру не нужно заходить в каждую из 200 работ. Достаточно изменить цену материала в единой глобальной таблице ресурсов, и она автоматически пересчитается во всех формулах по всему сайту.
  • Конструктор формул: для создания новой работы не нужно привлекать меня (программиста). В админке реализован визуальный билдер. Менеджер просто пишет название работы, базовую стоимость, а затем через удобный интерфейс добавляет нужные материалы, выбирая переменные (Q, L, W, H) и собирая формулу расхода прямо в текстовом поле.

Взгляд в будущее: Личный кабинет и Биржа смет

Калькулятор пока еще наполняется работами . Но как разработчик, я всегда смотрю на шаг вперед. Архитектура версии 2.0 получилась настолько гибкой и масштабируемой, что проект легко может перерасти рамки локального сайта строительной компании.

Уже сейчас в коде заложен фундамент для масштабного расширения:

  1. Личный кабинет (ЛК) пользователя. Клиент может не просто посчитать смету и закрыть вкладку, а сохранить её в своем профиле. Там он сможет отслеживать изменения, скачивать её в PDF/Excel, отправлять на модерацию инженерам или делить проект на этапы (например, «делаем сначала ванную, потом кухню»).
  2. Создание полноценной строительной биржи. Это моя любимая идея, которую мы планируем реализовать, если со стороны рынка будет высокий интерес. Мы можем превратить этот калькулятор в независимую платформу-агрегатор для Заказчиков и Исполнителей.

Как это будет работать?

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

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

Этот проект научил меня одной важной вещи: никогда не полагайтесь на стандартные решения, если создаете что-то действительно сложное. WordPress может быть невероятно быстрым и мощным движком — нужно просто уметь правильно его готовить.