Расскажи про жизненный цикл StatelessWidget

Жизненный цикл StatelessWidget

StatelessWidget — это компонент Flutter, который не имеет изменяемого состояния. Его жизненный цикл намного проще, чем у StatefulWidget, но понимание этого цикла критично для правильной разработки.

Что такое StatelessWidget?

StatelessWidget — это иммутабельный виджет, который описывает часть пользовательского интерфейса, которая не зависит от динамических изменений состояния. Все его свойства (properties) финальные и устанавливаются в конструкторе.

Жизненный цикл StatelessWidget

1. Создание (Construction) Виджет создаётся через конструктор. В это время инициализируются все параметры.

2. Вызов build() Вызывается метод build(), который возвращает виджет-дерево, описывающее UI этого компонента.

3. Отрисовка (Rendering) Flutter использует возвращённое виджет-дерево для создания render-дерева и отрисовки на экране.

4. Перестройка (Rebuilding) Когда родительский виджет перестраивается, он может создать новый экземпляр StatelessWidget'а.

5. Удаление (Removal) Когда виджет удаляется из дерева, он удаляется из памяти.

Диаграмма цикла

Конструктор → build() → Render → (Rebuild if parent rebuilds) → Dispose

Отличие от StatefulWidget: нет onInit, onDidUpdateWidget, dispose и других методов жизненного цикла.

Пример StatelessWidget

class UserCard extends StatelessWidget {
  // Финальные поля — иммутабельность
  final String name;
  final String email;
  final int age;

  // Конструктор с параметрами
  const UserCard({
    required this.name,
    required this.email,
    required this.age,
  });

  @override
  Widget build(BuildContext context) {
    // build() вызывается каждый раз, когда родитель перестраивается
    return Card(
      margin: const EdgeInsets.all(8.0),
      child: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              name,
              style: const TextStyle(
                fontSize: 18,
                fontWeight: FontWeight.bold,
              ),
            ),
            const SizedBox(height: 8),
            Text('Email: $email'),
            const SizedBox(height: 4),
            Text('Age: $age'),
          ],
        ),
      ),
    );
  }
}

// Использование
class UserList extends StatefulWidget {
  @override
  State<UserList> createState() => _UserListState();
}

class _UserListState extends State<UserList> {
  List<Map<String, dynamic>> users = [
    {'name': 'Alice', 'email': 'alice@example.com', 'age': 28},
    {'name': 'Bob', 'email': 'bob@example.com', 'age': 32},
  ];

  @override
  Widget build(BuildContext context) {
    return ListView.builder(
      itemCount: users.length,
      itemBuilder: (context, index) {
        final user = users[index];
        // Каждый раз создаём новый UserCard
        // StatelessWidget вычисляется эффективно благодаря const
        return UserCard(
          name: user['name'],
          email: user['email'],
          age: user['age'],
        );
      },
    );
  }
}

Ключевые особенности

Иммутабельность (Immutability)

• Все свойства должны быть final
• Компонент не может изменять себя
• Используй const конструктор для оптимизации

Эффективность (Performance)

• StatelessWidget легче перестраивается
• Меньше памяти, чем StatefulWidget
• const конструктор позволяет Flutter переиспользовать экземпляры

Нет методов жизненного цикла

• Нет initState, didUpdateWidget, dispose
• Если нужны эти методы, используй StatefulWidget
• Вся логика находится в build()

Когда перестраивается StatelessWidget?

• Когда родительский виджет перестраивается
• Когда изменяются его параметры (props)
• Flutter автоматически создаёт новый экземпляр

Лучшие практики

1. Используй const конструктор для StatelessWidget'ов:

const UserCard(name: 'John', email: 'john@example.com', age: 30)

1. Разбивай UI на небольшие StatelessWidget'ы: Это улучшает читаемость и переиспользуемость.

2. Для состояния используй StatefulWidget или Provider: Не пытайся хранить состояние в StatelessWidget'е.

3. Документируй параметры: Указывай, какие параметры обязательны (@required).

StatelessWidget vs StatefulWidget

StatelessWidget:

• Нет состояния
• Не может изменять себя
• Быстрее, проще
• Идеален для UI компонентов

StatefulWidget:

• Имеет состояние
• Может вызывать setState()
• Полный жизненный цикл
• Для логики и динамического контента

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