Flutter性能优化插件turbo的使用

Turbo 是一个简单高效的 Flutter 状态管理解决方案。它不依赖于 Streams 或复杂的抽象，而是通过显式调用 refresh() 函数来更新状态。

Turbo 相比其他状态管理解决方案更为高效，因为它以更简单的实现方式实现了相同的结果。Turbo 不隐藏复杂性，而是通过 getter、setter 和函数来实现结果。这使得开发者可以更好地控制代码库中哪些部分会导致状态变化。

Turbo 实现的代码量少于 400 行（包括注释），这并不是关键点，但确实表明了其简洁性。

控制器逻辑

创建控制器时，继承 TurboController 类。在修改变量后，必须调用 refresh() 函数确保所有与该控制器关联的 TurboWidget 和 TurboState 都能更新。

/// 使用普通的控制器
class CountController extends TurboController {
    int _count = 0;
    int get count => _count;
    set count(int value) {
        _count = value;
        /// 可以省略事件参数
        refresh();
    }

    /// 如果你更喜欢这种方式
    void increment() {
        _count++;
        /// 可以省略事件参数
        refresh();
    }
}

/// 或者将事件类型与控制器关联以使用 Turbo 的事件系统
enum CountEvent { increase, decrease }

class CountController extends TurboController<CountEvent> {
    int _count = 0;
    int get count => _count;
    set count(int value) {
        _count = value;
        
        /// 在 `refresh` 函数中使用事件
        /// 你也可以发出 `emit` 参数，这样未订阅任何事件的小部件才会被更新
        refresh(
            emit: value > count
                ? CountEvent.increase
                : (value < count ? CountEvent.decrease : null)
        );
    }

    /// 如果你更喜欢这种方式
    void increment() {
        _count++;
        
        refresh(emit: CountEvent.increase);
    }
}

将小部件/状态附加到控制器

可以在你希望的位置实例化控制器。它可以是一个全局变量，如果你知道如何有效地使用它。然后将其附加到 TurboState 或 TurboWidget 上，你的小部件会根据你设计的控制器逻辑自动响应更改。

var counter = CountController();

然后可以像以下方式将其附加到 TurboState：

class MyCounter extends StatefulWidget {
    const MyCounter({Key? key}) : super(key: key);

    TurboState<MyCounter> createState() => _MyCounterState();
}

class _MyCounterState extends TurboState<MyCounter> {
    @override
    void initState() {
        /// 在这种情况下，小部件将响应所有更改
        attach(counter);

        /// 或提供事件供小部件响应。在这种情况下，只有当 `count` 增加时，小部件才会更新
        attach(
            counter,
            subscribeTo: counter.event(
                [CountEvent.increase],
                /// `after` 和 `before` 是可选的
                after: (_) => print('Value increased'),
            )
        );

        attach(secondController);
        ...
        /// 可以附加多个不同类型的控制器
        ...
        super.initState();
    }

    @override
    Widget build(BuildContext context) {
        ...
    }
}

或者像以下方式将其附加到 TurboWidget：

class MyCounterWidget extends TurboWidget {
    MyCounterWidget({Key? key}) : super(key: key);
    
    @override
    void init() {
        /// 小部件将响应所有更改
        attach(counter);

        /// 或提供事件供小部件响应。在这种情况下，只有当 `count` 减少时，小部件才会更新
        attach(
            counter,
            subscribeTo: counter.event(
                [CountEvent.decrease],
                /// `after` 和 `before` 是可选的
                after: (_) => print('Value decreased'),
            )
        );

        ...
        /// 可以附加多个不同类型的控制器
        ...
    }

    @override
    Widget build(BuildContext context) {
        ...
    }
}

你可以附加多个不同类型的控制器，并且小部件将响应这些控制器成员变量的所有更改。记住，你需要在控制器逻辑中调用 refresh() 函数以触发更改后的小部件更新。

使用 TurboBuilder 与控制器一起工作

为了在不分离组件 UI 逻辑的情况下获得控制器的灵活性，可以使用 TurboBuilder。

TurboBuilder(
    controller: counter,
    /// 可选参数以使用事件系统
    /// subscribeTo: counter.event([MyEvent.firstEv], after: (_) => print('Event happened')),
    builder: (myCtrl) {
        return Text(myCtrl.count.toString());
    }
)

分离控制器

你不需要手动分离控制器，因为框架会在小部件从 widget 树中移除或卸载时自动处理这一点。

但在某些特殊场景下，如果不再希望小部件对更改作出反应，可以使用 detachOne 方法来分离小部件与控制器。

detachOne(counter);