Евгений Росляков перенёс интерфейс внутренней системы лизинговой компании с Ext JS, Sencha Touch и Google Web Toolkit на Blazor. Компания сдаёт оборудование и транспорт в лизинг малому бизнесу. Веб-системами и сайтами Евгений занимается с 2016 года, он самозанятый, работает по договору и готовит для юрлиц закрывающие документы. Живёт в Москве и берёт проекты удалённо.
У лизинговой компании было три разных интерфейса. Менеджеры работали во внутренней системе на Ext JS 4. Лицензия Sencha давно устарела, а обновление до новой ветки стоило дорого. Выездные агенты пользовались мобильным приложением на Sencha Touch: лет пять его никто не развивал, библиотека заброшена, и на новых телефонах оно вело себя странно. Отчёты были написаны на Google Web Toolkit и открывались медленно.
Бэкенд при этом давно работал на .NET и претензий не вызывал. Проблема сидела в оболочке: три технологии, ни одна не поддерживается, и в каждой свой набор компонентов, свои привычки и свои баги.
Задача: заменить интерфейс, не трогая бизнес-логику и не останавливая менеджеров. Заявки идут каждый день, и пара дней без системы обошлась бы компании слишком дорого.
Было и второе условие. Интерфейс должен говорить на одном языке с бэкендом: .NET-разработчик обязан читать и править его без отдельного знакомства с JavaScript-библиотекой десятилетней давности.
Для нового интерфейса выбрал Blazor. Он пишется на C#, компоненты лежат рядом с серверным кодом и берут те же модели данных из общей библиотеки. Описание заявки, графика платежей или договора больше не приходится вести на двух языках.
Сначала составил карту экранов старой системы и спросил менеджеров, чем они пользуются каждый день. Из нескольких сотен экранов на Ext JS живыми оказались около двух десятков. С них и начал: заявки, графики платежей, документы по договору. Остальное оставил на потом.
Таблицы на Blazor сделал удобнее прежних гридов Ext JS. Фильтры запоминаются между сеансами, столбцы можно скрывать и менять местами, поиск по номеру договора срабатывает сразу, форма заявки разбита на шаги. Недостающее менеджеры подсказывали сами: быстрый переход из графика платежей к документам и отметку о просрочке прямо в строке.
Выездным агентам вместо приложения на Sencha Touch сделал адаптивную версию на Blazor. Она открывается в браузере телефона, ставить ничего не надо, а обновления доходят сразу. Агент видит свои заявки, клиента, список документов и может приложить фото договора или объекта.
Отчёты на Google Web Toolkit переписал и ускорил. Самые тяжёлые теперь готовятся на сервере заранее, а в интерфейсе открываются готовым результатом. Цифры новых отчётов сверял со старыми на реальных периодах и, если суммы расходились, выяснял, какая из них верна.
Старые и новые экраны работали параллельно. Менеджер входил в одну систему, часть пунктов меню вела на страницы Blazor, часть на прежние страницы Sencha. Пока экран не проверили в работе, старый оставался под рукой. Вход и права по-прежнему выдаёт бэкенд, их я не менял.
Менеджеры переходят на новые экраны по одному, и ни один рабочий день не потерян. Частые операции (завести заявку, посмотреть график, найти документ) требуют меньше шагов. Заметно это по тому, что к старым экранам возвращаются всё реже.
Агенты получили то, чем можно пользоваться на встрече у клиента. Раньше приложение подвисало и просило обновиться, теперь достаточно открыть страницу в браузере.
Отчёты открываются заметно быстрее, а цифры сверены с прежними, так что финансистам не придётся объяснять руководству, почему итог изменился.
Главная перемена для компании в том, что язык и платформа теперь одни. .NET-разработчику не нужно переключаться между C# и старой библиотекой Sencha, а лицензию на Ext JS не придётся продлевать, когда выключат последний старый экран.
Ограничения тоже есть. Часть редких экранов пока работает на Ext JS: их почти не открывают, и спешить с переносом нет смысла, они уйдут следующими этапами. Кроме того, Blazor в серверном режиме держит постоянное соединение с сервером. Агентам, которые бывают без связи, понадобится отдельный офлайн-режим. Мы это обсудили с заказчиком, но не делали.
Живёт у вас система на устаревших библиотеках, которую страшно трогать? Расскажите мне на freelance.ru, на чём она сделана. Подскажу, какие экраны переносить первыми и как не остановить работу.
