Flutter — кроссплатформенный фреймворк, который разрабатывается и поддерживается Google. На нем можно создавать практически любые приложения, сэкономив при этом до 40% бюджета относительно нативной разработки. Рассказываем, как это работает и почему бизнесу нужно переходить на Flutter.

Flutter в 2020 году: что изменилось

Flutter — молодой фреймворк: версия 1.0 вышла всего два года назад, поэтому разработчики видели много его «детских болячек». Проблемы с производительностью и отображением шрифтов, падения движка, непохожие на натив элементы iOS — всё это было исправлено в многочисленных обновлениях. Flutter обзавёлся полезными фичами, такими как null-safety и extensions, сообщество создало почти 13 тысяч библиотек. Приложения на этом фреймворке уже практически не отличаются от нативных.

Flutter развивается: по данным Stack Overflow, в 2019 году он занимал 14 место по популярности, а в 2020 — уже девятое. Google ведёт YouTube-канал, где учит разработчиков тонкостям работы с фреймворком. Во Flutter поверили Alibaba, Ebay, BMW и Tencent, на нём работает Google Pay и продукты Яндекса: Про, Лавка, Go.

Всё это говорит о том, что в 2020 году нужно обратить внимание на Flutter.

Критерии выбора технологии для мобильного приложения

Четыре важнейших критерия при выборе технологии для мобильного приложения:

• гибкость и доступность функций операционной системы,
• стоимость,
• производительность
• скорость разработки.

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

• низкая производительность на слабых устройствах;
• обращение к сторонним библиотекам-оберткам — риск появления непредвиденных ошибок;
• проблемы с реализацией удобного пользовательского интерфейса с характерным для операционной системы элементами.

Проблемы вызваны архитектурой, которая примерно одинакова для большинства кроссплатформенных фреймворков. У Android и iOS разные нативные модули, и для связи с ними фреймворки используют специальные мосты — к примеру, как JS-bridge у React Native. Система работает неидеально, поэтому на каждой платформе приложение отображается и ведет себя по-разному.

Flutter выбрал другой путь: он сам рисует каждый пиксель и контролирует анимацию. За это отвечают два набора виджетов: Material для Android и Cupertino для iOS. В итоге приложения на нём максимально схожи с нативным — и среди кроссплатформенных приложений Flutter уверенно идет к лидерству.

На родном языке OC — Swift для iOS и Kotlin для Android — можно написать практически любое нативное приложение — серьёзных минусов или ограничений нет. Но придётся дважды создавать бизнес-логику, верстку и интерфейс. Причём развитием и поддержкой должны заниматься тоже два отдела. Это значительно растягивает бюджет.

Возможности, анимации и элементы интерфейса кроссплатформенных приложений на Flutter такие же, как у нативных. Но есть ряд плюсов:

• Экономия. Большую часть кода можно использовать на обеих платформах без изменений — это экономит до 40% бюджета за счет скорости разработки.
• Безопасность. В релизной сборке код компилируется в нативный, не читаемый человеком. Поэтому реверс-инжиниринг приложения на Flutter гораздо сложнее, чем аналогов на Java, Kotlin или React Native.
• Меньше ошибок при тестировании: фактически вы тестируете одно приложение вместо двух.
• Быстрый выход приложения на рынок. Высокая скорость разработки и тестирования позволяют запустить одно приложение на Flutter быстрее, чем два нативных.

Возможности Flutter мы разбирали более подробно в другом посте — рекомендуем почитать.

Flutter vs натив: сравнение стоимости

Мы попросили Android-, iOS- и Flutter-разработчиков оценить типичные для e-commerce фичи в story points — относительных единицах, которые показывают сложность задачи.

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

Теперь посчитаем экономику проекта, а не фич. Представим, что две компании работают над одним и тем же проектом в абсолютно одинаковых условиях, но одна работает с нативом, другая — с Flutter.

Конфигурация команд

Native — 1 дизайнер, 3 Andriod-разработчика, 3 iOS-разработчика, 1–2 QA-инженера

Flutter — 1 дизайнер, 4 разработчика, 1 QA-инженер с подключением второго на последний спринт MVP

Трудоёмкость мы считали по часам и при условии, что день отработан идеально: сотрудник не отвлекался на переговоры и другие задачи. Разработка идёт в два этапа.

Экономика проекта на Flutter. Ячейка — это неделя. Цифра в ячейке — ставка

В данном примере Flutter экономит нам 45,6% на разработке, 70,5% на QA с учетом использования автотестов в обеих командах, а также 33,3% на дизайне приложения. Задачи бывают разными, поэтому кто-то сэкономит 20%, кто-то — 40%. Но суть одна: стоимость разработки на Flutter ниже за счёт высокой скорости разработки.

3 причины, почему Flutter дешевле нативной разработки

Единая кодовая база для двух платформ. Flutter позволяет рисовать дизайн и писать код один раз. Их можно использовать одновременно и на Android, и iOS — с минимальными изменениями.

Бизнес-логика, вёрстка и интерфейс тоже остаются практически без изменений. Из-за этого сокращается время на тестирование — примерно в 1,3–1,5  раза.

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

Hot-Reload. Фреймворк поддерживает Hot-reload: разработчики мгновенно видят изменения прямо в приложении. Это увеличивает производительность труда программистов.

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

Примеры приложений на Flutter

Мы в Surf собрали целый Flutter-отдел и уже реализовали крупные проекты на этой технологии.

Приложение для Росбанка

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

Как помог Flutter. Помогли построить команду продуктовой разработки инхаус и снизить издержки на поддержку и развитие приложения.

Результат. Приложение успешно прошло пен-тесты — проверки службой информационной безопасности банка. Пользователям высоко оценивают новое приложение: ставят пятерки в сторах и пишут позитивные отзывы.

Ссылка на кейс

KFC DSR

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

Как помог Flutter. Сильно снизил бюджет на разработку. Это внутренний продукт для сотрудников: сотрудники устанавливают приложение на личные устройства. Причём как линейные сотрудники в ресторанах, так и территориальный менеджеры. У территориальных менеджеров в основном айфоны. Получается, что 95% пользователей — Android, а 5% — iOS, но среди этих 5% — очень важные пользователи системы — управленцы. Если бы не Flutter, то пришлось бы разрабатывать и поддерживать отдельное iOS приложение ради этих 5%. А так кроссплатформенное приложение на Flutter идеально вписалось в этот кейс.

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

Ссылка на кейс

Приложение для аптечной сети Ригла

Сеть объединяет три бренда, и каждому нужно приложение под iOS и Android — в сумме это шесть приложений. Разрабатывать каждое было бы слишком долго и дорого, поэтому мы предложили работать с Flutter.

Как помог Flutter. На единой кодовой базе созданы шесть приложений. Разработка заняла всего пять месяцев: от этапа проектирования до выхода в релиз.

Результат. Приложение запустилось вовремя: ровно в обозначенный на старте проекта срок. Средний чек в мобильном приложении в разы выше, чем при покупках в офлайне. Хорошие отзывы пользователей и высокие оценки в сторах.

Ссылка на кейс

Вывод

• Flutter победил главные болячки других кроссплатформенных технологий: плохой дизайн, проблемы с производительностью и безопасностью. Приложения на Flutter практически не отличаются от нативных.
• Разработка приложений на Flutter экономит до 40% бюджета за счёт высокой скорости разработки и тестирования и меньшего размера команды разработчиков.
• Фреймворк поддерживают Google и другие гиганты, он регулярно обновляется, а сообщество вокруг него стремительно растет.

Всё это укрепляет в мысли, что будущее мобильной разработки — за Flutter.