Еволюція Flutter: що нового в релізах і як це вплине на ваші проєкти

💡 Усі статті, обговорення, новини про Mobile — в одному місці. Приєднуйтесь до Mobile спільноти!

Я — Flutter-розробник, який, як і більшість колег, що використовують Flutter, займається створенням кросплатформних мобільних застосунків. Цій діяльності я присвятив останні чотири роки свого професійного шляху. Як і більшість розробників, починав з роботи у невеликих компаніях та займався фрилансом, а зараз працюю в Langate. Тут я зустрів чимало людей, які захоплюються своєю роботою та постійно розвиваються, що спонукало й мене відкривати для себе нові обрії. Одним із перших кроків у цьому напрямі стала ця стаття.

У ній я хочу розглянути динаміку та зміни, які відбувалися з фреймворком протягом останніх релізів. Спочатку перевірив офіційні канали команди. У цьому контексті я виділив останні ключові релізи Flutter 3.19, 3.22 та 3.24. Класичних статей у стилі перекладу прес-реліза є досить багато, що надихнуло мене подивитися на цю задачу під іншим кутом. Я вирішив об’єднати інформацію про ці релізи в одній статті.

Перше, що можна зробити, отримавши у своє розпорядження дані про три релізи, — це спробувати їх порівняти. Так би мовити, ознайомитися з деякими цікавими цифрами. Варто зазначити, що release notes поділено на зміни безпосередньо у Flutter, а також на зміни у його поточному рушії Impeller.

Динаміка розвитку Flutter залишається майже незмінною: як фреймворку, так і його рушію приділяється однакова увага. Також можна помітити, що більшість змін спрямовані на Android-компонент рушія, що пов’язано з реалізацією Vulkan-бекенду Impeller для Android. Наразі команда, яка розробляє Impeller для Flutter, оголосила: версія для Android (з використанням Vulkan) досягла стану «feature complete». Тобто всі основні заплановані функції тепер реалізовано. Водночас суттєві зміни відбулися і для вебнапряму. Вони пов’язані з впровадженням WebAssembly, про яке я згадаю далі.

За цей рік до спільноти контриб’юторів додалося загалом 145 розробників. Можливо, хтось із них зараз читає цю статтю — поділіться своїм досвідом у коментарях, впевнений, багатьом буде цікаво це обговорити. Судячи з наведених цифр, в межах однієї статті неможливо висвітлити всі зміни, які відбулися з цими релізами. Тому я обрав певний «топ» нововведень, про які розповім далі, а вас закликаю додавати у коментарях ті, що сподобалися саме вам.

Почнемо з Gemini Google AI Dart SDK. Не буду детально пояснювати, чому це гарна новина, а краще наведу практичний приклад. Він є у статті «How to Speed Up Flutter App Localization With AI» від команди LeanCode. Там описано важливість локалізації, проблеми традиційного підходу до неї, та запропоновано AI-рішення для автоматичного перекладу. У статті наведено покроковий приклад інтеграції AI-інструментів у Flutter-проєкт: від налаштування проєкту й організації ресурсів до підготовки даних для автоперекладу. Сам факт запуску Google AI Dart SDK відкриває шлях до легшого створення міжплатформних застосунків, що використовують штучний інтелект.

WebAssembly (Wasm) став доступним у стабільній версії Flutter, починаючи з 3.22. Раніше Flutter-вебзастосунки компілювалися у JavaScript, що могло спричиняти проблеми з продуктивністю, особливо у складних застосунках з анімацією та багатим візуальним наповненням. Завдяки переходу на Wasm продуктивність значно підвищується, наближаючись до рівня мобільних і десктопних застосунків. Розробники створили новий бекенд компілятора Dart для генерації коду під WasmGC, а також забезпечили інтеграцію рушія рендерингу Flutter з Wasm, покращуючи взаємодію між логікою застосунка та відтворенням графіки.

Порівняння швидкості відтворення JavaScript і Wasm для демонстраційної програми

Також хочу згадати про Widget state properties, які з’явилися у версії Flutter 3.22. Це оновлення зачепило майже всі проєкти, з якими мені доводилося працювати. Раніше я використовував MaterialState, що надавав логіку для обробки різних станів віджета. Наприклад, «hovered», «focused» та «disabled». Зміни призвели до необхідності оновлювати код: якщо ви робите це один або два рази — не страшно, але що більше проєктів потребують оновлення, то більше це дратує.

Варто зауважити, що зміни стосуються переважно назв, а не функціоналу. За словами розробників, це було зроблено тому, що дана функціональність корисна не лише в межах Material, а й у базових віджетах та Cupertino. Її перенесли за межі Material, а різні класи MaterialState перейменували на WidgetState, не змінюючи їхньої поведінки.

Багато хто з мого оточення пропустив наступну тему — Transformation of assets using Dart packages, яка також з’явилася у версії 3.22. Тепер ви можете налаштувати свій проєкт так, щоб під час збірки ресурси автоматично перетворювалися за допомогою сумісних Dart-пакетів. Для цього у файлі pubspec.yaml достатньо вказати ресурси, які потрібно перетворити, та відповідний пакет-трансформатор.

Завдяки цьому підходу можна попередньо компілювати SVG-файли в оптимізовані двійкові файли, які потім можна відображати за допомогою пакета vector_graphics. Користь від цього залежить від кількості ресурсів, які ви використовуєте у своєму проєкті. З мого досвіду це досить поширений випадок. Тому я дуже радий, що такий варіант з’явився. Раджу й вам спробувати його у своїх проєктах — інструкції можна знайти в офіційній документації за посиланням.

Реліз Flutter 3.24 приніс низку нових віджетів, які можуть бути корисними у вашій роботі. Серед них — PinnedHeaderSliver та SliverResizingHeader. Використовуючи ці нові Sliver, ви можете створювати заголовки, які плавають, залишаються закріпленими або змінюють розмір під час прокручування користувачем. Вони схожі на існуючі фрагменти SliverPersistentHeader та SliverAppBar, але мають простіший API.

Пакет two_dimensional_scrollables представив віджет TreeView разом із кількома супутніми класами для створення ефективних дерев прокручування, що можуть переміщуватися у всіх напрямках у міру зростання дерева. Я особисто стикався з проєктами, де цей віджет міг стати у пригоді, тож тепер у вас ще більше інструментів для реалізації візуалізації складних даних.

Цікаво виглядає й CarouselView, який також з’явився у Flutter 3.24. Це «Uncontained» макет — прокручуваний список елементів, де перший та останній елемент мають динамічні розміри й змінюються під час гортання. Заздалегідь додам, що в останньому релізі ми побачимо покращення цього віджета, що зробить його ще більш привабливим для використання.

Традиційно для всіх релізів Flutter можна спостерігати багато змін, пов’язаних із продуктивністю. Цього разу мою увагу особливо привернула значна кількість покращень у взаємодії з GPU. Я не вдаватимуся в деталі в межах цієї статті, але хочу підкреслити, що це чудова тенденція, яка демонструє стабільне зростання в цьому напрямі та дозволить поліпшити продуктивність ваших застосунків. Рекомендую додатково ознайомитися з такими темами:

• GPU tracing.
• Flutter GPU preview.
• Vulkan backend feature complete on Android.
• Blur performance improvements.
• Stencil-then-Cover.
• Platform view performance.

Значно цікавішим для мене видався Google Mobile Ads (GMA) SDK, який увійшов до релізу 3.22, а також підтримка відеореклами (Video ad monetization support) у релізі 3.24. Вихід Google Mobile Ads for Flutter версії 5.0.1 не лише покращив User Messaging Platform (UMP) SDK, а й суттєво розширив перелік посередників (Unity, Meta, AppLovin, Iron Source, Mintegral, Pangle, DT Exchange, InMobi, Liftoff). Завдяки цьому з’являється додаткова можливість збільшити дохід від застосунку за допомогою розширених можливостей монетизації та спрощеного впровадження реклами.

На додачу до GMA було додано ще один плагін — Interactive Media Ads (IMA) SDK. IMA спрощує інтеграцію мультимедійних оголошень у ваші сайти та застосунки. Цей SDK дозволяє отримувати рекламу з будь-якого сервера, сумісного з VAST, і керувати відтворенням оголошень у ваших застосунках.

Deeplinking web validator — ще одна функція, яка заслуговує на увагу. У Flutter 3.19 до DevTools було додано ранню версію валідатора для deep links. На жаль, наразі цей функціонал працює не для всіх платформ, але команда запевняє, що в майбутньому інструмент буде вдосконалено.

Починаючи з Dart 3.4, який вийшов разом із релізом Flutter 3.22, з’явилася ще одна цікава можливість — макроси для генерації коду. На момент написання статті актувальним є лише JsonCodable. Наразі в документації зазначено, що цей макрос є експериментальним і працює, починаючи з версії Dart 3.5. Принцип дії макроса подібний до генерації коду, за винятком того, що система макросів вбудована в Dart та працює у реальному часі. Це означає, що під час редагування та запуску коду зміни застосовуються миттєво, повністю підтримуючи існуючі робочі процеси, включно з гарячим перезавантаженням. На скрінкасті можна побачити, як це виглядає на практиці:

Скрінкаст, що демонструє досвід використання макросу: спочатку не існує завершення коду toJson, але після додавання @JsonCodable до класу завершення коду toJson з’являється негайно

Також команда розробки зазначає, що працює над стабільним випуском макросу JsonCodable, а повна стабільна реалізація мовної функції зі створення власних макросів очікується впродовж 2025-го. Оскільки світ вже побачив новий реліз Flutter 3.27, ви можете перевірити це самі. Або зачекати на наступний огляд, у якому я обовʼязково згадаю цю тему. Мені цікаво дізнатися, чи будете ви користуватися макросами, чи залишитеся на підході з кодогенерацією. Напишіть про це, будь ласка, у коментарях.

Очевидний висновок полягає в тому, що Flutter/Dart та пов’язана з ними екосистема рішень продовжує активно розвиватися не лише завдяки роботі внутрішньої команди розробників, а й завдяки спільноті, яка постійно зростає. Щомісяця до кола контриб’юторів приєднується все більше розробників, а інструмент еволюціонує, додаючи нові способи оптимізації та інструменти для покращення досвіду створення кросплатформних застосунків. Якщо ви плануєте й надалі працювати з Flutter, вам однозначно слід стежити за цим.

Наприкінці минулого року ми також побачили новий реліз Flutter 3.27, про який я докладніше розповім у наступній статті. Вже зараз можу сказати, що ми розглянемо чимало нових Cupertino-віджетів, приємні оновлення для віджетів, які ви вже знаєте, покращення Impeller та зміни в екосистемі пакетів.

P.S. Після публікації статті, зʼявилася важлива інформація повʼязана з макросам, як вірно зазначили у коментарях, робота над ними була призупинена, якщо вас як і мене цікавила ця тема, то можете ознайомитись з причинами цього тут, або у моїй наступній статті присвяченій Flutter 3.27.