Как мы полностью изменили своё мнение о Flutter

В последнее время, в свете закрытия доступа в популярные сторы для российских компаний, многие представители бизнеса находятся в поиске новых решений, как доставить своё приложение до пользователей. Пробуют разное: российские сторы, выкладку Android application package (APK) на сайте компании, замену мобильного приложения на progressive web app (PWA) или веб-приложение. В связи с этим, растёт спрос на технологии, которые помогают бизнесу разработать приложение (мобильное или веб) быстрее и дешевле.

Да, мы опять говорим о Flutter. А точнее о его новой версии — 3.0, которая, уверены, станет прорывом для многих, ведь Google в ней довёл свою кроссплатформенную технологию практически до совершенства.

• Чем хороша кроссплатформа для бизнеса
• Что нового во Flutter 3.0
• Flutter — для мобильного приложения, десктопа и веба

Мы начали работать с Flutter в 2019 году, почти сразу после того, как Google презентовал эту кроссплатформу. За это время мы успели реализовать более 15 проектов разной направленности и убедились на собственном опыте, что Flutter подходит для решения самых разных задач:

• для банка: на нём можно разработать приложение, соответствующее всем требованиям безопасности. Например, мы реализовали такое b2b приложение для Росбанка и b2c решение для СМП Банка.
• для ритейла: детально проработать UX, удобный юзер-флоу и реализовать дизайн, не отличимый от нативного. Мы использовали Flutter для создания приложений самой большой сети аптек в России — Ригла.
• для корпораций: распределить сотрудников по ролям и отслеживать их эффективность. На Flutter мы написали внутреннее приложение для торгово-производственной компании и KFC.
• для медиа: обеспечить качественное воспроизведение и сложную анимацию в высоконагруженном сервисе. Так, на Flutter, мы сделали видеостриминговое приложение The Hole.

Наш большой и дружный отдел Flutter-разработки развивает и поддерживает Flutter-сообщество в России. Ребята записывают подкасты, пишут технические статьи и создают собственные стандарты архитектуры в открытых репозиториях. И конечно, пристально следят за всеми обновлениями и тут же тестируют и применяют их в проектах наших клиентов.

Итак, мы создавали разные проекты на Flutter и успели оценить его по достоинству. Но недавно вышла новая версия фреймворка — 3.0, которая полностью перевернула наше представление о технологии.

Если коротко — это революция. Теперь на Flutter можно создавать не только качественные мобильные приложения, но и веб, и десктоп-приложения. О том, почему это сейчас особенно актуально, мы писали в этой статье о Progressive Web App (PWA). Но обо всём по порядку.

Мы уже писали о том, что кроссплатформа — это набор инструментов, который позволяет создать одно приложение сразу для двух операционных систем: iOS и Android. И вот в чём её плюсы:

• Экономичность. Бизнес тратит меньше времени и денег на разработку, потому что Flutter-разработчик создаёт одну кодовую базу сразу для двух ОС. Стоимость такой разработки на 40% меньше, чем создание двух нативных приложений. При том, что для пользователя нет никакой визуальной и функциональной разницы.
• Time-to-market короче. Для запуска Flutter-приложения потребуется меньше времени, чем на запуск нативного. Как следствие, оно начнёт приносить прибыль гораздо быстрее.
• Нет ограничений в дизайне. Это важный пункт для любого бизнеса, который дорожит своей уникальностью. Flutter позволяет реализовать любой дизайн, включая сложную анимацию. О том, как мы работали с анимацией в приложении The Hole, читайте в нашем кейсе.
• Безопасность. Код Flutter-приложение преобразуется в нативный, который нельзя восстановить с помощью реверс-инжиниринга.
• Интегрировано с нативными возможностями. В приложении на Flutter можно использовать Touch и Face ID, сканер отпечатка пальца, GPS и камеру. Точно так же, как и в нативном приложении.

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

2. Теперь Flutter официально поддерживает шесть платформ — и делает это хорошо. На Flutter теперь можно создавать решения для Windows, macOS и Linux. Кроме того, он стал более доступным — поддерживает озвучивание текста на экране, упрощённую навигацию и инверсию цвета.

Во Flutter 3.0 появился новый инструмент — Impeller. Это экспериментальный инструмент, который значительно улучшает работу анимации и рендеринга. Сейчас он доступен только для iOS, но тесты команды Surf показывают действительно отличные результаты в росте производительности приложения. Это хорошая новость для всех мультимедийных проектов и высоконагруженных стриминговых сервисов. В видеостриминге, как нигде, важна высокая производительность, а также качественное и быстрое воспроизведение видео. Раньше у Flutter с этим были некоторые сложности, но в свежей третьей версии инструмент Impeller полностью решает проблемы частоты смены кадров.

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

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

Во Flutter 3.0 теперь доступна возможность подключить поддержку Material 3. Это фичи Material You, такие как:

• динамический цвет;
• обновлённая система цветов и типографики;
• обновления множества компонентов и новые графические эффекты, появившиеся в Android 12.

Например, новый дизайн рипплов — эффект волнового распространения анимации при нажатии и эффект stretch overscroll — эффект растягивания границ прокрутки.

Что это значит? Material You — новая версия концепции Material Design, которая используется для создания дизайна мобильных приложений. Возможность поддержки самой актуальной версии означает, что приложение теперь будет выглядеть современно и вы сможете реализовать в нём самые передовые «фишки» дизайна.

Flutter стал автоматически обнаруживать и использовать ImageDecoder API в поддерживающих его браузерах. Этот инструмент предназначен для преобразования закодированных изображений (в форматах PNG, JPEG, WEBP, GIF или HEIF) в объекты Drawable или Bitmap — форматы хранения растровых изображений.

Новый API асинхронно декодирует изображения из главного потока с помощью встроенных в браузер кодеков изображений. Такое решение ускоряет декодирование изображений в два раза и не блокирует главный поток. Это очищает приложение от лагов, обычно возникающих при загрузке изображений. Теперь большинство браузеров на базе Chromium (Chrome, Edge, Opera, Samsung Browser) поддерживают эту возможность.

Что это значит? Изображения в приложении будут загружаться быстрее, а их качество будет лучше.

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

Что это значит? Теперь мы можем визуализировать процесс загрузки веб-приложения до момента его запуска. Пользователь больше не будет смотреть на белый экран. Новая возможность даёт больше контроля над начальной загрузкой веб-приложения с HTML-страницы на стороне сервера. К тому же, она упрощает анализ производительности приложения в Lighthouse — инструменте для измерения качества веб-страниц.

Теперь Flutter поддерживает мобильные раскладушки. Благодаря сотрудничеству с Microsoft Google, теперь доступны новые фичи и виджеты, с помощью которых можно создавать приложения на складных устройствах.

Что это значит? Даже на самых новых моделях телефонов-раскладушек приложение будет работать и отображаться корректно.

Добавились новые возможности в команду flutter build ipa, чтобы было проще выпускать в релиз приложение под iOS.

Что это значит? Теперь можно собирать проект под iOS, и получать на выходе *.ipa, не открывая Xcode. Саму сборку можно доверить джуниор-разработчику, да и девопсы будут счастливы: настраивать CI/CD стало немного проще.

Pro Motion даёт возможность делать приложение ещё более плавным на самых современных iOS девайсах.

Узнать больше о новых изменениях во Flutter можно в нашей статье на Хабре.

Недавно мы писали о прогрессивных веб-приложениях и о том, способны ли они стать полноценной заменой привычным мобильным. Напомним:

• веб-приложение работает через браузер;
• десктопное работает локально на устройстве.

Теперь с помощью Flutter 3.0 можно создавать все три версии своего цифрового продукта: мобильное, веб и десктопное приложение.

Раньше Flutter позволял сокращать сроки и стоимость разработки мобильного приложения, благодаря единой кодовой базе. Это подтверждают наши кейсы с СМП Банком и Мособлбанком, а также сетью аптек Ригла (когда мы создали сразу 6 приложений для 3 брендов сети).

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

Признаться, стабильный релиз Flutter for Web мы восприняли с некоторым скепсисом. Этому способствовало специфическое позиционирование технологии и ряд сложнопреодолимых технических ограничений — например, серьёзные проблемы с SEO. Выбирая Flutter для проекта, нацеленного на веб, нужно понимать, что ваш продукт соответствует требованиям технологии.

В случае с десктопом нет жесткой привязки к технологии. Она не ограничивает, а наоборот даёт дополнительные возможности. Простота нативных интеграций, действительно впечатляющие библиотеки UI-компонентов (Windows, macOS), готовые решения для управления мультиоконностью (window_manager), утилиты для сборки десктопных артефактов (msix) — всё это говорит о том, что Flutter не просто запустит мобильное приложение на десктопе, как это уже умеют делать Windows 11 и macOS, он поможет создать настоящее десктопное приложение.

Потому что основная часть кодовой базы проекта будет унифицирована (80-95%, в зависимости от специфики проекта). Адаптации будут необходимы, как по платформенным фичам, так и по UX. Но это будут всё же именно адаптации, а не переписывание приложения с нуля.

• Такой проект будет удобно поддерживать.
• Не нужно будет собирать 3 разные команды под каждую платформу. Достаточно иметь в одной команде несколько разработчиков с компетенциями в этих платформах. Они будут помогать друг другу по платформенным задачам, а общий пул унифицированных задач делить поровну.
• Код будет стабильным — он будет тестироваться один раз и под все платформы, все баги будут правиться одновременно на всех платформах.
• Поддержка станет проще — все проблемы будут решаться раз и навсегда. Не нужно будет передавать информацию обо всех правках по всем платформам.
• Проект выйдет на рынок на 30-40% быстрее и обойдётся на столько же дешевле.

Мы создаём мобильные приложения более 12 лет, а на Flutter — уже больше 4 лет. Постоянно следим за развитием кроссплатформы и сами активно участвуем в её развитии. И, чем больше развивается технология, тем лучше становится конечный продукт — приложение для банка, ритейла или для управления корпорацией. В основе философии Flutter всегда лежала идея универсальности. А теперь, с появлением возможности создавать на этом фреймворке мобильное приложение, десктоп и веб и вовсе открывает новые горизонты планирования для любого проекта.