Что такое StatelessWidget и когда его использовать?

«Что такое StatelessWidget и когда его использовать?» — вопрос из категории Flutter виджеты, который задают на 59% собеседований Flutter Разработчик. Ниже — развёрнутый ответ с разбором ключевых моментов.

Ответ

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

Основные характеристики:

  • Иммутабельность: После создания его свойства изменить нельзя.
  • Зависимость от параметров: Внешний вид и поведение зависят только от переданных в конструктор данных.
  • Лёгковесность: Проще для оптимизации Flutter, так как фреймворк может безопасно переиспользовать или перестраивать их.

Пример:

class UserProfileCard extends StatelessWidget {
  // Все данные передаются извне и объявлены как final
  final String userName;
  final String userAvatarUrl;
  final int rating;

  const UserProfileCard({
    super.key,
    required this.userName,
    required this.userAvatarUrl,
    required this.rating,
  });

  @override
  Widget build(BuildContext context) {
    return Card(
      child: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Row(
          children: [
            CircleAvatar(backgroundImage: NetworkImage(userAvatarUrl)),
            const SizedBox(width: 16),
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(userName, style: Theme.of(context).textTheme.titleMedium),
                  Text('Рейтинг: $rating'),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}

Когда использовать StatelessWidget:

  • Для статических или "чистых" компонентов (отображающих данные).
  • Когда виджет зависит только от переданных параметров (props).
  • Для элементов UI, которые не управляют собственным состоянием (кнопки, текстовые поля, карточки, отображающие данные).

Принцип: Если виджет может быть перестроен с теми же аргументами и дать идентичный результат, он должен быть StatelessWidget. Это способствует предсказуемости и упрощает тестирование.