Scene fixes

src/benchmarks/avatarBenchmark.tsx

@@ -36,9 +36,9 @@ export const metadata = {
 
 export default function AvatarBenchmarkEntry() {
   const sceneEntity = useRouteScene()
-  return sceneEntity.value ? (
+  return sceneEntity ? (
     <>
-      <AvatarBenchmark rootEntity={sceneEntity.value} onComplete={undefined as any} />
+      <AvatarBenchmark rootEntity={sceneEntity} onComplete={() => {}} />
       <ProfilerUI systemUUIDs={[SkinnedMeshTransformSystem, AvatarAnimationSystem]} />
     </>
   ) : null

src/benchmarks/avatarIKBenchmark.tsx

@@ -12,9 +12,9 @@ export const metadata = {
 
 export default function AvatarIKBenchmarkEntry() {
   const sceneEntity = useRouteScene()
-  return sceneEntity.value ? (
+  return sceneEntity ? (
     <>
-      <AvatarIKBenchmark rootEntity={sceneEntity.value} onComplete={undefined as any} />
+      <AvatarIKBenchmark rootEntity={sceneEntity} onComplete={() => {}} />
       <ProfilerUI systemUUIDs={[SkinnedMeshTransformSystem]} />
     </>
   ) : null

src/benchmarks/heapBenchmark.tsx

@@ -54,10 +54,10 @@ export default function HeapBenchmarkEntry() {
     }
   }, [grow])
 
-  return sceneEntity.value && memory ? (
+  return sceneEntity && memory ? (
     <>
       <ProfilerUI systemUUIDs={[]} />
-      <div style={{ position: 'absolute', right: 12, top: 36, textAlign: 'right', pointerEvents: 'auto' }}>
+      <div style={{ position: 'absolute', right: 12, bottom: 36, textAlign: 'right', pointerEvents: 'auto' }}>
         <div>{`Used Heap: ${Math.trunc(memory.usedJSHeapSize * 0.000001)}mb`}</div>
         <button style={buttonStyle} onClick={() => setGrow(!grow)}>
           {grow ? 'Stop' : 'Grow'}

src/benchmarks/particlesBenchmark.tsx

@@ -12,9 +12,9 @@ export const metadata = {
 
 export default function ParticlesBenchmarkEntry() {
   const sceneEntity = useRouteScene()
-  return sceneEntity.value ? (
+  return sceneEntity ? (
     <>
-      <ParticlesBenchmark rootEntity={sceneEntity.value} onComplete={undefined as any} />
+      <ParticlesBenchmark rootEntity={sceneEntity} onComplete={() => {}} />
       <ProfilerUI systemUUIDs={[ParticleSystem]} />
     </>
   ) : null

src/benchmarks/physicsBenchmark.tsx

@@ -12,9 +12,9 @@ export const metadata = {
 
 export default function PhysicsBenchmarkEntry() {
   const sceneEntity = useRouteScene()
-  return sceneEntity.value ? (
+  return sceneEntity ? (
     <>
-      <PhysicsBenchmark rootEntity={sceneEntity.value} onComplete={undefined as any} />
+      <PhysicsBenchmark rootEntity={sceneEntity} onComplete={() => {}} />
       <ProfilerUI systemUUIDs={[PhysicsSystem, PhysicsPreTransformSystem]} />
     </>
   ) : null

src/benchmarks/utils/profilerUI.tsx

@@ -1,20 +1,26 @@
-import { ECSState, SystemUUID } from '@etherealengine/ecs'
+import { ECSState, System, SystemUUID, filterAndSortSystemsByAvgDuration } from '@etherealengine/ecs'
 import { getState } from '@etherealengine/hyperflux'
 import React, { useEffect, useState } from 'react'
-import { ProfileState, SystemProfileData } from '../../engine/benchmarks/Profiling'
+import { ProfileState, SystemProfileData, SystemProfilerSystem } from '../../engine/benchmarks/Profiling'
 
 import('../../engine/benchmarks/Profiling')
 
 export default function ProfilerUI(props: { systemUUIDs: SystemUUID[] }) {
   const { systemUUIDs } = props
   const [frameTime, SetFrameTime] = useState(0)
   const [systemProfileData, SetSystemProfileData] = useState([] as ({ uuid: SystemUUID } & SystemProfileData)[])
+  const [sortedSystemProfileData, SetSortedSystemProfileData] = useState([] as System[])
 
   useEffect(() => {
     const id = setInterval(() => {
       const ecsState = getState(ECSState)
       SetFrameTime(Math.trunc(ecsState.deltaSeconds * 1000))
 
+      SetSortedSystemProfileData(
+        filterAndSortSystemsByAvgDuration(0.2)
+          .filter((system) => system.uuid !== SystemProfilerSystem)
+          .slice(0, 6)
+      )
       SetSystemProfileData(
         systemUUIDs.map((uuid) => {
           return {
@@ -33,16 +39,30 @@ export default function ProfilerUI(props: { systemUUIDs: SystemUUID[] }) {
   return (
     <div className="ProfilerUI" style={{ position: 'absolute', right: 12, top: 12, textAlign: 'right' }}>
       <div>{`Frame Time: ${frameTime}ms`}</div>
-      {systemProfileData.map((profileData) => {
-        return (
-          <>
-            <div>{`System: ${profileData.uuid}`}</div>
-            <div>{`avg: ${Math.trunc(profileData.avgDuration * 1000) / 1000}ms \n max: ${
-              Math.trunc(profileData.maxDuration * 1000) / 1000
-            }ms`}</div>
-          </>
-        )
-      })}
+      <div style={{ paddingTop: '18px' }}>
+        {'Benchmarked Systems: '}
+        {systemProfileData.map((profileData) => {
+          return (
+            <React.Fragment key={profileData.uuid}>
+              <div>{`System: ${profileData.uuid}`}</div>
+              <div>{`avg: ${Math.trunc(profileData.avgDuration * 1000) / 1000}ms \n max: ${
+                Math.trunc(profileData.maxDuration * 1000) / 1000
+              }ms`}</div>
+            </React.Fragment>
+          )
+        })}
+      </div>
+      <div style={{ paddingTop: '18px' }}>
+        {'Longest Running Systems: '}
+        {sortedSystemProfileData.map((system) => {
+          return (
+            <React.Fragment key={system.uuid}>
+              <div>{`System: ${system.uuid}`}</div>
+              <div>{`avg: ${Math.trunc(system.avgSystemDuration * 1000) / 1000}ms`}</div>
+            </React.Fragment>
+          )
+        })}
+      </div>
     </div>
   )
 }

src/benchmarksAllRoute.tsx

@@ -8,9 +8,9 @@ const BenchmarkAllRoute = () => {
   const sceneEntity = useRouteScene()
 
   useEffect(() => {
-    if (!sceneEntity.value) return
+    if (!sceneEntity) return
 
-    setComponent(sceneEntity.value, BenchmarkComponent)
+    setComponent(sceneEntity, BenchmarkComponent)
     import('./engine/benchmarks/BenchmarkOrchestration')
   }, [sceneEntity])
 

src/engine/benchmarks/AvatarBenchmark.tsx

@@ -80,7 +80,7 @@ export const AvatarBenchmark = (props: { rootEntity: Entity; onComplete: () => v
   }, [avatars])
 
   useEffect(() => {
-    if (onComplete && completedCount.value == avatarsToCreate) sleep(benchmarkWaitTime).then(onComplete)
+    if (completedCount.value == avatarsToCreate) sleep(benchmarkWaitTime).then(onComplete)
   }, [completedCount.value == avatarsToCreate])
 
   return (

src/engine/benchmarks/ParticlesBenchmark.ts

@@ -1,35 +1,24 @@
-import {
-  Engine,
-  Entity,
-  EntityUUID,
-  UUIDComponent,
-  createEntity,
-  getComponent,
-  removeEntity,
-  setComponent
-} from '@etherealengine/ecs'
+import { Engine, Entity, getComponent, removeEntity, setComponent } from '@etherealengine/ecs'
 import { ParticleSystemComponent } from '@etherealengine/engine/src/scene/components/ParticleSystemComponent'
 import { TransformComponent } from '@etherealengine/spatial'
 import { Object3DComponent } from '@etherealengine/spatial/src/renderer/components/Object3DComponent'
 import { VisibleComponent } from '@etherealengine/spatial/src/renderer/components/VisibleComponent'
-import { EntityTreeComponent } from '@etherealengine/spatial/src/transform/components/EntityTree'
 import { useEffect } from 'react'
 import { Group, MathUtils } from 'three'
+import { setupEntity } from '../../examples/utils/common/entityUtils'
 
 const objectsToCreate = 30
 const waitTimeBetween = 200
 const simulateTime = 3000
 
 const createParticleEntity = (rootEntity: Entity) => {
-  const entity = createEntity()
+  const entity = setupEntity(rootEntity)
 
   const position = getComponent(Engine.instance.cameraEntity, TransformComponent).position.clone()
   position.setZ(position.z - 7.0)
   position.setX(position.x + MathUtils.randFloat(-2.0, 2.0))
   const obj3d = new Group()
   obj3d.entity = entity
-  setComponent(entity, UUIDComponent, MathUtils.generateUUID() as EntityUUID)
-  setComponent(entity, EntityTreeComponent, { parentEntity: rootEntity })
   setComponent(entity, Object3DComponent, obj3d)
   setComponent(entity, TransformComponent, { position })
   setComponent(entity, ParticleSystemComponent)

src/engine/benchmarks/PhysicsBenchmark.ts

@@ -1,23 +1,14 @@
-import {
-  Engine,
-  Entity,
-  EntityUUID,
-  UUIDComponent,
-  createEntity,
-  getComponent,
-  removeEntity,
-  setComponent
-} from '@etherealengine/ecs'
+import { Engine, Entity, getComponent, removeEntity, setComponent } from '@etherealengine/ecs'
 import { PrimitiveGeometryComponent } from '@etherealengine/engine/src/scene/components/PrimitiveGeometryComponent'
 import { GeometryTypeEnum } from '@etherealengine/engine/src/scene/constants/GeometryTypeEnum'
 import { TransformComponent } from '@etherealengine/spatial'
 import { ColliderComponent } from '@etherealengine/spatial/src/physics/components/ColliderComponent'
 import { RigidBodyComponent } from '@etherealengine/spatial/src/physics/components/RigidBodyComponent'
 import { Object3DComponent } from '@etherealengine/spatial/src/renderer/components/Object3DComponent'
 import { VisibleComponent } from '@etherealengine/spatial/src/renderer/components/VisibleComponent'
-import { EntityTreeComponent } from '@etherealengine/spatial/src/transform/components/EntityTree'
 import { useEffect } from 'react'
 import { Group, MathUtils, Vector3 } from 'three'
+import { setupEntity } from '../../examples/utils/common/entityUtils'
 
 const objectsToCreate = 60
 const waitTimeBetween = 200
@@ -26,15 +17,13 @@ const simulateTime = 3000
 const scale = new Vector3(0.5, 0.5, 0.5)
 
 const createPhysicsEntity = (rootEntity: Entity) => {
-  const entity = createEntity()
+  const entity = setupEntity(rootEntity)
 
   const position = getComponent(Engine.instance.cameraEntity, TransformComponent).position.clone()
   position.setZ(position.z - 7.0)
   position.setX(position.x + MathUtils.randFloat(-2.0, 2.0))
   const obj3d = new Group()
   obj3d.entity = entity
-  setComponent(entity, UUIDComponent, MathUtils.generateUUID() as EntityUUID)
-  setComponent(entity, EntityTreeComponent, { parentEntity: rootEntity })
   setComponent(entity, Object3DComponent, obj3d)
   setComponent(entity, TransformComponent, { position, scale })
   setComponent(entity, PrimitiveGeometryComponent, {

src/engine/benchmarks/Profiling.ts

@@ -40,26 +40,26 @@ const execute = () => {
   const engineVersion = global.__IR_ENGINE_VERSION__
   const profileData = getMutableState(ProfileState)
   const { gpu, device } = getState(PerformanceState)
-  const systems = [...SystemDefinitions.values()]
+  const systems = SystemDefinitions.values()
 
   const engineVersionData = profileData.systemProfilingData[engineVersion]
 
   if (!engineVersionData[gpu].value) engineVersionData.merge({ [gpu]: {} })
   const systemDataMap = engineVersionData[gpu]
 
+  const data = {}
   for (const system of systems) {
-    if (system.uuid == 'eepro.eetest.SystemProfilerSystem') continue
+    if (system.uuid === SystemProfilerSystem) continue
     const max = systemDataMap[system.uuid].value ? systemDataMap[system.uuid].maxDuration.value : 0
-    systemDataMap.merge({
-      [system.uuid]: {
-        avgDuration: system.avgSystemDuration,
-        maxDuration: Math.max(max, system.systemDuration)
-      }
-    })
+    data[system.uuid] = {
+      avgDuration: system.avgSystemDuration,
+      maxDuration: Math.max(max, system.systemDuration)
+    }
   }
+  systemDataMap.merge(data)
 }
 
-export default defineSystem({
+export const SystemProfilerSystem = defineSystem({
   uuid: 'eepro.eetest.SystemProfilerSystem',
   execute,
   insert: { after: PresentationSystemGroup }

src/examples/avatarMocap.tsx

@@ -233,5 +233,5 @@ function AvatarMocap(props: { sceneEntity: Entity }) {
 
 export default function AvatarMocapEntry() {
   const sceneEntity = useRouteScene()
-  return sceneEntity.value ? <AvatarMocap sceneEntity={sceneEntity.value} /> : null
+  return sceneEntity ? <AvatarMocap sceneEntity={sceneEntity} /> : null
 }

src/examples/avatarTest.tsx

@@ -25,7 +25,7 @@ export default function AvatarTestEntry() {
   const created = useHookstate(false)
 
   useEffect(() => {
-    if (sceneEntity.value && network?.ready?.value && avatarList.value.length > 0 && !created.value) {
+    if (sceneEntity && network?.ready?.value && avatarList.value.length > 0 && !created.value) {
       created.set(true)
       const data = [...avatarList.get(NO_PROXY)] as AvatarType[]
       mockNetworkAvatars(data)

src/examples/avatarTestByIndex.tsx

@@ -20,7 +20,7 @@ export default function AvatarBenchmarking() {
   const created = useHookstate(false)
 
   useEffect(() => {
-    if (sceneEntity.value && network?.ready.value && avatarData.value && !created.value) {
+    if (sceneEntity && network?.ready.value && avatarData.value && !created.value) {
       created.set(true)
 
       const avatar = avatarData.get(NO_PROXY) as AvatarType

src/examples/componentExamples/componentExamples.tsx

@@ -424,5 +424,5 @@ export default function ComponentExamplesRoute(props: {
   Reactor: React.FC<{ parent: Entity; onLoad: (entity: Entity) => void }>
 }) {
   const sceneEntity = useRouteScene()
-  return sceneEntity.value ? <ComponentExamples sceneEntity={sceneEntity.value} Reactor={props.Reactor} /> : null
+  return sceneEntity ? <ComponentExamples sceneEntity={sceneEntity} Reactor={props.Reactor} /> : null
 }

src/examples/gltf.tsx

@@ -86,7 +86,7 @@ const GLTF = (props: { sceneEntity: Entity }) => {
 export default function GLTFViewer() {
   const sceneEntity = useRouteScene()
 
-  return sceneEntity.value ? (
+  return sceneEntity ? (
     <div
       id="dnd-container"
       style={{
@@ -100,7 +100,7 @@ export default function GLTFViewer() {
       }}
     >
       <DndWrapper id="dnd-container">
-        <GLTF sceneEntity={sceneEntity.value} />
+        <GLTF sceneEntity={sceneEntity} />
       </DndWrapper>
     </div>
   ) : null

src/sceneRoute.tsx

@@ -86,7 +86,7 @@ export const useRouteScene = (projectName = 'ee-development-test-suite', sceneNa
     getComponent(viewerEntity, CameraComponent).position.set(0, 3, 4)
   }, [viewerEntity])
 
-  return sceneEntity
+  return sceneEntity.value
 }
 
 const getPathForRoute = (category: string, name: string) => {