A comprehensive collection of battle-tested Flutter patterns and best practices for building production-quality applications.
Overview
This skill provides quick-reference patterns for:
-
Widget Patterns: Common UI components (cards, lists, forms, dialogs, navigation)
-
Testing Patterns: Unit, widget, and integration testing approaches
-
Performance Patterns: Optimization techniques and performance checklists
-
Security Patterns: Security best practices and vulnerability prevention
-
Animation Patterns: Common animation implementations and transitions
When to Use This Skill
Use this skill when you need:
-
Quick reference for standard Flutter UI patterns
-
Testing strategy guidance and examples
-
Performance optimization checklists
-
Security vulnerability prevention
-
Animation implementation examples
-
Best practices for common Flutter development scenarios
Pattern Categories
Widget Patterns
See patterns/flutter-widget-patterns.md for:
-
Card patterns (basic, image, custom)
-
List patterns (lazy loading, sectioned)
-
Form patterns with validation
-
Dialog and bottom sheet patterns
-
Loading and empty states
-
Navigation patterns
-
Responsive layouts
Testing Patterns
See patterns/flutter-testing-patterns.md for:
-
Unit test structure and best practices
-
Widget testing approaches
-
Integration test patterns
-
Mock and stub strategies
-
Test organization and naming conventions
-
Coverage best practices
Performance Patterns
See patterns/flutter-performance-checklist.md for:
-
Build method optimization
-
Widget rebuilding minimization
-
List and grid performance
-
Image loading optimization
-
Memory leak prevention
-
Rendering performance tips
Security Patterns
See patterns/flutter-security-patterns.md for:
-
Input validation and sanitization
-
Secure storage practices
-
API security best practices
-
Authentication and authorization patterns
-
Data encryption approaches
-
Common vulnerability prevention (XSS, injection, etc.)
Animation Patterns
See patterns/flutter-animation-patterns.md for:
-
Basic animation controllers
-
Tween animations
-
Hero animations
-
Page transitions
-
Implicit animations
-
Physics-based animations
-
Custom animation patterns
Usage Examples
Example 1: Need a card UI pattern
User: "I need to create a product card with an image and details"
→ Reference Widget Patterns for image card implementation
Example 2: Writing tests
User: "How should I structure my widget tests?"
→ Reference Testing Patterns for widget test examples
Example 3: Performance issues
User: "My list is laggy when scrolling"
→ Reference Performance Patterns for list optimization techniques
Example 4: Security concern
User: "How do I securely store user credentials?"
→ Reference Security Patterns for secure storage approaches
Example 5: Adding animations
User: "I want to animate a page transition"
→ Reference Animation Patterns for page transition examples
Pattern Quality
All patterns in this skill are:
-
✓ Production-tested and battle-proven
-
✓ Following Flutter best practices
-
✓ Performance-optimized
-
✓ Security-conscious
-
✓ Well-documented with code examples
Quick Access
For fast pattern lookup, each category file is self-contained with:
-
Complete, runnable code examples
-
Explanation of when to use each pattern
-
Common pitfalls and how to avoid them
-
Performance and security considerations
Pro tip: Combine patterns from different categories for comprehensive solutions. For example, use Widget Patterns + Performance Patterns + Security Patterns together when building production features.