Обновление калькулятора Циферблат

Задача

Задачей этого проекта было улучшение уже имеющегося калькулятора. Изначальная версия обладала большим количеством кода, который нагружал весь сайт и тратил много времени на обработку элементарных запросов. Также, большой проблемой стал вопрос об «отсутствии гибкости» для внесения улучшений.

Особенности

Для удобства, данные о ценах хранятся в формате таблиц. Позже они выводятся на страницу, обрабатываются скриптом в более приемлемую для клиента форму.

Подготовка

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

Процесс на бумаге
Процесс на бумаге

Решение

Была разработана новая логика по получению данных, основанная на табличном формате данных и data-аттрибутов, в которых храняться вспомогательные параметры.

После загрузки данных в область видимости скрипта, он считывает все данные в объект, все параметры в массив параметром (для вывода вариантов пользователю).

Тестовая сборка
Тестовая сборка

Дополнительные же данные, которые находятся в data-аттрибутах являются триггерами для распределении в таблицах.

Выводы

Разработка и внедрение данного универсального решения позволило существенно увеличить скорость загрузки страницы и облегчить ее работу.

Доказательством улучшения работы были данные, полученные с помощью утилиты от Google — PageSpeed Insights. Мы определили, что показатели оценки выросли на 4-7 процентов в ПК и мобильной версии.

pagesspeed
Pagesspeed
В проекте принимали участие

Арсений МатыцинАрсений Матыцин