Flutter state management. Порівняння Riverpod та Provider

Зміст
image by solutelabs.com

Вступ

State Management в Flutter

Стан (State) - це інформація, яку можна отримати синхронно, коли будується віджет, і яка може змінюватися в будь-який момент часу (наприклад, поточне значення прогресу анімації або час, який минув з початку анімації). У мові програмування Flutter, керування станом відіграє важливу роль, оскільки воно визначає, як і коли оновлюється інтерфейс користувача.

Чому це важливо?

Flutter є реактивною системою, вона відмальовує віджети на основі їх поточного стану. Коли стан віджета змінюється, Flutter рекомпонує віджет, викликаючи метод build(). Це оновлює відображення віджета на екрані, відповідно до оновленого стану.

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

Ось чому керування станом є таким важливим для розробки додатків на Flutter. State management дозволяє вам відслідковувати зміни стану та реагувати на них, оновлюючи інтерфейс користувача відповідно. Більш того, State management допомагає забезпечити консистентність та передбачуваність вашого додатка, що є важливим для створення гарного користувацького досвіду.

Provider

Що таке Provider?

Provider - це один з найпопулярніших підходів до керування станом у Flutter. Це бібліотека, створена на основі InheritedWidget, однієї з низькорівневих можливостей Flutter, що дозволяє передавати дані вниз по дереву віджетів.

Provider створює віджети, які займаються створенням та постачанням об'єктів, а також займається оновленням тих об'єктів, коли вони змінюються.

Як Provider працює із State Management?

Provider використовує концепцію "зверху вниз" для передачі даних та об'єктів. Основна ідея полягає в тому, що ви створюєте "Provider" віджет в дереві віджетів, і потім ви можете отримати ці дані в будь-якому місці нижче в дереві віджетів.

Provider дозволяє вам визначати, як створюється та оновлюється стан, а також як він розповсюджується по дереву віджетів.

Переваги і недоліки Provider

Переваги:

  • Provider використовує простий та зрозумілий підхід до керування станом.

  • Він допомагає зберігати ваш код організованим, розділяючи логіку стану від інтерфейсу користувача.

  • Provider підтримує lazy initialization, що означає, що об'єкти створюються лише тоді, коли вони потрібні.

Недоліки:

  • Може бути трохи складно зрозуміти на початку, особливо якщо ви новачок у Flutter.

  • Деякі сценарії можуть вимагати більшої кількості коду порівняно з іншими бібліотеками керування станом.

Приклад коду, де використовується Provider

void main() {
  runApp(
    Provider<String>.value(
      value: 'Hello World',
      child: MyApp(),
    ),
  );
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final String value = Provider.of<String>(context);
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Provider Example')),
        body: Center(child: Text(value)),
      ),
    );
  }
}

У цьому прикладі, Provider<String>.value створює Provider, який передає рядок 'Hello World'. Цей рядок можна отримати в будь-якому місці нижче в дереві віджетів використовуючи Provider.of<String>(context).

Riverpod

Що таке Riverpod?

Riverpod - це гнучка та потужна система керування станом для Flutter, створена тим же автором, що й Provider. Riverpod вирішує багато обмежень, з якими стикається Provider, і намагається забезпечити більш безпечне, гнучке та масштабоване рішення для керування станом.

Як Riverpod працює із State Management?

Riverpod використовує концепцію "providers", але він робить це трохи інакше, ніж Provider. Замість створення провайдерів в дереві віджетів, Riverpod створює провайдери глобально. Це означає, що ви маєте доступ до своїх провайдерів з будь-якого місця в вашому додатку, і ви не повинні хвилюватися про проблеми з контекстом.

Переваги і недоліки Riverpod

Переваги:

  • Riverpod вирішує багато обмежень Provider, включаючи проблеми з контекстом.

  • Він дозволяє створювати більш гнучкі та масштабовані структури керування станом.

  • Riverpod не залежить від Flutter, тому ви можете використовувати його в будь-якому проекті Dart.

Недоліки:

  • Riverpod має складніший API, що може бути трохи складніше зрозуміти на початку.

  • Деякі патерни, які ви могли використовувати в Provider, можуть потребувати переосмислення.

Приклад коду, де використовується Riverpod

final helloWorldProvider = Provider<String>((ref) {
  return 'Hello, Riverpod';
});

void main() {
  runApp(
    ProviderScope(
      child: MyApp(),
    ),
  );
}

class MyApp extends ConsumerWidget {
  @override
  Widget build(BuildContext context, ScopedReader watch) {
    final String value = watch(helloWorldProvider);
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Riverpod Example')),
        body: Center(child: Text(value)),
      ),
    );
  }
}

У цьому прикладі, helloWorldProvider створює Provider, який передає рядок 'Hello, Riverpod'. Цей рядок можна отримати в будь-якому місці в додатку, використовуючи watch(helloWorldProvider).

Порівняння між Provider та Riverpod

Основні відмінності між Provider та Riverpod

Створення провайдерів:
Provider вимагає визначення провайдерів в дереві віджетів, в той час як Riverpod визначає провайдери глобально. Це дозволяє використовувати провайдери в будь-якому місці в додатку без необхідності перейматися контекстом.

Безпека:
Riverpod був створений, щоб бути більш безпечним, ніж Provider. Він використовує типізацію для запобігання помилкам на етапі компіляції та підтримує виключення "unmounting provider".

Гнучкість:
Riverpod надає більше гнучкості ніж Provider, завдяки його здатності керувати змінами стану, залежностями між провайдерами та навіть створювати провайдери динамічно.

Коли використовувати Provider або Riverpod

Provider - це відмінний вибір для простих та середніх за розміром додатків Flutter, де ви не зустрічаєтеся зі складними сценаріями керування станом. Він простий для розуміння і добре документований.

З іншого боку, якщо ви створюєте більш складний додаток і вам потрібна додаткова гнучкість, безпека і масштабованість, Riverpod може бути кращим вибором. Це також буде хорошим вибором, якщо ви вже знайомі з Provider і хочете спробувати щось нове.

З якими проблемами ви можете зустрітися, використовуючи кожен із них

У випадку з Provider, ви можете зіткнутися з проблемами, пов'язаними з контекстом. Це може стати проблематичним, коли ви хочете отримати доступ до провайдера вгору по дереву віджетів. Крім того, Provider може бути трохи складним для керування складними сценаріями керування станом.

Riverpod вирішує багато з цих проблем, але він має свої власні нюанси. Ви можете відчути, що вам не вистачає документації або ресурсів навчання порівняно з Provider. Крім того, Riverpod вимагає більше часу для вивчення, оскільки він вносить багато нових концепцій і паттернів.

Висновки

Загальні рекомендації щодо вибору між Provider та Riverpod

Вибір між Provider та Riverpod залежить від специфіки вашого проекту та вашого досвіду розробки. Якщо ви тільки починаєте розробку на Flutter і вам потрібна проста і добре документована бібліотека для керування станом, то Provider - це відмінний вибір. З іншого боку, якщо ви маєте складніші сценарії керування станом або шукаєте більшої гнучкості та безпеки, то Riverpod може бути кращим вибором.

Додаткові ресурси для дослідження обох бібліотек

Ви можете знайти багато корисних ресурсів в інтернеті для дослідження цих бібліотек. Офіційна документація для Provider та Riverpod - це відмінне місце для початку. Крім того, ви знайдете численні статті, відео та пости в блогах про використання цих бібліотек в реальних сценаріях.

P.S.

Я сподіваюсь, що ця стаття допомогла вам краще зрозуміти різницю між Provider та Riverpod. Я запрошую вас поділитися своїми думками про ці бібліотеки в коментарях. Якщо ви ще не використовували Riverpod, спробуйте його і поділіться своїми враженнями. Ваш відгук дуже важливий для мене!

З вами ваш, ІТ Експерт Дмитро!

Поділись своїми ідеями в новій публікації.
Ми чекаємо саме на твій довгочит!
ІТ Дмитро
ІТ Дмитро@it.dmytro

Mobile Team Lead, блогер

1.3KПрочитань
2Автори
20Читачі
Підтримати
На Друкарні з 25 травня

Більше від автора

  • Memeinator. $MMTR Coin

    Відкрийте світ Memeinator MMTR Coin – інноваційної криптовалюти, що поєднує меми і фінанси, з можливостями стейкінгу. Дізнайтеся більше про те, як взаємодіяти з цим захоплюючим проєктом.

    Теми цього довгочиту:

    Криптовалюта
  • My first pet project that reached the App Store

    VL Content Planner is the world’s first app for scheduling and automatic posts to TikTok.

    Теми цього довгочиту:

    Flutter
  • Контент-план як запорука успіху в TikTok

    "Планування контенту в TikTok для зростання аудиторії: використання VL Content Planner для стабільності публікацій та оптимізації вашого відео-контенту."

    Теми цього довгочиту:

    Тік Ток

Вам також сподобається

  • Чому Discord перейшов з Go на Rust

    Rust стає першокласною мовою в різних областях. Ми в Discord успішно використовуємо його і на серверній, і на стороні клієнта.

    Теми цього довгочиту:

    Discord
  • Чому __name__ == "__main__"?

    "name == "main"" - ключова фраза в Python. Визначає, чи є файл головним скриптом чи модулем. Це допомагає створювати зручні модулі, уникати ненавмисного виконання при імпорті та оптимізувати продуктивність.

    Теми цього довгочиту:

    Python
  • Java. Чому локи потрібно тримати якомога менший час?

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

    Теми цього довгочиту:

    Java

Коментарі (2)

Дякую цей довгочит для мене 10 із 10. Якраз планую вивчати Riverpod. У Bloc як мені здалося дуже багато бойлерплейту, його теж планую але пізніше.

Вам також сподобається

  • Чому Discord перейшов з Go на Rust

    Rust стає першокласною мовою в різних областях. Ми в Discord успішно використовуємо його і на серверній, і на стороні клієнта.

    Теми цього довгочиту:

    Discord
  • Чому __name__ == "__main__"?

    "name == "main"" - ключова фраза в Python. Визначає, чи є файл головним скриптом чи модулем. Це допомагає створювати зручні модулі, уникати ненавмисного виконання при імпорті та оптимізувати продуктивність.

    Теми цього довгочиту:

    Python
  • Java. Чому локи потрібно тримати якомога менший час?

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

    Теми цього довгочиту:

    Java