@tldraw/editor 4.3.1 → 4.4.0-canary.0791272556f5

package/src/lib/editor/derivations/notVisibleShapes.ts

@@ -9,60 +9,34 @@ import { Editor } from '../Editor'
  * @returns Incremental derivation of non visible shapes.
  */
 export function notVisibleShapes(editor: Editor) {
-	return computed<Set<TLShapeId>>('notVisibleShapes', function updateNotVisibleShapes(prevValue) {
-		const shapeIds = editor.getCurrentPageShapeIds()
-		const nextValue = new Set<TLShapeId>()
-
-		// Extract viewport bounds once to avoid repeated property access
+	return computed<Set<TLShapeId>>('notVisibleShapes', function (prevValue) {
+		const allShapeIds = editor.getCurrentPageShapeIds()
 		const viewportPageBounds = editor.getViewportPageBounds()
-		const viewMinX = viewportPageBounds.minX
-		const viewMinY = viewportPageBounds.minY
-		const viewMaxX = viewportPageBounds.maxX
-		const viewMaxY = viewportPageBounds.maxY
+		const visibleIds = editor.getShapeIdsInsideBounds(viewportPageBounds)
 
-		for (const id of shapeIds) {
-			const pageBounds = editor.getShapePageBounds(id)
-
-			// Hybrid check: if bounds exist and shape overlaps viewport, it's visible.
-			// This inlines Box.Collides to avoid function call overhead and the
-			// redundant Contains check that Box.Includes was doing.
-			if (
-				pageBounds !== undefined &&
-				pageBounds.maxX >= viewMinX &&
-				pageBounds.minX <= viewMaxX &&
-				pageBounds.maxY >= viewMinY &&
-				pageBounds.minY <= viewMaxY
-			) {
-				continue
-			}
+		const nextValue = new Set<TLShapeId>()
 
-			// Shape is outside viewport or has no bounds - check if it can be culled.
-			// We defer getShape and canCull checks until here since most shapes are
-			// typically visible and we can skip these calls for them.
-			const shape = editor.getShape(id)
-			if (!shape) continue
+		// Non-visible shapes are all shapes minus visible shapes
+		for (const id of allShapeIds) {
+			if (!visibleIds.has(id)) {
+				const shape = editor.getShape(id)
+				if (!shape) continue
 
-			const canCull = editor.getShapeUtil(shape.type).canCull(shape)
-			if (!canCull) continue
+				const canCull = editor.getShapeUtil(shape.type).canCull(shape)
+				if (!canCull) continue
 
-			nextValue.add(id)
+				nextValue.add(id)
+			}
 		}
 
-		if (isUninitialized(prevValue)) {
+		if (isUninitialized(prevValue) || prevValue.size !== nextValue.size) {
 			return nextValue
 		}
 
-		// If there are more or less shapes, we know there's a change
-		if (prevValue.size !== nextValue.size) return nextValue
-
-		// If any of the old shapes are not in the new set, we know there's a change
 		for (const prev of prevValue) {
-			if (!nextValue.has(prev)) {
-				return nextValue
-			}
+			if (!nextValue.has(prev)) return nextValue
 		}
 
-		// If we've made it here, we know that the set is the same
 		return prevValue
 	})
 }