Кто клиент
Одним из клиентов ADCI Solutions является американский производитель окон и дверей. Клиенту понадобилась необычная фича: в зависимости от геолокации пользователя контент на сайте должен немного меняться.
Геозависимый контент — тип наполнения сайта, который меняется в зависимости от местоположения пользователя
К примеру, в жарком Техасе чёрный цвет наружной части будет быстро нагреваться на солнце, и поэтому в он недоступен для заказа в регионе. А покупатели из некоторых штатов не увидят в перечне определённую серию окон, потому что здесь ее не производят. Все комбинации задаются в админке.
Как фича реализуется обычно
Чтобы динамически изменить элемент сайта, на бэкенде задается правило. Если геолокация пользователя совпадает с геолокациями, прописанными в правиле, какая-то часть контента на только что загруженной странице меняется или исчезает.
Проблема в том, что это убивает кэш элемента, блока или в худшем случае всей страницы. А это значит, что пользователю приходится ждать, когда страница загрузится заново, хотя она могла быть просто взята из кэша.
Как сделали мы
Для работы с геозависимым контентом мы написали модуль Front-End Modifier. Он построен на JavaScript и реализуется на стороне пользователя в обход кэша.
Все чувствительные к изменению геолокации элементы по умолчанию скрыты. По ходу загрузки страницы на ней появляются только актуальные для этой геолокации элементы, а неактуальные остаются скрытыми. Так мы избежали некачественного UX — обычно при загрузке страницы все элементы мерцают, и если пользователь замечает элемент, который потом не прогружается, это сбивает его с толку.
С помощью модуля Front-End Modifier мы задаем правила: скрыть серию для таких-то регионов, заменить этот или тот элемент. При загрузке страницы правило подгружается вместе с ней и с помощью JS сортирует выбранные элементы. Концепцию модуля можно переиспользовать и на других проектах, если клиент точно знает, по какому признаку он хочет классифицировать товары или услуги, какой контент показывать и не показывать в зависимости от заранее известных условий.
Ручной ввод геолокации
Мы позволили пользователям сайта менять геолокацию вручную на случай, если нужно заказать установку окон в другом городе.
Представим: пользователь житель Нью-Йорка проводит отпуск в Сан-Франциско, откуда решил заказать окна домой. По умолчанию он попадет на сайт, ориентированный на жителей Калифорнии с соответствующим ассортиментом. Но ему достаточно ввести домашний почтовый индекс в специальное поле и «оказаться» там, где он хочет.
Функция реализуется с помощью кастомного кода, который через куки определяет локацию, фильтрует элементы сайта и т. д.
