Update bhh when creating picture.

Runtime/external/RTree.cs

     {
         IReadOnlyList<T> Search(in uiRect boundingBox);
         void BulkLoad(IEnumerable<T> items);
+
+        void Insert(T data);
+
+        void Clear();
     }
 
     public class RTree<T> : BBoxHierarchy<T> where T : ISpatialData

Runtime/ui/painting/picture.cs

         readonly List<DrawCmd> _drawCmds = new List<DrawCmd>();
 
         readonly List<CanvasState> _states = new List<CanvasState>();
+        
+        readonly BBoxHierarchy<IndexedRect> _bbh = new RTree<IndexedRect>();
+
+        readonly List<int> _stateUpdateIndices = new List<int>();
 
         bool _isDynamic;
 
                 layerOffset = null,
                 paintBounds = Rect.zero,
             });
+            this._bbh.Clear();
+            this._stateUpdateIndices.Clear();
         }
 
         public Picture endRecording() {
 
-            int index = 0;
-            RTree<IndexedRect> bbh = new RTree<IndexedRect>();
-            List<int> stateUpdateIndices = new List<int>();
-            foreach (var cmd in this._drawCmds) {
-                if (cmd is StateUpdateDrawCmd) {
-                    stateUpdateIndices.Add(index);
-                }
-                else {
-                    bbh.Insert(new IndexedRect(cmd.bounds(5), index));
-                }
-                index++;
-            }
-
-                bbh,
-                stateUpdateIndices);
+                this._bbh,
+                this._stateUpdateIndices);
         }
 
         public void addDrawCmd(DrawCmd drawCmd) {
                 case DrawSave _:
                     this._states.Add(this._getState().copy());
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 case DrawSaveLayer cmd: {
                     this._states.Add(new CanvasState {
                         layerOffset = cmd.rect.topLeft,
                         paintBounds = Rect.zero,
                     });
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
 
                         paintBounds = state.xform.mapRect(paintBounds);
                         this._addPaintBounds(paintBounds);
                     }
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
 
                     break;
                 }
                     state.xform = new Matrix3(state.xform);
                     state.xform.preTranslate(cmd.dx, cmd.dy);
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
 
                     state.xform.preScale(cmd.sx, (cmd.sy ?? cmd.sx));
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
 
                             cmd.offset.dx,
                             cmd.offset.dy);
                     }
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
 
                     break;
                 }
                     state.xform = new Matrix3(state.xform);
                     state.xform.preSkew(cmd.sx, cmd.sy);
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
 
                     state.xform.preConcat(cmd.matrix);
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
 
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
 
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
 
                     var rect = state.xform.mapRect(cmd.rect);
                     state.scissor = state.scissor == null ? rect : state.scissor.intersect(rect);
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
 
                     var rect = state.xform.mapRect(cmd.rrect.outerRect);
                     state.scissor = state.scissor == null ? rect : state.scissor.intersect(rect);
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
 
                     cache.computeFillMesh(0.0f, out _);
                     var rect = cache.fillMesh.transform(state.xform).bounds;
                     state.scissor = state.scissor == null ? rect : state.scissor.intersect(rect);
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
 
                         float sigma = scale * paint.maskFilter.sigma;
                         float sigma3 = 3 * sigma;
                         this._addPaintBounds(mesh.bounds.inflate(sigma3));
+                        this._bbh.Insert(new IndexedRect(uiRectHelper.fromRect(mesh.bounds.inflate(sigma3 + 5)).Value,
+                            this._drawCmds.Count - 1));
+                        this._bbh.Insert(new IndexedRect(uiRectHelper.fromRect(mesh.bounds.inflate(5)).Value,
+                            this._drawCmds.Count - 1));
                     }
 
                     break;
                         cmd.image.width, cmd.image.height);
                     rect = state.xform.mapRect(rect);
                     this._addPaintBounds(rect);
+                    this._bbh.Insert(new IndexedRect(uiRectHelper.fromRect(rect.inflate(5)).Value,
+                        this._drawCmds.Count - 1));
                     if (cmd.image.isDynamic) {
                         this._isDynamic = true;
                     }
                     var state = this._getState();
                     var rect = state.xform.mapRect(cmd.dst);
                     this._addPaintBounds(rect);
+                    this._bbh.Insert(new IndexedRect(uiRectHelper.fromRect(rect.inflate(5)).Value,
+                        this._drawCmds.Count - 1));
                     if (cmd.image.isDynamic) {
                         this._isDynamic = true;
                     }
                     var state = this._getState();
                     var rect = state.xform.mapRect(cmd.dst);
                     this._addPaintBounds(rect);
+                    this._bbh.Insert(new IndexedRect(uiRectHelper.fromRect(rect.inflate(5)).Value,
+                        this._drawCmds.Count - 1));
                     if (cmd.image.isDynamic) {
                         this._isDynamic = true;
                     }
                     var state = this._getState();
                     var rect = state.xform.mapRect(cmd.picture.paintBounds);
                     this._addPaintBounds(rect);
+                    this._bbh.Insert(new IndexedRect(uiRectHelper.fromRect(rect.inflate(5)).Value,
+                        this._drawCmds.Count - 1));
                     if (cmd.picture.isDynamic) {
                         this._isDynamic = true;
                     }
                         float sigma = scale * paint.maskFilter.sigma;
                         float sigma3 = 3 * sigma;
                         this._addPaintBounds(rect.inflate(sigma3));
+                        this._bbh.Insert(new IndexedRect(uiRectHelper.fromRect(rect.inflate(sigma3 + 5)).Value,
+                            this._drawCmds.Count - 1));
+                        this._bbh.Insert(new IndexedRect(uiRectHelper.fromRect(rect.inflate(5)).Value,
+                            this._drawCmds.Count - 1));
                     }
 
                     break;

Runtime/ui/renderer/cmdbufferCanvas/rendering/canvas_impl.cs

                     drawCmds.Add(picture.drawCmds[cmdIndices[i]]);
                 }
             }
-            
+
             foreach (var drawCmd in drawCmds) {
                 switch (drawCmd) {
                     case uiDrawSave _:

Runtime/ui/renderer/common/picture.cs

         readonly List<uiDrawCmd> _drawCmds = new List<uiDrawCmd>(128);
 
         readonly List<uiCanvasState> _states = new List<uiCanvasState>(32);
+        
+        readonly BBoxHierarchy<IndexedRect> _bbh = new RTree<IndexedRect>();
+
+        readonly List<int> _stateUpdateIndices = new List<int>();
 
         public uiPictureRecorder() {
             this.reset();
                 layerOffset = null,
                 paintBounds = uiRectHelper.zero
             });
+            this._bbh.Clear();
+            this._stateUpdateIndices.Clear();
         }
 
         public uiPicture endRecording() {
             
-            int index = 0;
-            RTree<IndexedRect> bbh = new RTree<IndexedRect>();
-            foreach (var cmd in this._drawCmds) {
-                if (cmd is uiStateUpdateDrawCmd) {
-                    stateUpdateIndices.Add(index);
-                }
-                else {
-                    bbh.Insert(new IndexedRect(cmd.bounds(5), index));
-                }
-                index++;
-            }
-
+            stateUpdateIndices.AddRange(this._stateUpdateIndices);
-            return uiPicture.create(this._drawCmds, state.paintBounds, bbh: bbh, stateUpdateIndices: stateUpdateIndices);
+            return uiPicture.create(
+                this._drawCmds,
+                state.paintBounds,
+                bbh: this._bbh,
+                stateUpdateIndices: stateUpdateIndices);
         }
 
         public void addDrawCmd(uiDrawCmd drawCmd) {
                 case uiDrawSave _:
                     this._states.Add(this._getState().copy());
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 case uiDrawSaveLayer cmd: {
                     this._states.Add(new uiCanvasState {
                         layerOffset = cmd.rect.Value.topLeft,
                         paintBounds = uiRectHelper.zero
                     });
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
                 case uiDrawRestore _: {
                     }
 
                     this._setState(state);
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
                 case uiDrawTranslate cmd: {
                     this._setState(state);
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
                 case uiDrawScale cmd: {
                     this._setState(state);
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
                 case uiDrawRotate cmd: {
                     }
 
                     this._setState(state);
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
                 case uiDrawSkew cmd: {
                     this._setState(state);
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
                 case uiDrawConcat cmd: {
                     this._setState(state);
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
                 case uiDrawResetMatrix _: {
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
                 case uiDrawSetMatrix cmd: {
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
                 case uiDrawClipRect cmd: {
                     state.scissor = state.scissor == null ? rect : state.scissor.Value.intersect(rect);
                     this._setState(state);
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
                 case uiDrawClipRRect cmd: {
                     state.scissor = state.scissor == null ? rect : state.scissor.Value.intersect(rect);
                     this._setState(state);
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
                 case uiDrawClipPath cmd: {
                     state.scissor = state.scissor == null ? rect : state.scissor.Value.intersect(rect);
                     this._setState(state);
                     ObjectPool<uiMeshMesh>.release(transformedMesh);
+                    this._stateUpdateIndices.Add(this._drawCmds.Count - 1);
                     break;
                 }
                 case uiDrawPath cmd: {
                         float sigma = scale * paint.maskFilter.Value.sigma;
                         float sigma3 = 3 * sigma;
                         this._addPaintBounds(uiRectHelper.inflate(mesh.bounds, sigma3));
+                        this._bbh.Insert(new IndexedRect(uiRectHelper.inflate(mesh.bounds, sigma3 + 5),
+                            this._drawCmds.Count - 1));
+                        this._bbh.Insert(new IndexedRect(uiRectHelper.inflate(mesh.bounds, 5),
+                            this._drawCmds.Count - 1));
                     }
 
                     ObjectPool<uiMeshMesh>.release(mesh);
                         cmd.image.width, cmd.image.height);
                     rect = state.xform.mapRect(rect);
                     this._addPaintBounds(rect);
+                    this._bbh.Insert(new IndexedRect(uiRectHelper.inflate(rect, 5),
+                        this._drawCmds.Count - 1));
                     break;
                 }
                 case uiDrawImageRect cmd: {
+                    this._bbh.Insert(new IndexedRect(uiRectHelper.inflate(rect, 5),
+                        this._drawCmds.Count - 1));
                     break;
                 }
                 case uiDrawImageNine cmd: {
+                    this._bbh.Insert(new IndexedRect(uiRectHelper.inflate(rect, 5),
+                        this._drawCmds.Count - 1));
                     break;
                 }
                 case uiDrawPicture cmd: {
+                    this._bbh.Insert(new IndexedRect(uiRectHelper.inflate(rect, 5),
+                        this._drawCmds.Count - 1));
                     break;
                 }
                 case uiDrawTextBlob cmd: {
                         cmd.textBlob.Value.shiftedBoundsInText(cmd.offset.Value.dx, cmd.offset.Value.dy)).Value;
                     rect = state.xform.mapRect(rect);
+                    this._bbh.Insert(new IndexedRect(uiRectHelper.inflate(rect, 5),
+                        this._drawCmds.Count - 1));
 
                     var paint = cmd.paint;
                     if (paint.maskFilter != null && paint.maskFilter.Value.sigma != 0) {
+                        this._bbh.Insert(new IndexedRect(uiRectHelper.inflate(rect, sigma3 + 5),
+                            this._drawCmds.Count - 1));
+                        this._bbh.Insert(new IndexedRect(uiRectHelper.inflate(rect, 5),
+                            this._drawCmds.Count - 1));
                     }
 
                     break;