flutter

Guides Flutter and Dart development with Clean Architecture, Riverpod 2.x, and performance rules.

Updated Sep 10, 2026
One-click install
npx skills add https://github.com/longqt321/Rendez --skill flutter-longqt321
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: flutter
Source: https://github.com/longqt321/Rendez/tree/main/.agent/skills/flutter
Command: npx skills add https://github.com/longqt321/Rendez --skill flutter-longqt321

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Flutter developers often struggle with inconsistent architecture, outdated Dart patterns, and performance pitfalls like bloated widget trees and unoptimized lists. This Skill provides a structured set of standards covering modern Dart 3 features, Clean Architecture, Riverpod 2.x state management, and UI performance rules so apps stay maintainable and fast. ## Core Features & Use Cases - Modern Dart 3 Standards: Enforces records, pattern matching, sealed classes, exhaustive switch expressions, and null-safety best practices. - Clean Architecture with Riverpod 2.x: Defines a feature-based directory layout and prescribes AsyncNotifierProvider, NotifierProvider, and proper AsyncValue handling. - UI Performance Rules: Mandates pure build methods, ListView.builder/Sliver usage, cached network images, and accessibility constraints like 48dp touch targets. - Use Case: When building a new place-discovery feature in a Flutter app, use this Skill to scaffold the feature directory, implement state with Riverpod, and render a masonry grid that follows performance and accessibility guidelines. ## Quick Start Use the flutter skill to implement a Riverpod-based authentication flow with sealed state classes and an exhaustive switch in the UI.

Frequently Asked Questions about flutter

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I manage state in Flutter with Riverpod 2.x?

Use AsyncNotifierProvider or NotifierProvider for state mutation, ref.watch for reactive UI rebuilds, and ref.read only inside callbacks. Handle asynchronous state with AsyncValue.when to render data, loading, and error views explicitly.

How to use sealed classes and pattern matching in Dart 3?

Define a sealed class with subclasses for each state, then use an exhaustive switch expression to handle every case. The compiler enforces completeness, so adding a new state produces a compile-time error until handled.

What is the recommended Flutter project structure for Clean Architecture?

Organize lib/ into a core folder for constants, network, theme, and utils, plus a features folder where each feature contains presentation, domain, and data layers. This keeps business logic isolated from UI code.

Why does my Flutter ListView cause performance issues?

Performance issues occur when using ListView with a static children list instead of ListView.builder, missing ValueKeys on reorderable items, or loading full-resolution images. Use cached_network_image with memCacheWidth and memCacheHeight limits.

What are the accessibility requirements for Flutter touch targets?

Interactive elements need minimum 48x48dp touch targets with at least 8dp spacing between adjacent buttons. Text contrast must meet a 4.5:1 ratio to satisfy accessibility guidelines.