{"id":14287,"url":"\/distributions\/14287\/click?bit=1&hash=1d1b6427c21936742162fc18778388fc58ebf8e17517414e1bfb1d3edd9b94c0","title":"\u0412\u044b\u0440\u0430\u0441\u0442\u0438 \u0438\u0437 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430 \u0434\u043e \u0440\u0443\u043a\u043e\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044f \u0437\u0430 \u0433\u043e\u0434","buttonText":"","imageUuid":""}

Как мы делали мобильное приложение для ФК «ЗЕНИТ» и нарвались на аудит

Здравствуйте! На связи Максим Кульгин, компания Notissimus, мы много лет разрабатываем мобильные приложения. Сегодня расскажем про необычный кейс. Заказчик устроил нам целый аудит: нанял экспертов, они штудировали наш код, делали замеры. Рассказываем, как это было и чем всё закончилось — будет интересно и разработчикам, и пользователям!

Ещё больше, по пять-шесть раз в день, пишу в Телеграм-канал «Русский ИТ бизнес», в котором делюсь идеями, успехами, провалами, а также дарю платные материалы. Все посты активно обсуждаются. Нас уже почти 12 000 (предприниматели и айтишники, в основном). Присоединяйтесь!

«Зенит» — знаменитый футбольный клуб Санкт-Петербурга, за который болеют целыми поколениями. Ещё немного — и «Зенит» отпразднует свой столетний юбилей!

Картинка с сайта app.fc-zenit.ru

Всех достижений ФК «Зенит» за долгую историю и не счесть: обладатель Кубка СССР 1944, чемпион СССР 1984, многократный чемпион и обладатель Кубка России, Кубка УЕФА 2007 и 2008, Суперкубка УЕФА 2008, многократный обладатель Суперкубка России… И это не считая чуть менее звездных соревнований и товарищеских встреч!

Коммерческих конкурентов у ФК «Зенит» нет. Есть уже своя устоявшаяся аудитория: фанаты и болельщики из Санкт-Петербурга, а также других городов — ведь «Зенит» выходит далеко за границы местного клуба. Даже простые петербуржцы, объятые информационным ажиотажем, волей-неволей становятся болельщиками, когда бело-голубые знамена заполняют все городские билборды и первые полосы местных газет.

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

Мобильное приложение нужно всем

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

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

Например. Пользователь может получать push-уведомления всех типов и, таким образом, следить за матчем, не отвлекаясь от дел. В браузер не придёт звуковое оповещение. Даже если в браузере и покажется какое-то всплывающее окошечко, оно не сможет быть таким же информативным, не сможет так же надежно привлечь и удерживать внимание пользователя. В мобильном приложении всё иначе.

Поэтому на мобильные приложения есть устойчивый спрос. Они «заточены» на определенные действия пользователей, всё — «в одно касание»: минимальные усилия для навигации, всё нужное под рукой, всё всегда рядом.

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

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

Немного о проекте

Наше сотрудничество с ФК «Зенит» началось в 2015 году.

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

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

Приложения одного типа чем-то похожи. Например, все приложения интернет-магазинов имеют примерно одинаковую структуру и особенности. То же самое можно сказать и про спортивные приложения. Мобильное приложение для ФК «Зенит» — не первое из разряда спортивных, которое мы делаем. Разумеется, есть отличия. Но по своей архитектуре, по своему строению спортивные приложения тоже довольно близки.

С точки зрения архитектуры и сервер, и бекенд — полностью на стороне ФК «Зенит». Дополнительно мы сделали сервер push-уведомлений, но он тоже разместился на стороне заказчика.

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

Ещё один источник непростых решений — интеграция со сторонними сервисами. Приложение ФК «Зенит» имеет несколько внешних независимых сервисов, взаимодействие с которыми должно быть отзывчивым и незаметным. Приведем несколько примеров.

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

Сервер push-уведомлений для триггерных событий работает независимо и тоже интегрирован в приложение. Все события из жизни команды — встреча с соперником, забитый гол и тому подобное — поступают на главный сервер. Тот, в свою очередь, взаимодействует с сервером push-уведомлений. В приложении есть возможность настроить перечень уведомлений, благодаря чему пользователь может оставаться в курсе интересующих его событий.

Первый тест всегда комом.

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

Александр Маркович, руководитель проекта, Notissimus

И вот, наконец, подходим к основной части рассказа — мы столкнулись с тем, что ещё не встречалось в нашей практике.

Аудит

У ФК «Зенит» возник вопрос: почему иногда приложение отрабатывает медленно?

Для наглядности был выполнен небольшой эксперимент.

Участвовало три устройства: одна из последних моделей iPhone и два Android — среднего и низкого ценового сегмента. Приложение одновременно запустили на всех трёх устройствах-участниках.

Несложно догадаться, что первым отработал iPhone, затем (практически сразу) производительный Android и, наконец, с заметным отставанием слабенький Android.

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

Представители ФК «Зенит» поступили очень профессионально. Они внимательно изучили полученную от нас информацию, поблагодарили и… нашли компанию для получения независимой оценки.

Задача аудита состояла в анализе программного кода и замеров скорости работы приложения.

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

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

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

Особенности проверки исходного кода были следующие:

  • приведение кода согласно методологии Clean Architecture;
  • оптимизация кода для работы с локальной базой данных;
  • оптимизация кода для работы с сервером;
  • оптимизация верстки пользовательского интерфейса.

По итогам аудита выяснилось, что:

  • приложения работают корректно на каждой из платформ;
  • код читабелен, монолитности структуры не наблюдается;
  • проблем с базой данных не обнаружено;
  • имеется несколько дополнений по замене WebView и некоторых UI-компонентов в версиях для обеих платформ с целью повысить читаемость и производительность кода.

При проверке исходного кода было определено, что выбранные библиотеки для работы с сетью соответствуют стандартам, но они не обновлены до последней доступной версии. Соответственно, от аудиторов поступила ожидаемая рекомендация — обновить выбранные библиотеки до последних версий с целью «поддержания текущих систем и стандартов шифрования данных». По мнению экспертов это теоретически могло помочь увеличить производительность, а также исправить существующие ошибки, сказывающиеся на работе Xamarin и нативных библиотек.

Вторая часть аудиторской работы состояла в тестировании отзывчивости.

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

Для аудита скорости было составлено 6 сценариев, проработано 11 параметров измерений.

Были получены следующие выводы и рекомендации:

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

Кроме того, были сделаны довольно обширные выводы по WebView.

Страницы с объемным контентом (например, такие как просмотр матча), реализованные в WebView, могут достаточно долго подгружаться: 15−20 c вместо ориентировочных 8−12 c. Работа с WebView осуществляется со ссылкой на основной сайт, и все проблемы, связанные с производительностью, в данном случае привязаны к производительности сайта. Рекомендовалось такие страницы перенести на нативную технологию.

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

Что можно сказать?

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

Все подробности ниже.

Наши «да» и «нет»

По результатам аудита получилась сводная таблица того, что можно улучшить.

Рекомендация обновить проекты с Net Standard — это как раз то, что мы сейчас и делаем. Процесс этот не простой и не быстрый. Поддержка Xamarin заканчивается в мае 2024 года, и мы за полгода начинаем переход. Обновление Xamarin — отдельная задача, которая касается всех проектов, обновление затронет все разработанные нами приложения, а не только ФК «Зенит».

Также можно обновить библиотеки по работе с сетью до последней стабильной версии на Android. Однако ошибки сети чрезвычайно редки. Обновление сделать можно, но это никак не повлияет на производительность.

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

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

Замена иконок формата png на векторные pdf для iOS — неоправданная замена, которая ни на скорость, ни на качество не повлияет. Тогда уж для iOS лучше превратить все картинки resource-png в imageset (универсальный контейнер от Apple, в котором можно использовать различные дополнительные атрибуты, такие как переключение тёмной и светлой темы, выбор разных картинок для разных устройств и так далее).

Следующая рекомендация — избавиться от бинарных файлов xib для iOS. Во-первых, xib — не бинарный формат, а текстовый всё-таки. Во-вторых, замена этому решению — верстка кода, которая экспоненциально затрудняется с усложнением дизайна. Намного проще верстать экраны в удобном редакторе интерфейса XCode и сохранять результаты в xib.

Был аргумент, что если над файлом xib работает больше одного человека, то становится сложно разрешать конфликты. Теоретически да, если разработка распределенная и децентрализованная — над одним файлом может работать параллельно несколько человек. Только это не наш случай — у нас организация, все трудятся рядом в офисе и редко бывает, чтобы задачи программистов пересекались в пределах одного экрана. Замена xib попросту усложнит верстку.

Ещё одна спорная рекомендация — заменить компонент UITableView на UICollectionView для iOS. Аргументы были следующие: первый плохо справляется с расчетом высоты вложенных элементов, второй обладает асинхронной загрузкой и отображением данных.

Это совсем не так. UITableView отлично подходит для вертикальных списков, а проблемы с расчетом высоты случаются только при недостаточно профессиональной верстке. Волшебная асинхронность UICollectionView второго компонента тоже из разряда редкостей. Протокол же prefetching, который позволяет заранее работать с ячейками списков, имеется у обоих компонентов. Данные в любом случае грузятся в ViewModel заранее и асинхронно, а во View попадают после загрузки. Так или иначе, замена UITableView на UICollectionView не окажет влияния на производительность.

Что действительно влияет на скорость?

Приложение работает с компонентом WebView, который является серьезным испытанием для производительности. При этом происходит переход на сайт для получения и отображения ресурсов.

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

Состоялся тройственный созвон. Представители ФК «Зенит» подтвердили, что работа с WebView — их требование, такова постановка задачи. Подобное ограничение связано с тем, что сейчас в приоритете другие задачи и нет необходимости заново воспроизводить весь функционал на стороне мобильного приложения — для этого надо по сути создавать второй бэкенд с разработкой методов API и так далее. Поэтому часть функциональности реализована на сайте ФК «Зенит», что более чем оправдано.

В итоге аудит пошел на пользу всем. Аудиторская компания получила новый опыт, мы — дополнительную уверенность в своей экспертности, а ФК «Зенит» — чувство спокойствия и гарантию, что всё идет наилучшим образом.

Всё, что приводило к усложнению дальнейшей работы и было чревато нехорошими последствиями, мы отбросили. Некоторые доработки согласовали с ФК «Зенит» и взяли в работу.

Аудит завершился как нельзя лучше.

Что ещё нам принес этот проект

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

Суть проста.

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

У себя мы ведем параллельно свою собственную систему учета задач. В левом столбце задачи заказчика, в правом — сопоставленные им наши задачи. Со стороны заказчика имеется только описание задачи и наши уточняющие вопросы по ней. С нашей стороны видно номер задачи, разработчиков, которые трудились над её реализацией, заголовок коммита.

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

Так как работы много, в дополнение ведется матрица сборок, где проставлены все задачи (и наши, и заказчика), указаны платформы, для которых были сделаны сборки, отдельно выделены релизные сборки и тому подобное. Такая матрица не дает запутаться в большом количестве промежуточных сборок и всегда четко показывает состояние проекта.

Задач много, ФК «Зенит» постоянно добавляет новые. С нашей учетной системой мы чувствуем, что всё под контролем и эта уверенность неизменно передается заказчику.

Выводы

Всегда есть технические рабочие моменты.

Например, сейчас мы добавляем интеграцию с сервисом, который отслеживает и анализирует действия пользователей в приложении для получения рекомендаций по оптимизации работы как самого приложения, так и бизнес-задач. Это тоже длительный процесс и наверняка придется задуматься о каких-то нюансах. Отметим высокий профессионализм представителей заказчика — работать с ними не только эффективно, но и приятно.

Давно работаем с командой Нотиссимус. Первое приложение, которое они сделали было для интернет-магазина атрибутики ФК «Зенит». Сейчас мы очень тесно сотрудничаем в части создания официального мобильного приложения болельщиков нашего клуба и у нас большие планы по развитию.

Виктор Луннов, ИТ-директор, ФК «Зенит»

Не бывает беспроблемных проектов. Каждая проблема — это победа. И сотни тысяч довольных пользователей тому подтверждение.

Напоминаю, что регулярно описываю наш опыт в Телеграме-канале «Русский ИТ бизнес».

Буду рад ответить в комментариях на все вопросы.

P. S. Возможно, вам также будет интересно почитать:

0
43 комментария
Написать комментарий...
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
Юный Жопошник

Щас @Инспектор думаю придет и объяснит =)

Ответить
Развернуть ветку
Максим Кульгин
Автор

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

Ответить
Развернуть ветку
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
Anton Karmanov

делается рассылка с почты glavniy_direktor@nasha_prekrasnaya_galera.ru на все рабочие имейлы со ссылкой на статью в вс, в рассылке написано что надо пройти по ссылке и поставить лайк, скриншот-отчёт до обеда, кто не поставил лайк тот не в одной лодке с командой с занесением в личное дело и депремированием до базового оклада

Ответить
Развернуть ветку
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
Андро БотИчел

У Максима только в Тг-канале 13000+ подписчиков, посчитайте какой процент пришел , прочел и лайкнул (подскажу - менее 1%), после анонса (как я), и вы поймете, что результат пока не очень. Думаю, будет гораздо больше лайков.

Ответить
Развернуть ветку
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
Юный Жопошник

Втирайте лапшу кому другому. Тупо пришли лайкнули и даже комментарий не оставили? А еще чуть ранее все регистрировались в один день практически (причем не сегодня, это могло бы объяснить). Если здесь явная накрутка, то и в ТГ скорей всего дутая аудитория.

Ответить
Развернуть ветку
Юный Жопошник
Ответить
Развернуть ветку
Anton Karmanov
> Xamarin

можно было сразу написать это в начале статьи чтобы не читать её

Ответить
Развернуть ветку
Юный Жопошник

@Инспектор снова поста с ботами! Смотрите даты

Ответить
Развернуть ветку
Максим Кульгин
Автор

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

Ответить
Развернуть ветку
Юный Жопошник

У них даже даты регистрации один к одному

Ответить
Развернуть ветку
Максим Кульгин
Автор

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

Ответить
Развернуть ветку
Максим Кульгин
Автор

а где боты? Какие боты? Какую рекламу? Я не понимаю

Ответить
Развернуть ветку
Юный Жопошник

А вы рекламу не пробовали купить? А то вон уже под сотню лайков и одним комментом за пару минут. @Инспектор

Ответить
Развернуть ветку
Максим Кульгин
Автор

пост опубликовал в ФБ, Телеграме и линдекИн. я ботов не покупаю. мне не нужно.

Ответить
Развернуть ветку
Юный Жопошник

Конечно, вы их регистрируете

Ответить
Развернуть ветку
Максим Кульгин
Автор

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

Ответить
Развернуть ветку
Максим Кульгин
Автор

@Инспектор говорю прямо. к ботам не имею отношения и никогда не имел. давно на площадке, много статей- причины приходов ботов (если они есть) не понимаю... :) бред какой то.

Ответить
Развернуть ветку
Юный Жопошник

Ну такие результаты по попаданию в топ даже Беговатову не снились. Не виноватая я, он сам пришел @Инспектор

Ответить
Развернуть ветку
Юный Жопошник

Вот ваш лучший результат до этого, популярный вы наш

Ответить
Развернуть ветку
Максим Кульгин
Автор
Ответить
Развернуть ветку
Максим Кульгин
Автор
Ответить
Развернуть ветку
Юный Жопошник

Это общий результат, а не две минуты. Не делайте дураков из аудитории.

Ответить
Развернуть ветку
Максим Кульгин
Автор

вот рекорд.

Ответить
Развернуть ветку
Юный Жопошник

Обидно вам будет, если забанят

Ответить
Развернуть ветку
Максим Кульгин
Автор

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

Ответить
Развернуть ветку
Юный Жопошник

Попросил всех одноклассников репорт вам кинуть )

Ответить
Развернуть ветку
Максим Кульгин
Автор

пора уроки делать. одноклассникам тоже.

Ответить
Развернуть ветку
Юный Жопошник

Ща модератора дождемся и пойдем. Где хоть аккаунты то покупали? Или мучались с регистрацией?

Ответить
Развернуть ветку
Саша Комбаров из Pyrobyte.ru

Вперед Спартак!))

Ответить
Развернуть ветку
Максим Кульгин
Автор

:) зенит оне лав :)

Ответить
Развернуть ветку
Юный Жопошник
и нарвались на аудит

Пророческий заголовок. Пока! Больше так не делайте!

Ответить
Развернуть ветку
Максим Кульгин
Автор

уроки пошел делать? :) смотри, учись хорошо мальчишка. и смени ник, а то дразнить в школе будут

Ответить
Развернуть ветку
Сергей Коновалов
Самое главное — пользоваться мобильным приложением гораздо удобнее, чем сайтом

Спорное утверждение

Про тормоза приложения на некоторых устройствах без всякого аудита ясно что вы налажали. Просто тяжёлая архитектура достойно поднимается на высоких мощностях, на низких тяжело. Но при нынешнем подходе к разработке это в общем норма :))

Ответить
Развернуть ветку
Максим Кульгин
Автор

приложение сложное стало. и размер вырос

Ответить
Развернуть ветку
Герман Блант

Ну хороший опыт, что сказать) Это стольный град!

Ответить
Развернуть ветку
Максим Кульгин
Автор

спасибо :)

Ответить
Развернуть ветку
Вдова Кличко

Болельщики, наверное, совсем сошли с ума от таких новостей!

Ответить
Развернуть ветку
Максим Кульгин
Автор

:)

Ответить
Развернуть ветку
uxvoin

Не читал, тк я по дизайну но глянул и дизайн приложения это позор.
Я срочно заказы ищу, и работу уже год, при этом имея приложение намного круче по дизайну voov.site/kampus а тут выходит дизайнер
в "Русском IT бизнесе" и не нужен вовсе. Кто-то скажет что придирки, не важно как выглядит, главное, что работает! Но я некрасивым дизайном пользоваться просто не буду. Особенный Fail это кнопка "Фильтр" со стрелкой назад.

Ответить
Развернуть ветку
40 комментариев
Раскрывать всегда