Умный фильтр 1С-Битрикс: умный, быстрый и красивый

• Немного истории…
• Больше настроек отображения
  • Вид в умном фильтре
  • Показывать развернутым
  • Подсказки
• Страница управления отображением свойств
• Настройки компонента
• Ползунок цен
• Фильтрация по SKU
• Конвертация валют
• Ускорение работы фильтра
• ЧПУ адреса
• Выводы

За последние 6 лет умный фильтр пережил немало изменений. В погоне за сразу всеми тенденциями современного Веба он принял на себя много изменений и своим "умом" покорил многие интернет-магазины.

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

Вот самые популярные задачи к smart-фильтрам:

• привязка свойств к группам;
• не давать выбирать несовместимые опции (0-й результат);
• скрывать те значения свойств, которых нет у товаров в выбранном разделе.

И вот, спустя 6 лет после появления первой версии 1C-Bitrix сделали большой шаг, выпустив умный фильтр 2.0, с долгожданными доработками и оптимизаций скорости работы компонента. Обо всех изменениях мы поговорим в этой статье.

Немного истории…

— Не стоит так гордиться этим технологическим монстром, что вы построили.
(с) Дарт Вейдер

Первая версия умного фильтра в БУС была тяжёлой, сложной и не всегда адекватной. Не каждый сайт мог позволить себе принять такого гостя. Идей по его улучшению у сообщества было хоть отбавляй.

Прошло несколько лет и теперь это совсем другой компонент.

Больше настроек отображения

В первой версии умного фильтра внешний вид свойств никак не настраивался. А в версии 2.0 появились следующие параметры:

• вид свойства в умном фильтре (флажки, радио-кнопки, ползунки);
• показать свойство свернутым или развернутым;
• текст подсказки к каждому свойству.

Вид в умном фильтре

Раньше свойства отображались только в виде флажков. Теперь стало возможным настраивать способ отображения свойств через настройку "Вид в умном фильтре".

Наборы способов отображения доступны в зависимости типов данных:

• Для типа данных справочник стали доступны следующие виды отображения:
  
• Тип данных число теперь отображается в виде ползунка
  
• Для типа строка настраиваются следующие виды отображения
  

Виды отображения задаются в настройках инфоблока

Показывать развернутым

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

Подсказки

В настройках инфоблока появилась настройка текста подсказки для пользователей. Если свойство требует дополнительной информации, то это как раз тот случай, чтобы использовать эту настройку.

Страница управления отображением свойств

Если в инфоблоке содержится много свойств и возникают сложности с настройкой каждого из них — на помощь приходит специальная страница управления свойствами. Эта страница расположена в административном интерфейсе: Магазин > Продукция > Настройки каталога.

Здесь настраивается отображение в умном фильтре: выбирается в каком виде отображать свойство, как отображать и в каком порядке.
В "Настройки каталога" указываются свойства, которые выводятся во всех группах товаров. Однако если потребовалось задать для каждой группы товаров собственный набор свойств, то это теперь можно сделать в настройках магазина (Магазин > Продукция > Группы).

Настройки компонента

До выхода версии 2.0 умный фильтр работал только с торговыми каталогами. Никаких новостей и акций. Теперь можно настроить компонент на любой инфоблок.

Ползунок цен

В умном фильтре 1.0 контролы ползунка отображались круглыми и их нельзя было сузить вплотную, при этом диапазон суммы располагался в больших пределах. В версии 2.0 контролы доработали и, вместе с тем, доработали отображение диапазона цен в шаблоне умного фильтра.
У ползунка появилось четыре характерных цвета с собственными обозначениями:

• светло-зеленый - за диапазоном выбора имеются доступные товары;
• темно-зеленый - в выбранном диапазоне доступные товары;
• светло-серый - в диапазоне нет товаров;
• темно-серый - показывает сектор, в котором отсутствуют товары.

На скриншоте можно увидеть как отображается доступный диапазон цен.
Если в выбранном диапазоне расположен сектор с отсутствующими товарами, то он закрашивается серым цветом.

Фильтрация по SKU

Появилась фильтрация товаров по свойствам и ценам SKU (торговых предложений). Однако это нововведение имеет недостатки в логике вариантов выбора - такие случаи были освещены в этой идее.

Конвертация валют

Конвертация валют, именуемая в параметрах комплексного компонента каталога как “Показывать цены в одной валюте” не происходила в умном фильтр. Таким образом, товар стоимостью 9$ отображался дешевле товара стоимостью 10 рублей. Теперь ошибка исправлена и конвертация цен происходит корректно и в каталоге и в умном фильтре.

Ускорение работы фильтра

Умный фильтр 1.0 после нажатия кнопки «Подобрать» перебирал все товары и сравнивал их свойства с искомыми. С ростом количества товаров и свойств сильно возрастала нагрузка на сайт и увеличивалось время ответа сайта.

Для ускорения придумали технологию «фасетный индекс». Она напоминает кэширование. Все товары один раз индексируются в отдельную таблицу БД (в фасет) и фильтрация проводится по этому быстрому и легкому «кэшу». Эта технология в 3-4 раза ускорила работу умного фильтра и снизила нагрузку на сервер.

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

Пересоздание фасетного индекса также требуется выполнить в случаях:

• Когда происходит добавление или редактирование разделов каталога.
• При добавлении или удаления свойства из умного фильтра.
• При выгрузке из 1С, если происходит обновление и добавление товаров с новыми свойствами.

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

Если какой-то фасетный индекс устарел, Битрикс подскажет.
Если в каталоге большое количество товаров, то процесс переиндексации может занять много времени и сильно сказаться на производительности сайта. Лучше проводить эту операцию ночью. Чтобы убедиться в эффективности фасетного индекса мы провели эксперимент в следующих суровых условиях:

1. Отключено кэширование;
2. Используется стандартный шаблон компонента;
3. В разделе 4487 товаров;
4. В фильтре выводятся 30 свойств.

	Без фасета			С фасетом
	Время, с	Запросы, шт	Время обработки запросов, с	Время, с	Запросы, шт	Время обработки запросов, с
Фильтр сброшен	22.594	723	6.9606	3.5652	15988	0.7196
Фильтрация по 1 свойству	16.6764	722	0.7129	3.9346	15989	0.8931
Фильтрация по 5 свойствам	16.7882	722	0.7159	3.7546	15989	0.8112
Фильтрация по 10 свойствам	18.8288	722	0.7221	3.8405	15989	1.0425
Фильтрация по 20 свойствам	16.2383	722	0.7542	5.5167	15989	2.4592

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

ЧПУ адреса

В новой версии умный фильтр получил возможность выдавать результаты запросов с ЧПУ адресами. До выхода новой версии использовался партнерский модуль Kombox: Умный-фильтр (ЧПУ, SEO, AJAX).

ЧПУ (Человеко Понятный URL) - это адрес страницы, который вместо непонятных букв и цифр в параметрах get запроса содержит в себе читаемые слова, например:

/catalog/dresses/filter/price-base-from-3238-to-4249/specialoffer-is-yes/manufacturer-is-россия%20"модница"/color_ref-is-blue/apply/

ЧПУ позволяет улучшить SEO, создавать посадочные страницы прямо в каталоге и др.

К недостаткам этого нововведения относятся:

• в адреса попадают русские слова;
• избыточные по длине адреса страниц;
• нет простого способа настроить канонический адрес;
• после сброса фильтра адрес содержит излишки в адресе “/filter/clear/apply/”;
• на странице с результатами фильтра нельзя разместить заголовок и текст;
• если свойство выгружено из 1С, то вместо названия в URL отображаются xml_id, например: /catalog/obuv/muzhskaya_obuv/filter/pol-is-7a8056fa-2476-11e1-8f42-78e7d1f46ffb/apply/.

Для решения этих недостатков используются дополнительные модули, например Инструменты SEO-специалиста.

Выводы

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

Из тех проблем, что сохранились выделяются следующие:

• некорректная логика выбора (И-ИЛИ) для каждого свойства и между свойствами( https://idea.1c-bitrix.ru/smart-filter-the-choice-between-and-and-or-for-the-values-of-each-prop/ );
• умный фильтр некорректно работает в корне каталога.

Помимо этого, мы выделяем список частых доработок умного фильтра, которые требуют заказчики:

• Добавить кнопку сбросить для каждого отдельного свойства;
• Не отображать свойство в умном фильтре, если там только одно значение;
• Сделать сортировку для значений свойств.

Если Ваш умный фильтр работает недостаточно быстро или вы хотите его доработать мы с радостью Вам поможем.