skip forced reflows from HTMLSpriteGroup.render

Smithsonian · Oct 24, 2024 · 4815932 · 4815932
1 parent c73fc9f
commit 4815932
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 5 deletions.
diff --git a/libs/ff-three/source/HTMLSpriteGroup.ts b/libs/ff-three/source/HTMLSpriteGroup.ts
@@ -16,6 +16,14 @@ import HTMLSprite from "./HTMLSprite";
 
 export { HTMLSprite };
 
+interface IViewport{
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    overlay: HTMLElement;
+}
+
 /**
  * THREE 3D object, grouping a number of HTML sprites.
  */
@@ -69,17 +77,17 @@ export default class HTMLSpriteGroup extends Object3D
      * @param container HTML container element for the HTML elements.
      * @param camera The camera used to render the 3D scene.
      */
-    render(container: HTMLElement, camera: Camera)
+    render(viewport: IViewport, camera: Camera)
     {
         if (!this.visible) {
             return;
         }
         //Only get bounds once to prevent forced reflows while looping
-        const bounds = container.getBoundingClientRect();
+        const bounds = new DOMRect(viewport.x, viewport.y, viewport.width, viewport.height);
         const children = this.children as HTMLSprite[];
         for (let i = 0, n = children.length; i < n; ++i) {
             const child = children[i];
-            const element = child.getHTMLElement(container);
+            const element = child.getHTMLElement(viewport.overlay);
             if (element) {
                 child.renderHTMLElement(element, bounds, camera);
             }

diff --git a/source/client/components/CVAnnotationView.ts b/source/client/components/CVAnnotationView.ts
@@ -330,7 +330,7 @@ export default class CVAnnotationView extends CObject3D
         }
 
         const spriteGroup = this.object3D as HTMLSpriteGroup;
-        spriteGroup.render(viewport.overlay, context.camera);
+        spriteGroup.render(viewport, context.camera);
 
         // Handle locking truncation for view animation only after 
         // the sprite has a chance to do an initial update.

diff --git a/source/client/components/CVStaticAnnotationView.ts b/source/client/components/CVStaticAnnotationView.ts
@@ -123,7 +123,7 @@ export default class CVStaticAnnotationView extends CObject3D
         }
 
         const spriteGroup = this.object3D as HTMLSpriteGroup;
-        spriteGroup.render(viewport.overlay, context.camera);
+        spriteGroup.render(viewport, context.camera);
     }
 
     dispose()