UI はローカライズ済みです。スキルの紹介と説明文書は選択した言語へ AI が自動翻訳し、コード・コマンド・パス・専門用語は原文のままです。原作者の文書が優先されます。
スキルを探す
生産性・共同作業 · SKILL.md

flutter-expertise

flutter-expertise

Expert knowledge in Flutter, focusing on State Management and Render Tree optimization.

Independent GitHub snapshot · Automated classification · Original documentation governs

スキルの説明

GitHub

name: flutter-expertise description: Expert knowledge in Flutter, focusing on State Management and Render Tree optimization.

Flutter Expertise

State Management (Riverpod / BLoC)

  • Riverpod: Use ConsumerWidget or ref.watch carefully to limit widget rebuilds. Keep providers small and focused.
  • BLoC: Use BlocBuilder with buildWhen to prevent unnecessary rebuilds. Maintain distinct states (Loading, Success, Error).
// Riverpod Example
final counterProvider = StateProvider((ref) => 0);

class CounterText extends ConsumerWidget {
  @override
  Widget build(BuildContext context, WidgetRef ref) {
    // Only rebuilds when counterProvider changes
    final count = ref.watch(counterProvider);
    return Text('Count: $count');
  }
}

Render Tree Optimization

  • Avoid rebuilding the entire tree. Extract widgets into smaller const StatelessWidgets.
  • Use RepaintBoundary to isolate widgets that paint frequently (e.g., animations).
  • Minimize the use of heavy widgets like Opacity and ClipRRect when simpler alternatives exist.
%%{init: {"theme": "default", "flowchart": {"useMaxWidth": true}}}%%
flowchart TD
    A[Build Method Triggered] --> B{Is Widget Const?}
    B -- Yes --> C[Skip Rebuild]
    B -- No --> D[Evaluate State Changes]
    D --> E{Use RepaintBoundary?}
    E -- Yes --> F[Paint Isolated Area]
    E -- No --> G[Paint Entire Tree]
保存したスキル