«Пожалуй, Flutter я позанимаюсь в следующей жизни». Из Android во Flutter: безумие или дальновидный шаг

В IT всё постоянно меняется. Ещё каких-то два года назад никто не воспринимал Flutter всерьёз, а сейчас многие разработчики заинтересовались этим фреймворком. В их числе Евгений Сатуров из Surf. Он был успешным Android-разработчиком, а потом перешёл на Flutter.

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

Как маленькое хобби стало работой

Евгений пять лет работал разработчиком на нативном Android. Однажды на конференции он узнал про Flutter, а через некоторое время решил попробовать написать код.

Flutter — кросс-платформа Google, которую получили в результате рефакторинга Chrome. Разработчики выпилили оттуда практически все: тонны legacy code, кучу непонятных проверок. Chrome потерял возможность рендерить HTML, но стал в 20 раз быстрее. Недолго думая, Google презентовал Flutter в качестве отдельного мобильного фреймворка. Сейчас на Flutter можно писать приложения практически на все доступные платформы.

Surf, в котором Евгений был тимлидом Android-разработчиков, исповедовал только нативную разработку. Поэтому на первых порах Flutter был просто хобби.

После релиза платформы в 2018 году в Surf начались серьёзные разговоры о том, как применить Flutter в продакшене. Так хобби начало становиться работой.

Чтобы наработать опыт и набить руку, команда Евгения переписала на Flutter один из прошлых проектов Surf. Ребята хотели проверить, смогут ли они сделать настоящее приложение сами — с имеющимися у них на тот момент знаниями и ресурсами. Сейчас, когда Евгений смотрит на код, ему кажется, что он ужасен. Но через этот этап проходят все разработчики.

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

Проект был простой: на 15—20 экранов. В нём можно было посмотреть каталог, акции, баланс карты лояльности, оценить покупку, найти ближайший магазин на карте. Также была возможность отсканировать штрих-код товара на полке, чтобы быстро найти его в каталоге.

Пока что этот проект не вышел в публичный релиз — заказчик проводит закрытое тестирование. Тем не менее, это был отличный старт.

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

Фото с мероприятия CodeFestX

Мученики и новаторы — заказчики приложений на Flutter

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

Евгений делит клиентов, которые интересуются Flutter, на две категории.

• Мученики. Они мучительно долго тянут нативные проекты. Тратят время, силы, деньги, ругаются с подрядчиком. Мечтают об оптимизации и новой прекрасной жизни. Речь идет не только о средних по размеру компаниях. Иногда и большие компании располагают ограниченным бюджетом на проекты и ищут кросс-платформенное решение. Так они находят Flutter.
• Новаторы. Быстро перевели проект на какую-то кросс-платформу — но не на Flutter — и столкнулись с проблемами. Они настрадались с новыми технологиями, но идея кросс-платформы для них либо не имеет альтернатив из-за стоимости, либо просто нравится.

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

Подкапотная магия Flutter

Приложения на Flutter отличаются плавностью и разнообразием анимации, рендерингом экрана с частотой до 120fps. При этом от программиста не требуется особых усилий по специальной оптимизации кода. Евгений рассказал, за счëт чего достигается этот вау-эффект.

C технической стороны Android-сборка Flutter-приложения является Single Activity приложением. В нем есть единственный view, в котором и происходит «подкапотная магия». Само приложение подключается туда через NDK. А дальше разработчик уже работает с Dart-кодом так, как будто бы он является частью Android-приложения.

Благодаря Single activity вы получаете возможности проигрывать любые анимации перехода и прочие вещи. Android-разработчики поймут, насколько это облегчает жизнь программисту.

Ещё один плюс Flutter — упрощение жизненного цикла виджетов, который спрятан глубоко под капот. Вместо различных view-элементов, как в Android, у Flutter всё приложение — это виджет, который состоит из абсолютно иерархически идентичных виджетов (1-й экран, 2-й экран и т.д.) Внутри каждого у вас будут другие виджеты, которые представляют собой конкретные элементы: кнопки, checkbox, textview, картинки и т.д.

Механика рендеринга Flutter очень похожа на рендеринг элементов списка в RecyclerView: у каждого элемента есть идентификатор, который вычисляется по хешам состояния. Речь именно про state, про слепок данных, который соответствует элементу интерфейса. Если при очередном такте отрисовки предыдущий state отличается от текущего, это значит, что наш UI нужно перерисовать.

Например, в некотором поле counter, которое относится к состоянию нашего виджета, было число 1, а теперь число 2. Получается, что цифру 1 нам надо перерисовать на цифру 2. В итоге виджет будет отрисован заново. Но если обнаружится соответствие наших state, то виджет никто трогать не будет. Никакой перерисовки не произойдёт.

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

Терминатор против робокопа: чем Dart лучше Kotlin

Android-разработчики часто спрашивают, почему во Flutter используется язык Dart, а не Kotlin, который стал глотком свежего воздуха после Java. Они даже шутят: «Если там надо точку с запятой писать обязательно, то нет, пожалуй, я Flutter в следующей жизни позанимаюсь».

Разработчики уже искали Dart на кладбище проектов Google, а в конце прошлого года внезапно обнаружили его в рейтинге самых быстрорастущих языков в мире по версии GitHub.

Евгений выделяет две причины, почему во Flutter используется Dart, а не Kotlin:

1. Dart — детище Google. Если Flutter-команде Google что-то надо, она идёт к коллегам из Dart-отдела и говорит: «Ребята, сделайте». Они говорят «окей» — вот и всё. Вот эта простота, контроль над языком — это очень большой плюс. Kotlin не является собственностью компании Google — это разработка JetBrains.
2. Dart умеет и в AOT-, и в JIT-компиляцию. Это можно прочувствовать буквально на первом «Hello,  world!» после скачивания Android Studio и установки туда Dart SDK и Flutter SDK. Любые изменения видны на девайсе через 1-2 секунды после нажатия на hot reload. Плюс этот hot reload еще и stateful: даже если вы перезапустите приложение в момент, когда ввели текст в текстовое поле, состояние экрана вы не потеряете.

Сейчас каждая версия, каждая новая итерация приносит что-то новое. И, что ещё интересно, выход новой версии Dart привязан к выходу новой версии Flutter.

В текущих версиях идет процесс Kotlin-изации языка. Это связано с тем, что в Dart-community очень много мобильных разработчиков, которые привыкли к плюсам Kotlin. При этом им нравится Flutter, но не нравится Dart.

К счастью, разработчики Dart воспрянули духом от наплыва людей, которые захотели писать на языке, и решили, что нужно радовать публику. Поэтому время от времени они выкатывают фичи, которые все так просят. К примеру, в версии 2.7 появились extension-функции. Null-Safety уже в работе и выглядит точь-в-точь, как в Kotlin: синтаксис идентичен, с виду всё абсолютно так же. Extensions чуточку отличаются, но несущественно.

Команда Dart идет на диалог на GitHub. У языка есть открытый репозиторий dart-lang, где происходит разработка и предлагаются новые фичи. Есть публичный Roadmap, где перечислены планы на ближайшие версии и обозримое будущее.

Архитектура Flutter: ваниль, хардкор и ящички

Когда появился Android, про архитектуру вообще мало кто слышал. Приложения достаточно долго писались без какой-то глубокой архитектурной мысли: вот activity, пишем там код бизнес-логики. Лет пять назад начали внедрять Model-View-Presenter архитектуру (МVP). Потом Model-View-View Model (MVVM), потом другие архитектуры.

Фото Сергея Короткова

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

• Vanilla — для тех, кто не заморачивается с архитектурой и использует стандартные подходы, которые предлагает фреймворк. Суперпримитивная архитектура для максимально простых приложений. Подойдёт для того, чтобы сделать что-то несложное — какие-то обучающие сэмплы.
• Архитектура-блок — в основе концепции лежит идея разбиения приложения на ящички с бизнес-логикой и построение связей между ними.
• Redux — хардкорный вариант, который пришёл во Flutter из веба. У такого подхода уже есть много вариаций, например Fish Redux. В основном его используют ребята из Поднебесной со всеми вытекающими последствиями в виде репозиториев на иероглифах и отсутствия внятной информации.

Во Flutter-команде Surf есть собственный архитектурный модуль. Он базируется на идее, которую ребята позаимствовали из Android-проектов. На его основе можно очень быстро развернуть и начать писать приложение с удобной архитектурой.

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

В чем кайф и выгода для разработчика

Flutter — новая технология. На рынке труда ничтожно мало разработчиков: по ключевому слову «Flutter» — около 160 резюме на всё СНГ. Из них подавляющее большинство — самоучки и люди с самым разным бэкграундом. В команде Surf есть люди, пришедшие во Flutter из React Native, Spring, Delphi и т.д. Это отличный шанс войти в новую технологию на начальном этапе и быстро стать востребованным специалистом. Конкуренция почти нулевая.

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

Изображение Евгения Сатурова

Хочу во Flutter, что дальше

Бытует мнение, что, изучив Dart и фреймворк, можно быстро начать писать Flutter-приложения любой сложности. Это серьезное заблуждение. Для сложных кросс-платформенных проектов нужны знания в iOS и Android. Всегда будут какие-то платформенные возможности устройств, с которыми нужно работать по-особенному, писать уникальный код для управления интерфейсами девайса. Изучение всех этих нюансов требует значительного количества времени.

Если вы решите дать Flutter шанс, то мы рекомендуем начать с пары простых вещей.

Во-первых, нужно изучить Dart. Синтаксис похож на все остальные объектно-ориентированные языки. Например, перейдя с Java на Dart вы, скорее всего, даже немножко воспрянете духом. С другой стороны, перейдя с Kotlin на Dart, вы почувствуете лёгкий даунгрейд.

Рекомендуем посмотреть Language Tour на официальном сайте Dart — это поможет быстро сориентироваться, познакомиться с основными конструкциями и особенностями языка. Также там есть DartPad (онлайн Code Editor), где можно запускать сниппеты и смотреть результаты.

Во-вторых, познакомьтесь с Flutter. У фреймворка просто феноменальная документация, написанная с большой любовью. Её можно читать, как книгу. Переходя по ссылкам и якорям туда-сюда, вы постепенно изучите всё, что нужно для старта. Есть даже Cookbook c конкретным примерами: поработать с сетью, кинуть запрос на сервер, скачать картинку, показать её, поработать с GPS, с камерой и так далее — всё подробно описано.

У Flutter есть публичное хранилище библиотек, и сообщество активно им пользуется. Если вам не удалось найти подходящий пакет там, значит, его попросту нет.Ежедневно там появляются десятки новых библиотек самого разного качества. Чтобы отделить зерна от плевел, Google ввёл две программы сертификации.Сертификация доверенных авторов — кандидаты выполняют ряд требований, проходят проверку и получают соответствующую отметку в профиле.Бейджик для лучших библиотек — награда за качественный материал, некий state of art. Библиотеки оцениваются по большому чек-листу, автор должен иметь статус доверенного разработчика.В хранилище — порядка 15-20 тысяч библиотек, и доверенных авторов достаточно много. Но лучших библиотек — около 15 штук на весь паб.

Хотите узнать больше про технические фишки Flutter — советуем прочитать вводную статью Евгения Сатурова и Артёма Зайцева «Flutter — новый взгляд на кроссплатформенную разработку».

Чтобы быть в курсе трендов Flutter и поближе познакомиться с комьюнити, рекомендуем подписаться на Flutter Dev Podcast, который Евгений Сатуров ведёт с коллегами.