imrpove readmes

example/lib/caching_test.dart

@@ -10,7 +10,7 @@ class CachingTestApp extends StatefulWidget {
 }
 
 class _CachingTestAppState extends State<CachingTestApp> {
-  final LazyCanvasController controller = LazyCanvasController(debug: false);
+  final LazyCanvasController controller = LazyCanvasController(debug: false, buildCacheExtent: const Offset(50, 50));
 
   @override
   void initState() {
@@ -34,7 +34,7 @@ class _CachingTestAppState extends State<CachingTestApp> {
   Widget build(BuildContext context) {
     return Scaffold(
       appBar: AppBar(
-        title: const Text('Widget Caching Test'),
+        title: const Text('Widget Build Counts'),
         actions: [
           IconButton(
             onPressed: () {
@@ -51,23 +51,7 @@ class _CachingTestAppState extends State<CachingTestApp> {
           ),
         ],
       ),
-      body: Column(
-        children: [
-          Container(
-            padding: const EdgeInsets.all(16),
-            color: Colors.yellow[100],
-            child: const Text(
-              'Instructions:\n'
-              '• Pan around the canvas - widgets should only build once initially\n'
-              '• Watch the console for build messages\n'
-              '• Use the refresh button to force rebuilds\n'
-              '• Zoom in/out to see caching in action',
-              style: TextStyle(fontSize: 12),
-            ),
-          ),
-          Expanded(child: LazyCanvas(controller: controller)),
-        ],
-      ),
+      body: LazyCanvas(controller: controller),
       floatingActionButton: Column(
         mainAxisSize: MainAxisSize.min,
         children: [

example/lib/dynamic_widget_example.dart

@@ -10,7 +10,7 @@ class DynamicWidgetExample extends StatefulWidget {
 }
 
 class _DynamicWidgetExampleState extends State<DynamicWidgetExample> {
-  final LazyCanvasController controller = LazyCanvasController(debug: false);
+  final LazyCanvasController controller = LazyCanvasController(debug: false, buildCacheExtent: const Offset(50, 50));
 
   // Store child IDs for later reference
   late CanvasChildId selfManagedId;
@@ -93,16 +93,16 @@ class _DynamicWidgetExampleState extends State<DynamicWidgetExample> {
   @override
   Widget build(BuildContext context) {
     return Scaffold(
-      appBar: AppBar(title: const Text('Dynamic Widget Inputs')),
+      appBar: AppBar(title: const Text('Widget State Updates')),
       body: Column(
         children: [
           Container(
             padding: const EdgeInsets.all(16),
-            color: Colors.grey[100],
+            color: Theme.of(context).colorScheme.surfaceContainerLowest,
             child: Column(
               crossAxisAlignment: CrossAxisAlignment.start,
               children: [
-                const Text('Three approaches for dynamic inputs:', style: TextStyle(fontWeight: FontWeight.bold)),
+                const Text('Three approaches for state updates:', style: TextStyle(fontWeight: FontWeight.bold)),
                 const SizedBox(height: 8),
                 const Text('1. Self-managed StatefulWidget (left), loses state on unmount'),
                 const Text('2. External data + updateChildWidget (center) - manual updates'),
@@ -189,8 +189,6 @@ class ExternalDataWidget extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    debugPrint('ExternalDataWidget built with counter: $counter, key: $key');
-
     return Container(
       width: 120,
       height: 80,

example/lib/main.dart

@@ -8,9 +8,10 @@ void main() {
   runApp(
     MaterialApp(
       // showPerformanceOverlay: true,
-      title: 'Infinite Lazy 2D Grid Example',
+      title: 'Infinite Lazy 2D Grid Examples',
       home: const ExampleChooser(),
       debugShowCheckedModeBanner: false,
+      theme: ThemeData(colorScheme: ColorScheme.fromSeed(seedColor: Color(0xffffbf69))),
     ),
   );
 }
@@ -37,14 +38,14 @@ class ExampleChooser extends StatelessWidget {
               onPressed: () {
                 Navigator.push(context, MaterialPageRoute(builder: (context) => const CachingTestApp()));
               },
-              child: const Text('Widget Caching Test'),
+              child: const Text('Widget Build Counts'),
             ),
             const SizedBox(height: 16),
             ElevatedButton(
               onPressed: () {
                 Navigator.push(context, MaterialPageRoute(builder: (context) => const DynamicWidgetExample()));
               },
-              child: const Text('Dynamic Widget Inputs'),
+              child: const Text('Widget State Updates'),
             ),
             const SizedBox(height: 16),
             ElevatedButton(
@@ -59,7 +60,7 @@ class ExampleChooser extends StatelessWidget {
               child: Text(
                 'Examples:\n'
                 '• Simple: Basic usage demo\n'
-                '• Caching Test: To sanity check build counts\n'
+                '• Build Counts: To see what rebuilds when\n'
                 '• Dynamic Inputs: How to handle changing widget data\n'
                 '• Render Callbacks: See widgets enter/exit render area',
                 textAlign: TextAlign.center,

example/lib/render_callbacks_example.dart

@@ -30,6 +30,7 @@ class _RenderCallbacksExampleState extends State<RenderCallbacksExample> {
     // Initialize controller with render callbacks
     controller = LazyCanvasController(
       debug: true,
+      buildCacheExtent: const Offset(50, 50),
       onWidgetEnteredRender: onWidgetEnteredRender,
       onWidgetExitedRender: onWidgetExitedRender,
     );

example/lib/simple_example.dart

@@ -11,7 +11,7 @@ class SimpleExample extends StatefulWidget {
 }
 
 class _SimpleExampleState extends State<SimpleExample> {
-  final LazyCanvasController controller = LazyCanvasController(debug: true);
+  final LazyCanvasController controller = LazyCanvasController(debug: true, buildCacheExtent: const Offset(50, 50));
   final List<CanvasChildId> childIds = [];
 
   @override