fix more than needed rebuilds on canvas children

this used a stupid builderFunc instead of a widget so flutter wasn't able to optimise those widget builds and it was simply a blanket rebuild. Added more examples as well
2025-07-26 17:47:42 +00:00
parent 96e55a7157
commit 7ad54a92cb
8 changed files with 427 additions and 12 deletions
@@ -0,0 +1,45 @@
+import 'package:flutter/material.dart';
+
+/// A widget that displays how many times it has been built.
+/// Useful for demonstrating widget caching optimization.
+class BuildCounterWidget extends StatefulWidget {
+  final Color color;
+  final String label;
+
+  const BuildCounterWidget({super.key, required this.color, required this.label});
+
+  @override
+  State<BuildCounterWidget> createState() => _BuildCounterWidgetState();
+}
+
+class _BuildCounterWidgetState extends State<BuildCounterWidget> {
+  static final Map<String, int> _buildCounts = {};
+
+  @override
+  Widget build(BuildContext context) {
+    final count = _buildCounts[widget.label] = (_buildCounts[widget.label] ?? 0) + 1;
+
+    debugPrint('Building ${widget.label} - Build count: $count');
+
+    return Container(
+      width: 80,
+      height: 80,
+      decoration: BoxDecoration(
+        color: widget.color,
+        border: Border.all(color: Colors.black, width: 2),
+        borderRadius: BorderRadius.circular(8),
+      ),
+      child: Column(
+        mainAxisAlignment: MainAxisAlignment.center,
+        children: [
+          Text(
+            widget.label,
+            style: const TextStyle(color: Colors.white, fontWeight: FontWeight.bold, fontSize: 12),
+          ),
+          const SizedBox(height: 4),
+          Text('Builds: $count', style: const TextStyle(color: Colors.white, fontSize: 10)),
+        ],
+      ),
+    );
+  }
+}