Как стать автором
Обновить
70.6
Surf
Создаём веб- и мобильные приложения

Flutter 3: что нового

Время на прочтение12 мин
Количество просмотров11K
Автор оригинала: Kevin Jamaul Chisholm

Я — Евгений Сатуров, Head of Flutter в Surf и ведущий Flutter Dev Podcast. По традиции представляю перевод официальной статьи про свежий мажорный релиз Flutter 3.0, дополненный моими комментариями.

Рады объявить выход Flutter 3. Всего три месяца назад мы анонсировали поддержку Flutter для Windows. Сегодня объявляем, что в дополнение к Windows Flutter теперь работает на macOS и Linux в стабильном канале.

Благодаря совместным усилиям разработчиков, контрибьютивших во Flutter, мы смогли смёрджить 5248 пулл реквеста.

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

Комментарий Евгения Сатурова

Помните март 2021 года? Отличное было время. Flutter впервые после релиза версии 1.0 в 2018 году обновил мажорную версию, и это принесло много долгожданных возможностей, которыми… во многих действительно больших проектах полноценно не могут воспользоваться до сих пор. Миграция на Flutter 2 – нет, увольте, никогда больше.

Возможно, увидев анонс Flutter 3 вас, как и меня, пробил холодный пот. Опять?! Расслабьтесь, в этот раз всё иначе: повышение мажорной версии сигнализирует вовсе не о радикальных переменах в языке или фреймворке.

Теперь Flutter официально поддерживает шесть платформ в стабильном канале. И делает это хорошо.

Почему мы вдохновлены этим, как никогда ранее? Читайте дальше.

Готовы к выходу в прод на всех десктопных платформах

Версии для Linux и macOS вышли в стабильный канал и включают следующие фичи:

Каскадные меню и поддержка панели системного меню в  macOS

Теперь у вас есть возможность создавать на macOS платформенные панели меню с помощью виджета PlatformMenuBar, который поддерживает вставку платформенных меню и управляет содержимым меню приложений на macOS.

Каскадные меню
Каскадные меню

Полная поддержка ввода текста на иностранных языках на всех десктопных платформах

Ввод текста на иностранных языках, включая те, которые для ввода текста используют редакторы метода ввода (IME). К примеру китайский, японский и корейский теперь полностью поддерживаются на всех трёх десктопных платформах, включая сторонние методы ввода: Sogou и Google Japanese Input.

Доступность на всех десктопных платформах

Flutter для Windows, macOS и Linux поддерживает озвучивание текста на экране, упрощённую навигацию и инверсию цвета.

Формат universal binary по умолчанию на macOS

Начиная с третьей версии Flutter, десктопные Flutter-приложения на macOS собираются в формате universal binary и запускаются на старых маках на основе Intel и на новых девайсах на Apple Silicon.

Windows 7/8 получили статус deprecated для разработки

В новом релизе рекомендованную для разработки версию Windows до Windows 10. Мы не блокируем возможность разработки на более старых версиях (Windows 7, Windows 8, Windows 8.1), однако эти версии больше не поддерживаются Microsoft, и наши возможности тестирования на этих релизах ограничены. Мы продолжим поддерживать старые версии насколько сможем, тем не менее, советуем обновить версию ОС.

Важно: Мы не прекращаем поддерживать Flutter-приложения, которые запускаются на Windows 7 и Windows 8. Изменение касается только рекомендованной среды разработки.

Комментарий Евгения Сатурова

Стабильный релиз Flutter for Web мы восприняли с некоторым скепсисом: этому способствовало довольно специфическое позиционирование технологии и ряд сложнопреодолимых технических ограничений — например, крайне серьезные проблемы с SEO. Десктопный Flutter – это уже не технология компромиссов, а решение, которое я могу рекомендовать для создания десктопных приложений.

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

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

Обновления в мобильной версии

Поддержка складных устройств

В релиз Flutter 3 входит поддержка мобильных раскладушек. Совместно с инициатором проекта — Microsoft — мы внедрили новые фичи и виджеты, с помощью которых вы сможете создавать динамичные и красивые приложения на складных устройствах.

В рамках этого проекта мы включили в MediaQuery перечень DisplayFeatures с описанием всех возможных дополнительных элементов геометрии экрана устройства: шарниры, сгибы и вырезы экрана. Кроме того, виджет DisplayFeatureSubScreen теперь располагает на экране дочерние виджеты, не пересекая границ DisplayFeatures, и уже интегрирован в дефолтные диалоги фреймворка и pop-up меню. Таким образом, Flutter уже из коробки знает о существовании этих элементов и учитывает их в работе.

Чтобы увидеть двойные дисплеи Flutter в действии, посмотрите на примеры кода в эмуляторе Surface Duo, а в особенности на один пример с форком Flutter Gallery.

Комментарий Евгения Сатурова

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

Flutter, конечно, является технологией-прослойкой. Теперь в связке «разработчик-фреймворк» появляется ещё фреймворк над фреймворком, благодаря которому и происходит вся кроссплатформенная магия. 

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

Переменная частота обновления на iOS

Во Flutter появилась поддержка переменной частоты обновления на устройствах iOS с дисплеями ProMotion, в том числе на iPhone 13 Pro и iPad Pro. На подобных устройствах Flutter-приложения способны отрисовать экран с частотой обновления до 120 Гц, при том что раньше частота была ограничена 60 Гц. В результате приложение работает плавнее при отображении быстрых анимации вроде скроллинга. Подробнее 

Упрощённые релизы для iOS

Мы добавили новые возможности в команду flutter build ipa, чтобы вам было проще выпускать в релиз своё приложение под iOS. Как только решите выпустить приложение в TestFlight или App Store, запустите flutter build ipa, и фреймворк соберёт архив Xcode (файл .xcarchive) и комплект приложений (файл .ipa). По желанию можете добавить —-export-method ad-hoc, —-export-method development или —-export-method enterprise. Готовый комплект приложений можно загрузить в Apple через macOS-приложение Apple Transport или в командной строке с помощью команды xcrun altool (чтобы ознакомиться с основными инструкциями по аутентификации для App Store Connect API, запустите man altool). Загруженное приложение готово к релизу в TestFlight или App Store. Установив первоначальные параметры проекта Xcode, такие как название и иконку приложения, больше не нужно открывать Xcode, чтобы выпустить приложение в релиз.

Не с первого раза, но Flutter-тулинг побеждает в непростой схватке с тулингом яблочной экосистемы. Последний бастион сложности пал. Теперь можно собирать проект под iOS, и получать на выходе *.ipa, не открывая Xcode. За возможность наконец-то доверить сборку ipa-шки джуниор-разработчику я готов был отдать многое. Да и девопсы будут счастливы: настраивать CI/CD стало чуточку проще.

Обновлённая версия Gradle

Если вы попробуете создать новый проект с инструментами Flutter, то, возможно, заметите, что созданные файлы перешли на свежие версии плагинов Gradle и Android Gradle. Чтобы перейти на них в готовых проектах, нужно вручную поднять версию до 7.4 для Gradle и 7.1.2 для Android Gradle.

Закат эры 32-битных iOS/iOS 9/iOS 10

Как мы уже говорили в феврале 2022 года, в стабильном релизе 2.10 поддержка 32-битных девайсов iOS и версий iOS 9 и 10 подходит к концу. Изменение затрагивает iPhone 4S, iPhone 5, iPhone 5C и устройства iPad 2, 3 и 4 поколений. Flutter 3 — последний стабильный релиз с поддержкой этих версий и устройств на iOS.

Подробнее об изменении: «RFC: поддержка 32-битных iOS девайсов близится к концу».

Обновления поддержки веба

Декодирование изображений

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

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

Жизненный циклы веб-приложений

С новым API жизненного цикла для веб-приложений на Flutter вы получите широкие возможности контроля над процессом первоначальной загрузки Flutter-приложения из серверной HTML-страницы и сможете упростить анализ производительности своего приложения в Lighthouse. Решение применимо ко множеству сценариев, включая популярные запросы:

  • Заставка splash screen.

  • Индикатор загрузки.

  • Отображение простого интерактивного HTML лендинга перед запуском Flutter-приложения.

Подробнее об этом можно почитать в статье «Как кастомизировать инициализацию веб-приложения» на docs.flutter.dev.

Комментарий Евгения Сатурова

Мы пишем мобильные приложения на Flutter вот уже 3,5 года. А ещё у нас есть внутренний проект, на котором мы пробуем всё то, к чему наши клиенты будут готовы лишь «завтра». Да, это проект на Flutter Web.

Без тени сомнения заявляю: API жизненного цикла входит в разряд тех изменений, которые помогают делать качественнее сам продукт, улучшают UX конечного пользователя, а вместе с тем и чистят карму разработчика. Никаких больше «слепых загрузок» и костылей с HTML-лоадерами, ура!

Обновлённый тулинг

Обновлённый пакет линтеров

Выпустили пакеты линтеров версии 2.0. В них вошли:

Приложения, созданные во Flutter 3 с помощью flutter create, автоматически предоставляют доступ наборам линтов версии 2.0. Уже вышедшие приложения, пакеты и плагины мы рекомендуем мигрировать на v2.0 и следовать новейшим и лучшим практикам из мира Flutter. Просто запустите flutter pub upgrade --major-versions flutter_lints и можете приступать к работе.

Большинство свежедобавленных сообщений об ошибках в v2 мы сопроводили автоматическими фиксами. Так что, обновившись до новой версии пакета в файле pubspec.yaml своего приложения, вы сможете запустить dart fix —-apply в кодовой базе и пофиксить большинство ошибок автоматически (хотя некоторые всё же потребуется править вручную). Приложения, пакеты или плагины, пока не использующие package:flutter_lints, можно мигрировать согласно гайду по миграции.

Улучшения производительности

Благодаря пользователю knopp, partial repaint стала доступна на Android-устройствах с поддержкой этой фичи. По результатам локального backdrop_filter_perf бенчмарк-теста это изменение в среднем сократило 90-й  и 99-й процентили времени кадра на Pixel 4 XL в 5 раз. Частичная перерисовка при наличии единичной «грязной» области прямоугольной формы теперь доступна как на iOS, так и на новых Android-девайсах.

Мы смогли дополнительно улучшить производительность анимаций непрозрачности в простых сценариях. В частности, когда виджет Opacity содержит всего один примитив, который необходимо отрисовать, метод saveLayer, который, как правило вызывается из Opacity, можно опустить. В бенчмарк-тестах время растеризации в описанном сценарии сократилось на порядок. В последующих релизах мы планируем применить такую оптимизацию к ещё большему числу сценариев.

Благодаря контрибьютам в опенсорс от пользователя JsouLiang, растровый и UI-потоки движка на Android и iOS получили больший приоритет, чем остальные потоки. К примеру, фоновые потоки сбора мусора Dart VM. По результатам наших бенчмарк-тестов, это решение в среднем сократило время отрисовки кадра на ~20%.

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

Благодаря контрибьютам от пользователя ColdPaleLight, во фреймворке исправлен баг в планировании кадров, из-за которого некоторые кадры выпадали из анимаций на iOS. Спасибо всем, кто сообщил об этой ошибке и предоставил сценарий воспроизведения и видео с пропуском кадров.

Impeller

Наша команда потрудилась над решением проблемы с лагами на iOS и других платформах. В релизе Flutter 3 можно открыть на iOS предпросмотр экспериментального бэкенда для рендеринга под названием Impeller

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

Impeller ещё не готов к выходу в прод и пока далёк от совершенства. Ещё реализованы не все фичи Flutter, но мы уже вполне довольны качеством и производительностью решения в приложении flutter/gallery, и поэтому делимся с вами прогрессом. В частности, самая медленная анимация перехода на новый экран в приложении Gallery занимает в 20 раз меньше времени.

Impeller доступен под флагом в iOS. Чтобы попробовать Impeller, можно передать —-enable-impeller в flutter run или установить флаг FLTEnableImpeller в файле Info.plist на true. Разработка Impeller продолжается на канале master во Flutter. Обновления мы планируем показать уже в следующих релизах.

Комментарий Евгения Сатурова

Если бы каждый релиз Flutter нужно было назвать по названию самой важной и значимой его фиче, то Flutter 3 безальтернативно получил бы название Impeller. Flutter-команда скромничает. Мы уже попробовали Impeller в действии: получили массу впечатлений и огромное удовольствие. На всех проектах, где мы опробовали сборку под новым флагом, никаких неприятных лагов и джанков не замечено вовсе. В прод мы это выпускать, конечно, не будем — подождём отмашки.

Impeller – безусловно самое важное, что случилось с Flutter 3. И никто меня в этом не переубедит.

Встроенная реклама на Android

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

Под капотом Flutter компонует Android View, которые часто называют платформенными, и теперь делает это асинхронно. Это значит, что растровому потоку Flutter больше не нужно ждать, пока отрендерится Android View. Теперь движок Flutter помещает View на экран с помощью текстуры OpenGL, которой он управляет.

Больше интересных обновлений

Material 3

Во Flutter 3 появилась поддержка Material Design 3 — нового поколения Material Design. Во Flutter 3 есть возможность подключить поддержку Material 3. Сюда входят фичи Material You вроде динамического цвета, обновлённой системы цветов и типографики, обновления множества компонентов и новые графические эффекты, появившиеся в Android 12 (к примеру, новый дизайн рипплов и эффект stretch overscroll. Попробовать фичи Material 3 можно в новой кодлабе «Как улучшить своё приложение на Flutter: от скучного к сказочному». Подробнее о том, как подключить новые фичи и какие компоненты поддерживают Material 3, можно прочитать в доках к API. Проследить за нашей работой вы можете по ссылке на Material 3 Umbrella issue.

Расширения тем

Во Flutter теперь можно добавлять что угодно в ThemeData библиотеки Material. Сделать это можно с помощью концепта под названием Theme extensions. Вместо расширения (в контексте Dart) ThemeData и повторного внедрения copyWith, lerp, и других его методов, можно задать расширения ThemeData. Помимо этого, если вы разработчик пакета, вы можете предоставлять доступ к своим ThemeExtensions. Подробнее об этом можно прочитать в flutter.dev/go/theme-extensions. Также можно ознакомиться с примером на GitHub.

Реклама

Мы знаем, что паблишерам важно запрашивать соглашение на персонализацию рекламы и выполнять требования App Tracking Transparency (ATT) от Apple.

Чтобы вам было легче выполнять эти требования, Google предлагает User Messaging Platform (UMP) SDK на замену опенсорсному Consent SDK. В ближайшем релизе GMA SDK для Flutter мы добавим поддержку UMP SDK, чтобы паблишеры могли получать соглашение от пользователей. Подробнее об этом можно почитать на  странице google_mobile_ads на pub.dev.

Изменения без обратной совместимости

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

Если вы используете какие-то из этих API, пожалуйста, ознакомьтесь с гайдом по миграции на Flutter.dev.

Подводя итоги

От лица всей команды в Google мы благодарим вас за ту сумасшедшую работу, которую проделало сообщество, помогая Flutter удержать статус самого популярного кроссплатформенного набора инструментов для создания UI (согласно аналитике компаний Statista, SlashData, и т.д.). Мы рады работать вместе с вами над проектом, который приносит удовольствие и разработчикам, и пользователям!

Комментарий Евгения Сатурова

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

А ещё, мы возобновляем набор в нашу Flutter-команду. Будем рады познакомиться и поработать вместе!

Вакансия Flutter-разработчика в Surf >>


Больше полезного про Flutter — в телеграм-канале Surf Flutter Team. Публикуем кейсы, лучшие практики, новости и вакансии Surf, а также проводим прямые эфиры. Присоединяйтесь!

Больше кейсов команды Surf ищите на сайте >>

Теги:
Хабы:
Всего голосов 17: ↑16 и ↓1+15
Комментарии38

Публикации

Информация

Сайт
surf.ru
Дата регистрации
Дата основания
Численность
201–500 человек
Местоположение
Россия