minecraft-renderer 0.1.54 → 0.1.56

package/src/resourcesManager/resourcesManager.ts

@@ -12,8 +12,10 @@ import itemsAtlasLegacy from 'mc-assets/dist/itemsAtlasLegacy.png'
 import christmasPack from 'mc-assets/dist/textureReplacements/christmas'
 import { AtlasParser, ItemsAtlasesOutputJson } from 'mc-assets/dist/atlasParser'
 import worldBlockProvider, { WorldBlockProvider } from 'mc-assets/dist/worldBlockProvider'
+import { isWebWorker } from '../three/documentRenderer'
 import { ItemsRenderer } from 'mc-assets/dist/itemsRenderer'
-import { getLoadedItemDefinitionsStore } from 'mc-assets'
+import { getLoadedItemDefinitionsStore } from 'mc-assets/dist/stores'
+import { sanitizeWorkerEventArgs } from '../lib/workerMessageSanitize'
 
 type ResourceManagerEvents = {
   assetsTexturesUpdated: () => void
@@ -21,16 +23,43 @@ type ResourceManagerEvents = {
   assetsInventoryReady: () => void
 }
 
+type ItemDefinitionsStore = ReturnType<typeof getLoadedItemDefinitionsStore>
+
+let workerItemDefinitionsStore: ItemDefinitionsStore | null = null
+
+export function getItemsDefinitionsStoreForRender (
+  resources: LoadedResourcesTransferrable
+): ItemDefinitionsStore {
+  if (!isWebWorker) {
+    ensureItemsDefinitionsStore(resources)
+    return resources.itemsDefinitionsStore
+  }
+  if (!workerItemDefinitionsStore || typeof workerItemDefinitionsStore.get !== 'function') {
+    workerItemDefinitionsStore = getLoadedItemDefinitionsStore(itemDefinitionsJson)
+  }
+  return workerItemDefinitionsStore
+}
+
+export function ensureItemsDefinitionsStore (resources: LoadedResourcesTransferrable): void {
+  if (isWebWorker) return
+  const store = resources.itemsDefinitionsStore as { get?: unknown }
+  if (typeof store?.get === 'function') return
+  resources.itemsDefinitionsStore = getLoadedItemDefinitionsStore(
+    resources.sourceItemDefinitionsJson ?? itemDefinitionsJson
+  )
+}
+
 export class LoadedResourcesTransferrable {
   // todo transfer instead!
   readonly sourceItemDefinitionsJson: any = itemDefinitionsJson
-  readonly itemsDefinitionsStore = getLoadedItemDefinitionsStore(this.sourceItemDefinitionsJson)
+  itemsDefinitionsStore = getLoadedItemDefinitionsStore(this.sourceItemDefinitionsJson)
 
   allReady = false
   // Atlas parsers
   itemsAtlasImage!: ImageBitmap
   blocksAtlasImage!: ImageBitmap
   blocksAtlasJson!: ItemsAtlasesOutputJson
+  itemsAtlasJson!: ItemsAtlasesOutputJson
   // User data (specific to current resourcepack/version)
   customBlockStates?: Record<string, any>
   customModels?: Record<string, any>
@@ -54,8 +83,20 @@ export class LoadedResourcesTransferrable {
 
   constructor(data?: any) {
     if (data) {
-      Object.assign(this, data)
-      this.mcData = MinecraftData(this.version)
+      const safe = { ...data }
+      delete safe.itemsDefinitionsStore
+      delete safe.sourceItemDefinitionsJson
+      Object.assign(this, safe)
+      ensureItemsDefinitionsStore(this)
+    }
+    if (this.version) {
+      const globalMc = (globalThis as { loadedData?: IndexedData, mcData?: IndexedData }).loadedData
+        ?? (globalThis as { mcData?: IndexedData }).mcData
+      if (isWebWorker && globalMc?.entitiesByName) {
+        this.mcData = globalMc
+      } else {
+        this.mcData = MinecraftData(this.version)
+      }
       // this.itemsRenderer = new ItemsRenderer(
       //   this.version,
       //   this.blockstatesModels,
@@ -70,14 +111,18 @@ export class LoadedResourcesTransferrable {
     for (const key in this) {
       if (!Object.prototype.hasOwnProperty.call(this, key)) continue
       if (typeof this[key] === 'function') continue
-      if (key === 'itemsRenderer' || key === 'worldBlockProvider' || key === 'mcData') {
-        // Skip these fields
+      if (
+        key === 'itemsRenderer' || key === 'worldBlockProvider' || key === 'mcData'
+        || key === 'itemsDefinitionsStore' || key === 'sourceItemDefinitionsJson'
+      ) {
         continue
       }
       cloned[key] = this[key as keyof this]
     }
 
     cloned.customTextures = {}
+    delete cloned.itemsDefinitionsStore
+    delete cloned.sourceItemDefinitionsJson
     return cloned as LoadedResourcesTransferrable
   }
 
@@ -106,10 +151,36 @@ const STABLE_MODELS_VERSION = '1.21.4'
 export class ResourcesManager extends (EventEmitter as new () => TypedEmitter<ResourceManagerEvents>) {
   static restorerName = 'ResourcesManager'
 
+  rebuildWorkerRenderers (resources: LoadedResourcesTransferrable): void {
+    if (!isWebWorker) return
+    if (!resources.version || !resources.blockstatesModels || !resources.blocksAtlasJson) return
+
+    this.blocksAtlasParser = new AtlasParser({ latest: resources.blocksAtlasJson }, '')
+    if (resources.itemsAtlasJson) {
+      this.itemsAtlasParser = new AtlasParser({ latest: resources.itemsAtlasJson }, '')
+    } else if (!this.itemsAtlasParser?.atlas?.latest) {
+      if (!this.sourceItemsAtlases || Object.keys(this.sourceItemsAtlases).length === 0) return
+      this.itemsAtlasParser = new AtlasParser(this.sourceItemsAtlases, '')
+    }
+
+    resources.itemsRenderer = new ItemsRenderer(
+      resources.version,
+      resources.blockstatesModels,
+      this.itemsAtlasParser,
+      this.blocksAtlasParser
+    )
+    resources.worldBlockProvider = worldBlockProvider(
+      resources.blockstatesModels,
+      this.blocksAtlasParser.atlas,
+      STABLE_MODELS_VERSION
+    )
+  }
+
   static restoreTransferred(data: any, worker?: Worker) {
     const resourcesManager = new ResourcesManager()
-    const upResources = (data) => {
-      resourcesManager.currentResources = new LoadedResourcesTransferrable(data)
+    const upResources = (transferData: LoadedResourcesTransferrable) => {
+      resourcesManager.currentResources = new LoadedResourcesTransferrable(transferData)
+      resourcesManager.rebuildWorkerRenderers(resourcesManager.currentResources)
     }
     upResources(data.currentResources)
     if (worker) {
@@ -128,6 +199,17 @@ export class ResourcesManager extends (EventEmitter as new () => TypedEmitter<Re
     return resourcesManager
   }
 
+  enrichTransferSnapshot (transfer?: LoadedResourcesTransferrable): LoadedResourcesTransferrable | undefined {
+    if (!transfer) return transfer
+    if (this.itemsAtlasParser?.atlas?.latest) {
+      transfer.itemsAtlasJson = this.itemsAtlasParser.atlas.latest
+    }
+    if (this.blocksAtlasParser?.atlas?.latest) {
+      transfer.blocksAtlasJson = this.blocksAtlasParser.atlas.latest
+    }
+    return transfer
+  }
+
   prepareForTransfer(worker?: Worker) {
     if (worker) {
       // todo do it automatically
@@ -138,21 +220,24 @@ export class ResourcesManager extends (EventEmitter as new () => TypedEmitter<Re
           class: ResourcesManager.restorerName,
           type: 'event',
           eventName,
-          args,
+          args: sanitizeWorkerEventArgs(args),
         })
         // todo handle assetsInventoryReady
         if (eventName === 'assetsTexturesUpdated' || eventName === 'assetsInventoryReady') {
+          const currentResources = this.enrichTransferSnapshot(
+            this.currentResources?.prepareForTransfer(),
+          )
           worker.postMessage({
             class: ResourcesManager.restorerName,
             type: 'newResources',
-            currentResources: this.currentResources?.prepareForTransfer(),
+            currentResources,
           })
         }
       }) as any
     }
     return {
       __restorer: ResourcesManager.restorerName,
-      currentResources: this.currentResources?.prepareForTransfer(),
+      currentResources: this.enrichTransferSnapshot(this.currentResources?.prepareForTransfer()),
     }
   }
 
@@ -305,6 +390,7 @@ export class ResourcesManager extends (EventEmitter as new () => TypedEmitter<Re
 
     this.itemsAtlasParser = new AtlasParser({ latest: itemsAtlas }, itemsCanvas.toDataURL())
     resources.itemsAtlasImage = await createImageBitmap(itemsCanvas)
+    resources.itemsAtlasJson = this.itemsAtlasParser.atlas.latest
   }
 
   async generateGuiTextures() {

package/src/resourcesManager/resourcesManager.worker.test.ts

@@ -0,0 +1,61 @@
+//@ts-nocheck
+import { describe, expect, it, vi } from 'vitest'
+import blocksAtlases from 'mc-assets/dist/blocksAtlases.json'
+import itemsAtlases from 'mc-assets/dist/itemsAtlases.json'
+import blockstatesModels from 'mc-assets/dist/blockStatesModels.json'
+import { AtlasParser } from 'mc-assets/dist/atlasParser'
+import {
+  getItemsDefinitionsStoreForRender,
+  LoadedResourcesTransferrable,
+  ResourcesManager,
+} from './resourcesManager'
+
+vi.mock('../three/documentRenderer', () => ({
+  isWebWorker: true,
+}))
+
+describe('ResourcesManager.rebuildWorkerRenderers', () => {
+  it('creates ItemsRenderer with working modelsStore.get in worker context', () => {
+    const blocksAtlasParser = new AtlasParser(blocksAtlases as any, '')
+    const itemsAtlasParser = new AtlasParser(itemsAtlases as any, '')
+    const resources = new LoadedResourcesTransferrable({
+      version: '1.21.4',
+      texturesVersion: '1.21.4',
+      blockstatesModels,
+      blocksAtlasJson: blocksAtlasParser.atlas.latest,
+      itemsAtlasJson: itemsAtlasParser.atlas.latest,
+      allReady: true,
+    })
+
+    const manager = new ResourcesManager()
+    manager.rebuildWorkerRenderers(resources)
+
+    expect(resources.itemsRenderer).toBeDefined()
+    expect(resources.worldBlockProvider).toBeDefined()
+    const tex = resources.itemsRenderer!.getItemTexture('item/missing_texture')
+    expect(tex).toBeDefined()
+  })
+
+  it('getItemsDefinitionsStoreForRender returns store with .get in worker', () => {
+    const resources = new LoadedResourcesTransferrable({
+      version: '1.21.4',
+      blockstatesModels,
+      blocksAtlasJson: (new AtlasParser(blocksAtlases as any, '')).atlas.latest,
+      itemsDefinitionsStore: { data: { latest: {} }, inclusive: false },
+    })
+    const store = getItemsDefinitionsStoreForRender(resources)
+    expect(typeof store.get).toBe('function')
+  })
+
+  it('falls back to bundled items atlas when itemsAtlasJson is missing', () => {
+    const resources = new LoadedResourcesTransferrable({
+      version: '1.21.4',
+      blockstatesModels,
+      blocksAtlasJson: (new AtlasParser(blocksAtlases as any, '')).atlas.latest,
+    })
+    const manager = new ResourcesManager()
+    manager.rebuildWorkerRenderers(resources)
+    expect(resources.itemsRenderer).toBeDefined()
+    expect(resources.itemsRenderer!.getItemTexture('item/missing_texture')).toBeDefined()
+  })
+})

package/src/three/appShared.ts

@@ -3,7 +3,7 @@ import { BlockModel } from 'mc-assets/dist/types'
 import { ItemSpecificContextProperties } from '../playerState/types'
 import { PlayerStateRenderer } from '../playerState/playerState'
 import { GeneralInputItem, getItemModelName } from '../lib/items'
-import { ResourcesManager, ResourcesManagerTransferred } from '../resourcesManager'
+import { ResourcesManagerTransferred } from '../resourcesManager'
 import { renderSlot } from './renderSlot'
 
 export const getItemUv = (item: Record<string, any>, specificProps: ItemSpecificContextProperties, resourcesManager: ResourcesManagerTransferred, playerState: PlayerStateRenderer): {

package/src/three/chunkMeshManager.ts

@@ -544,6 +544,7 @@ export class ChunkMeshManager {
       this.pendingNearReveal.set(chunkKey, Date.now())
       this.armNearRevealTimer(chunkKey)
       this.armExpectedGraceTimer(chunkKey)
+      this.tryRevealPending()
       return
     }
     this.flushChunkDisplay(chunkKey)
@@ -598,9 +599,8 @@ export class ChunkMeshManager {
    * `chunkKey` is not yet `finishedChunks=true`.
    *
    * Two regimes by `ageMs` (time spent in `pendingNearReveal`):
-   * - Within `EXPECTED_NEAR_GRACE_MS`: walks every expected position in
-   *   the view-distance circle; missing-and-not-finished counts as a
-   *   blocker (catches "far worker beats near worker").
+   * - Within `EXPECTED_NEAR_GRACE_MS`: nearer columns in the circle that are
+   *   loaded but not finished block (far worker beats near worker).
    * - After grace: only actually-loaded-but-not-finished columns block,
    *   so a never-arriving column does not freeze the view.
    */
@@ -633,6 +633,7 @@ export class ChunkMeshManager {
           const oz = (playerCz + dCz) << 4
           const otherKey = `${ox},${oz}`
           if (otherKey === chunkKey) continue
+          if (!loadedChunks[otherKey]) continue
           if (!finishedChunks[otherKey]) return true
         }
       }

package/src/three/entities.ts

@@ -22,7 +22,7 @@ import { createItemMesh } from './itemMesh'
 import * as Entity from './entity/EntityMesh'
 import { getMesh } from './entity/EntityMesh'
 import { WalkingGeneralSwing } from './entity/animations'
-import { disposeObject, loadTexture, loadThreeJsTextureFromUrl } from './threeJsUtils'
+import { disposeObject, loadNearestFilterTexture, loadTexture, loadThreeJsTextureFromUrl } from './threeJsUtils'
 import { armorModel, armorTextures, elytraTexture } from './entity/armorModels'
 import { WorldRendererThree } from './worldRendererThree'
 import { IndexedData } from 'minecraft-data'
@@ -213,6 +213,19 @@ const nametags = {}
 
 const isFirstUpperCase = (str) => str.charAt(0) === str.charAt(0).toUpperCase()
 
+function metadataAsArray (metadata: unknown): unknown[] | undefined {
+  if (metadata == null) return undefined
+  if (Array.isArray(metadata)) return metadata
+  if (typeof metadata === 'object') {
+    const record = metadata as Record<string, unknown>
+    const keys = Object.keys(record).filter((k) => /^\d+$/.test(k)).map(Number).sort((a, b) => a - b)
+    if (keys.length && keys[0] === 0 && keys.every((k, i) => k === i)) {
+      return keys.map((k) => record[String(k)])
+    }
+  }
+  return undefined
+}
+
 function getEntityMesh(mcData: IndexedData | undefined, entity: import('prismarine-entity').Entity & { delete?: any; pos?: any; name?: any }, world: WorldRendererThree, options: { fontFamily: string }, overrides) {
   if (entity.name) {
     try {
@@ -706,7 +719,7 @@ export class Entities {
   uuidPerSkinUrlsCache = {} as Record<string, { skinUrl?: string, capeUrl?: string }>
   currentSkinUrls = {} as Record<string, string>
 
-  private isCanvasBlank(canvas: HTMLCanvasElement): boolean {
+  private isCanvasBlank(canvas: HTMLCanvasElement | OffscreenCanvas): boolean {
     return !canvas.getContext('2d')
       ?.getImageData(0, 0, canvas.width, canvas.height).data
       .some(channel => channel !== 0)
@@ -802,12 +815,10 @@ export class Entities {
       let skinTexture: THREE.Texture
       let skinCanvas: OffscreenCanvas
       if (skinUrl === stevePngUrl) {
-        skinTexture = await steveTexture
-        const canvas = createCanvas(64, 64)
-        const ctx = canvas.getContext('2d')
-        if (!ctx) throw new Error('Failed to get context')
-        ctx.drawImage(skinTexture.image, 0, 0)
-        skinCanvas = canvas
+        const steveSkin = await loadSkinImage(stevePngUrl)
+        playerCustomSkinImage = steveSkin.image
+        skinTexture = new THREE.CanvasTexture(steveSkin.canvas)
+        skinCanvas = steveSkin.canvas
       } else {
         const { canvas, image } = await loadSkinImage(skinUrl)
         playerCustomSkinImage = image
@@ -822,12 +833,12 @@ export class Entities {
       playerObject.skin.modelType = inferModelType(skinCanvas)
       playerObject.skin['isCustom'] = skinUrl !== stevePngUrl
 
-      let earsCanvas: HTMLCanvasElement | undefined
+      let earsCanvas: OffscreenCanvas | undefined
       if (!playerCustomSkinImage) {
         renderEars = false
       } else if (renderEars) {
-        earsCanvas = document.createElement('canvas')
-        loadEarsToCanvasFromSkin(earsCanvas, playerCustomSkinImage)
+        earsCanvas = createCanvas(64, 64)
+        loadEarsToCanvasFromSkin(earsCanvas as unknown as HTMLCanvasElement, playerCustomSkinImage)
         renderEars = !this.isCanvasBlank(earsCanvas)
       }
       if (renderEars) {
@@ -1088,7 +1099,7 @@ export class Entities {
           ? { name: entity.name }
           : entity.name === 'falling_block'
             ? { blockState: entity['objectData'] }
-            : entity.metadata?.find((m: any) => typeof m === 'object' && m?.itemCount)
+            : metadataAsArray(entity.metadata)?.find((m: any) => typeof m === 'object' && m?.itemCount)
         if (item) {
           const object = this.getItemMesh(item, {
             'minecraft:display_context': 'ground',
@@ -1179,7 +1190,8 @@ export class Entities {
 
     const meta = getGeneralEntitiesMetadata(entity, this.mcData)
 
-    const isInvisible = ((entity.metadata?.[0] ?? 0) as unknown as number) & 0x20 || (this.worldRenderer.playerStateReactive.cameraSpectatingEntity === entity.id && this.worldRenderer.playerStateUtils.isSpectator())
+    const meta0 = metadataAsArray(entity.metadata)?.[0] ?? (entity.metadata as { 0?: unknown } | undefined)?.[0]
+    const isInvisible = ((meta0 ?? 0) as unknown as number) & 0x20 || (this.worldRenderer.playerStateReactive.cameraSpectatingEntity === entity.id && this.worldRenderer.playerStateUtils.isSpectator())
     for (const child of mesh!.children ?? []) {
       if (child.name !== 'nametag') {
         child.visible = !isInvisible
@@ -1514,12 +1526,8 @@ export class Entities {
   }
 
   loadMap(data: any) {
-    const texture = new THREE.TextureLoader().load(data)
-    if (texture) {
-      texture.magFilter = THREE.NearestFilter
-      texture.minFilter = THREE.NearestFilter
-      texture.needsUpdate = true
-    }
+    const texture = loadNearestFilterTexture(data)
+    texture.needsUpdate = true
     return texture
   }
 

package/src/three/entity/EntityMesh.ts

@@ -8,7 +8,7 @@ import ocelotPng from 'mc-assets/dist/other-textures/latest/entity/cat/ocelot.pn
 import arrowTexture from 'mc-assets/dist/other-textures/1.21.2/entity/projectiles/arrow.png'
 import spectralArrowTexture from 'mc-assets/dist/other-textures/1.21.2/entity/projectiles/spectral_arrow.png'
 import tippedArrowTexture from 'mc-assets/dist/other-textures/1.21.2/entity/projectiles/tipped_arrow.png'
-import { loadTexture } from '../threeJsUtils'
+import { loadNearestFilterTexture, loadTexture } from '../threeJsUtils'
 import { WorldRendererThree } from '../worldRendererThree'
 import entities from './entities.json'
 import { externalModels } from './objModels'
@@ -505,9 +505,7 @@ export class EntityMesh {
                 partRoot.position.set(x, y, z)
               }
               if (metadata?.texture) {
-                const texture = new THREE.TextureLoader().load(metadata.texture)
-                texture.minFilter = THREE.NearestFilter
-                texture.magFilter = THREE.NearestFilter
+                const texture = loadNearestFilterTexture(metadata.texture)
                 partRoot.traverse((child) => {
                   if (child instanceof THREE.Mesh) {
                     child.material = new THREE.MeshBasicMaterial({
@@ -547,9 +545,7 @@ export class EntityMesh {
               obj.position.set(x, y, z)
             }
             if (metadata?.texture) {
-              const texture = new THREE.TextureLoader().load(metadata.texture)
-              texture.minFilter = THREE.NearestFilter
-              texture.magFilter = THREE.NearestFilter
+              const texture = loadNearestFilterTexture(metadata.texture)
               const material = new THREE.MeshBasicMaterial({
                 map: texture,
                 transparent: true,
@@ -616,9 +612,7 @@ export class EntityMesh {
         debugFlags.isHardcodedTexture = true
       }
       if (!texturePath) throw new Error(`No texture for ${type}`)
-      const texture = new THREE.TextureLoader().load(texturePath)
-      texture.minFilter = THREE.NearestFilter
-      texture.magFilter = THREE.NearestFilter
+      const texture = loadNearestFilterTexture(texturePath)
       const material = new THREE.MeshBasicMaterial({
         map: texture,
         transparent: true,

package/src/three/graphicsBackendBase.ts

@@ -149,23 +149,33 @@ export const createGraphicsBackendBase = () => {
 
   const startMenuBackground = async (menuBackgroundStartOptions?: MenuBackgroundOptions) => {
     if (!documentRenderer) throw new Error('Document renderer not initialized')
-    if (worldRenderer) return
 
-    if (!menuBackgroundRenderer) {
-      const mergedOptions: MenuBackgroundOptions = {
-        ...initOptions.config.menuBackground,
-        ...menuBackgroundStartOptions
-      }
-      menuBackgroundRenderer = new MenuBackgroundRenderer(
-        documentRenderer,
-        { ...initOptions },
-        mergedOptions,
-        !!process.env.SINGLE_FILE_BUILD_MODE
-      )
-      callModsMethod('menuBackgroundCreated', menuBackgroundRenderer)
-      await menuBackgroundRenderer.start(mergedOptions)
-      callModsMethod('menuBackgroundReady', menuBackgroundRenderer)
+    if (worldRenderer) {
+      worldRenderer.destroy()
+      worldRenderer = null
+      frameTimingCollector = null
+      ;(globalThis as any).world = undefined
+      ;(globalThis as any).frameTimingCollector = undefined
+    }
+
+    if (menuBackgroundRenderer) {
+      menuBackgroundRenderer.dispose()
+      menuBackgroundRenderer = null
+    }
+
+    const mergedOptions: MenuBackgroundOptions = {
+      ...initOptions.config.menuBackground,
+      ...menuBackgroundStartOptions
     }
+    menuBackgroundRenderer = new MenuBackgroundRenderer(
+      documentRenderer,
+      { ...initOptions },
+      mergedOptions,
+      !!process.env.SINGLE_FILE_BUILD_MODE
+    )
+    callModsMethod('menuBackgroundCreated', menuBackgroundRenderer)
+    await menuBackgroundRenderer.start(mergedOptions)
+    callModsMethod('menuBackgroundReady', menuBackgroundRenderer)
   }
 
   const startWorld = async (displayOptionsArg: DisplayWorldOptions) => {

package/src/three/graphicsBackendOffThread.ts

@@ -2,9 +2,11 @@
 import * as THREE from 'three'
 import { GraphicsBackend, GraphicsBackendLoader } from '../graphicsBackend'
 import { useWorkerProxy, deepPrepareForTransfer, findProblemTransfer } from '../lib/workerProxy'
-import { meshersSendMcData } from '../lib/worldrendererCommon'
+import { meshersSendMcDataAwait } from '../lib/worldrendererCommon'
 import { dynamicMcDataFiles } from '../lib/buildSharedConfig.mjs'
 import { addNewStat } from '../lib/ui/newStats'
+import type { MenuBackgroundOptions } from './menuBackground/types'
+import { MENU_BACKGROUND_MC_VERSION } from './menuBackground/shared'
 import { createGraphicsBackendBase, type ThreeJsBackendMethods } from './graphicsBackendBase'
 import { addCanvasForWorker } from './documentRenderer'
 
@@ -58,14 +60,36 @@ export const createGraphicsBackendOffThread: GraphicsBackendLoader = async (init
   const backend: GraphicsBackend = {
     id: 'threejs',
     displayName: `three.js ${THREE.REVISION}`,
-    async startMenuBackground() { },
+    async startMenuBackground(menuBackgroundStartOptions?: MenuBackgroundOptions) {
+      const mcData = menuBackgroundStartOptions?.resourcesManager?.currentResources?.mcData
+      if (mcData) {
+        const workerThreeSendData = {
+          ...dynamicMcDataFiles,
+          items: 'itemsArray',
+          entities: 'entitiesArray',
+        }
+        await meshersSendMcDataAwait([worker], MENU_BACKGROUND_MC_VERSION, workerThreeSendData, mcData)
+      }
+      const prepared = deepPrepareForTransfer(menuBackgroundStartOptions ?? {}, worker)
+      try {
+        await proxy.startMenuBackground(structuredClone(prepared))
+      } catch (err) {
+        findProblemTransfer(prepared)
+        throw err
+      }
+    },
     async startWorld(options) {
       const workerThreeSendData = {
         ...dynamicMcDataFiles,
         items: 'itemsArray',
         entities: 'entitiesArray',
       }
-      meshersSendMcData([worker], options.version, workerThreeSendData, options.resourcesManager.currentResources.mcData)
+      await meshersSendMcDataAwait(
+        [worker],
+        options.version,
+        workerThreeSendData,
+        options.resourcesManager.currentResources.mcData
+      )
       console.log('mc data sent to three worker')
 
       options.inWorldRenderingConfig['__syncToWorker'] = true

package/src/three/hand.ts

@@ -1,13 +1,13 @@
 //@ts-nocheck
 import * as THREE from 'three'
-import { loadSkinFromUsername, loadSkinImage } from '../lib/utils/skins'
-import { steveTexture } from './entities'
+import { loadSkinFromUsername, loadSkinImage, stevePngUrl } from '../lib/utils/skins'
 
 
 export const getMyHand = async (image?: string, userName?: string) => {
   let newMap: THREE.Texture
   if (!image && !userName) {
-    newMap = await steveTexture
+    const { canvas } = await loadSkinImage(stevePngUrl)
+    newMap = new THREE.CanvasTexture(canvas)
   } else {
     if (!image) {
       image = await loadSkinFromUsername(userName!, 'skin')

package/src/three/itemMesh.ts

@@ -1,6 +1,19 @@
 //@ts-nocheck
 import * as THREE from 'three'
 
+/** Canvas used for item texture extraction (main thread or worker). */
+export type ItemTextureCanvas = HTMLCanvasElement | OffscreenCanvas
+
+function createItemTextureCanvas (width: number, height: number): ItemTextureCanvas {
+  if (typeof document !== 'undefined') {
+    const canvas = document.createElement('canvas')
+    canvas.width = width
+    canvas.height = height
+    return canvas
+  }
+  return new OffscreenCanvas(width, height)
+}
+
 export interface Create3DItemMeshOptions {
   depth: number
   pixelSize?: number
@@ -17,7 +30,7 @@ export interface Create3DItemMeshResult {
  * from a canvas containing the item texture
  */
 export function create3DItemMesh (
-  canvas: HTMLCanvasElement,
+  canvas: ItemTextureCanvas,
   options: Create3DItemMeshOptions
 ): Create3DItemMeshResult {
   const { depth, pixelSize } = options
@@ -246,18 +259,18 @@ export interface ItemMeshResult {
 export function extractItemTextureToCanvas (
   sourceTexture: THREE.Texture,
   textureInfo: ItemTextureInfo
-): HTMLCanvasElement {
+): ItemTextureCanvas {
   const { u, v, sizeX, sizeY } = textureInfo
 
   // Calculate canvas size - fix the calculation
   const canvasWidth = Math.max(1, Math.floor(sizeX * sourceTexture.image.width))
   const canvasHeight = Math.max(1, Math.floor(sizeY * sourceTexture.image.height))
 
-  const canvas = document.createElement('canvas')
-  canvas.width = canvasWidth
-  canvas.height = canvasHeight
-
-  const ctx = canvas.getContext('2d')!
+  const canvas = createItemTextureCanvas(canvasWidth, canvasHeight)
+  const ctx = canvas.getContext('2d') as CanvasRenderingContext2D | OffscreenCanvasRenderingContext2D | null
+  if (!ctx) {
+    throw new Error('Failed to get 2d context for item texture canvas')
+  }
   ctx.imageSmoothingEnabled = false
 
   // Draw the item texture region to canvas

package/src/three/menuBackground/assetUrl.ts

@@ -0,0 +1,15 @@
+//@ts-nocheck
+export function menuBackgroundAssetUrl (...segments: string[]): string {
+  const relative = segments.filter(s => s.length > 0).join('/')
+  const base =
+    typeof globalThis.location !== 'undefined' && globalThis.location.href
+      ? globalThis.location.href
+      : typeof import.meta !== 'undefined' && import.meta.url
+        ? import.meta.url
+        : `/${relative}`
+  try {
+    return new URL(relative, base).href
+  } catch {
+    return `/${relative}`
+  }
+}