Flutter Intermediate Lesson 61 of 135 2 min read

ReArch in Flutter: Composable Capsules for State and Logic

Understand ReArch for Flutter: capsules, side effects with use.state, RearchConsumer widgets and RearchBootstrapper, explained with an easy counter example.

On this page

ReArch (“re-imagined architecture”) is a newer package for composable state and application logic. Its building block is the capsule: a plain function that can hold state, depend on other capsules and return any value. Capsules combine like Lego bricks, and the framework rebuilds only what depends on what changed.

If you know Riverpod and Flutter Hooks, ReArch will feel like a mix of the two: capsules are similar to providers, and use.state is similar to useState.

The package is not available in the online editor, so run the example in your own project.

Install

flutter pub add rearch flutter_rearch

The counter

import 'package:flutter/material.dart';
import 'package:flutter_rearch/flutter_rearch.dart';
import 'package:rearch/rearch.dart';

// A capsule: holds a count and returns it with a function to change it.
(int, void Function()) countManagerCapsule(CapsuleHandle use) {
  final (count, setCount) = use.state(0);
  return (count, () => setCount(count + 1));
}

// Another capsule that depends on the first one.
bool isEvenCapsule(CapsuleHandle use) {
  final (count, _) = use(countManagerCapsule);
  return count.isEven;
}

void main() {
  runApp(const RearchBootstrapper(child: MaterialApp(home: CounterPage())));
}

class CounterPage extends RearchConsumer {
  const CounterPage({super.key});

  @override
  Widget build(BuildContext context, WidgetHandle use) {
    final (count, increment) = use(countManagerCapsule);
    final isEven = use(isEvenCapsule);

    return Scaffold(
      appBar: AppBar(title: const Text('ReArch')),
      body: Center(
        child: Text('$count (${isEven ? 'even' : 'odd'})', style: const TextStyle(fontSize: 40)),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: increment,
        child: const Icon(Icons.add),
      ),
    );
  }
}

The key ideas

Idea	Meaning
Capsule	A function `T myCapsule(CapsuleHandle use)` that produces a value
`use(otherCapsule)`	Read another capsule and depend on it
`use.state(initial)`	Local state inside a capsule (a side effect)
`RearchBootstrapper`	Holds all capsule data; wrap your app in it
`RearchConsumer`	A widget whose `build` gets a `use` handle

Because capsules are plain functions that return records, logic is easy to split, combine and test.

Pros and cons

Pros: very composable; no classes needed for logic; clear dependencies; good for people who like functional style.
Cons: new and small community; fewer examples; the API may still change, so check the package page for your version.

Try it yourself

Write a doubledCapsule that returns twice the count, and show it under the counter.