Как работает Flutter

• Кирилл Одещенко, спикер курса, рассказывает о работе Flutter.  

• Основные понятия: виджет, стейт, стейт метод.  

• Фреймворк уведомляется об изменении состояния виджета для перерисовки интерфейса.  

• Обзор уровней и слоев фреймворка, начиная с датовой реализации.  

• Стандартные библиотеки: материалы Купертина и другие.  

• Библиотека рендеринга отвечает за отрисовку пользовательского интерфейса.  

• Библиотеки анимации, поти и гестерс.  

• Анимация работает на канвасе, гестерс обрабатывает события платформы.  

• Библиотека канвас реализует базовые абстракции для фреймворка.  

• Исходный код фреймворка доступен для изучения.  

• Фреймворк можно написать на любом языке благодаря многоядерной архитектуре.  

• Энджен - сторонняя библиотека, хранящая рейтинг на канвасе.  

• Польский интерфейс отрисовывается с помощью библиотеки C++ и C++.  

• Библиотека отвечает за управление виртуальной машиной Dart, разбиение на изоляторы, запуск изолятов, системные события и платформенные каналы.  

• Пример работы на Android: запуск фреймворка Flutter, который вызывает методы Dart и отрисовывает интерфейс.  

• Нативные плагины и разбиение на треды реализованы одинаково на всех платформах.  

• Библиотека Skia разработана Google и используется в Chrome и Flutter.  

• Flutter и Chrome работают на одном движке, что обеспечивает высокую производительность.  

• Flutter был создан в 2014 году для рендеринга HTML и CSS.  

• Идея заключалась в создании высокоуровневой абстракции для разработчиков.  

• Flutter использует Skia для отрисовки интерфейса, что обеспечивает высокую производительность.  

• Flutter имеет состояние и общается с платформой через метод и ивент-каналы.  

• Жизненный цикл нативного приложения и виджета в Flutter различается.  

• Flutter общается с платформой нативно, используя A-делегат и Flutter View.  

• Flutter не является однопоточным, как часто ошибочно считают.  

• Внутри фреймворка есть четыре потока: платформенный, UI, GPU и input/output.  

• Разделение на потоки позволяет оптимизировать работу и избежать блокировок.  

• В Flutter существуют три дерева: виджеты, элементы и рендер-объекты.  

• Виджеты описывают пользовательский интерфейс декларативно.  

• Библиотека Flutter предоставляет высокоуровневую абстракцию для работы с польским интерфейсом.  

• Лайф ск управляет состоянием виджетов и элементов.  

• Дерево элементов и рендер объектов отвечает за отрисовку и управление состоянием.  

• Лайф ск разбивает связь на чил и прокидывает ограничения для чилда.  

• Пример с хедером: создается элемент и рендер-объект.  

• Элемент управляет связью между виджетом и рендер-объектом.  

• При обновлении интерфейса элемент проверяет изменения и перерисовывает виджет.  

• Вложенная структура: виджет, элемент, рендер-объект.  

• Элемент управляет виджетом и рендер-объектом.  

• Обновление интерфейса происходит при изменении состояния виджета.  

• Отрисовка текста реализована с помощью библиотеки лип-тексти.  

• Лип-тексти обеспечивает более быструю и качественную отрисовку.  

• Команда Flutter перешла на лип-тексти около двух лет назад.  

• Элемент проверяет изменения и обновляет рендер-объект.  

• Рендер-объект получает новое состояние виджета и перерисовывает интерфейс.  

• Внутри фреймворка используется канвас для отрисовки текста.  

• Возможность интеграции Flutter с нативными проектами.  

• Пример интеграции с Android: отображение экрана в виде активити.  

• Flutter добавляет 5-10 МБ к размеру приложения.  

• Важно оценить необходимость использования Flutter для существующего приложения.  

• Flutter Engine управляет виртуальной машиной Dart и взаимодействует с платформами Android, iOS и Web.  

• Flutter Engine требует времени для запуска.  

• В манифесте создается новая активность с параметрами для Flutter.  

• Flutter Engine запускается через Dart Executor.  

• Flutter позволяет создавать методы и события для взаимодействия с нативной платформой.  

• Каналы и события обеспечивают двунаправленную связь между Flutter и нативным кодом.  

• Важно учитывать типы данных при передаче между Flutter и нативной платформой.  

• Регистрация и настройка каналов в нативном коде.  

• Реализация каналов в Dart для взаимодействия с Flutter.  

• Использование Dart Executor для запуска Flutter.  

• Интеграция Flutter с iOS требует подключения в подфайле.  

• Проблемы с зависимостями и их решение через Podfile.  

• Создание и запуск Flutter Engine в iOS приложении.  

• Flutter предоставляет множество абстракций для быстрой разработки.  

• Возможность пересборки виджетов и перестройки приложения на ходу.  

• Поддержка различных библиотек и возможность создания игрового движка.  

• Flutter поддерживает множество платформ, включая Android, iOS, Web, macOS, Linux и Raspberry Pi.  

• Приложения на Flutter могут запускаться на разных устройствах, включая часы и телевизоры.  

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

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

• Интерфейс отслеживает состояние дерева виджетов и перерисовывает их при необходимости.  

• Это позволяет достигать высокой производительности и избегать задержек.  

• Ошибки в расчетах могут привести к лагам, но при грамотном подходе их можно избежать.  

• Flutter скрывает многие аспекты разработки, предоставляя виджеты для использования.  

• Разработчикам не нужно глубоко понимать нативные платформы для создания качественных приложений.  

• Flutter не использует три дерева, как описано в документации.  

• Приложение состоит из виджетов и рендер-объектов, которые управляются фреймворком.  

• Flutter предоставляет абстракции для работы с рендер-объектами и канвасом.  

• Пример с виджетами показывает, как Flutter работает с рендер-объектами.  

• Рендер-объекты позволяют работать с канвасом напрямую.  

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

• Чип виджет работает напрямую с канвасом.  

• Метод пейнт используется для отрисовки интерфейса.  

• Многие виджеты реализованы таким образом.  

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

• Прогресс индикатор использует канвас для отрисовки.  

• Разработчик не задумывается о деталях, но использует канвас напрямую.  

• Рендер объекты используются для отрисовки элементов.  

• Пример: слайдер, который использует стейт и рендер объекты.  

• Рендер объекты реализуются на канвасе.  

• В фреймворке нет отдельных деревьев для рендер объектов, элементов и виджетов.  

• Все элементы вложены друг в друга.  

• Пример: приложение запускается и показывает вложенность элементов.  

• В студии можно детально посмотреть вложенность элементов.  

• Рендер объекты имеют различные поля, связанные с рендерингом.  

• Фреймворк состоит из множества модулей, но для разработчиков все просто.  

• Фреймворк скрывает детали реализации, что делает его быстрым.  

• Возможность доступа к любому уровню абстракции.  

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

• Фреймворк не имеет трех параллельных деревьев.  

• Элементы и рендер объекты вложены друг в друга.  

• Связь между элементами и мульти компоненты.  

• Понимание работы с UI: отрисовка и перерисовка.  

• Использование баттл неков в Flutter приложении.  

• Избегание проблем с UI через вынос операций в отдельный изолят.  

• Создание изолированной среды для операций.  

• Возможность запуска операций в изолированной среде и ожидания ответа в основной.  

• Пример с перебором элементов матрицы, что может забить UI-трейд.  

• Возможность справиться с большими объемами данных.  

• Надежда на понимание неограниченных возможностей разработчиков.