Best practices

Question

I’m re-developing an old website where there was flash games in it. I redeveloped some games, all under godot, and I rebuilt Godot from source to disable unwanted modules (like 3D physics for example)

The godot.wasm still takes like 29 Mb, that’s not that big of a problem, but it becomes one when I switch from one game to another, because of CPU usage. When I open a page containing the game, it freezes my page for 2-3 sec (on a mac M2 max). If this problem was once the page was loaded, it would be fine, but I have many games on the website and those latencies are encountered for each game loaded.

Each game is in a separate repository, so I compile 1 game at a time, giving me 1 pck per game.

I use a Vue SPA app, and here’s what I tried :

const engineInstance = shallowRef(new Engine({
  /* ... my params here, without mainPack */
  executable: '/gamesdata/godot',
  fileSizes: {
    '/gamesdata/godot.wasm': 29107076,
  },
}))
const isEngineLoaded = ref(false)
const currentPck = ref(null)

engineInstance.value.init('/gamesdata/godot').then(() => {isEngineLoaded.value = true})

export function useGodot() {
  const loadPck = async (pckPath, canvasElement, sizeOfPck, args = []) => {
    if (!engineInstance.value || !isEngineLoaded.value) {
      throw new Error('Engine not initialized')
    }
    args = ['--main-pack', pckPath, ...args]

    // Load new PCK
    await engineInstance.value.preloadFile(pckPath, pckPath, sizeOfPck)
    await engineInstance.value.start({
      args,
      canvas: canvasElement.id,
      mainPack: pckPath,
    })
    currentPck.value = pckPath
  }
}

I was testing this to avoid loading multiple times the same wasm in memory, but I figured out that I must call Engine.init() no matter what.

Is there a solution to avoid high CPU usage or to avoid loading the godot wasm multiple times ? How can I optimize ?

Thanks

Improve this question