Wait for object loader

Unless you’re able to use newer JavaScript features like async/await, network requests don’t prevent execution of the next line of code. Synchronous requests, which completely freeze the page, are possible but strongly deprecated.

Most three.js users rely on callbacks, as @marquizzo suggests. This does require structuring your code so that code after the .load(...) line does not depend on the result of the loading operation.

Another alternative is async/await. It’s a newer feature and less familiar to many JS devs, but it does basically what you want:

const result = await loader.loadAsync('model.glb');

In this example the keyword ‘await’ is critical, and the function where this code runs must itself be an async function.

You can find longer explanations of the various options (callbacks, promises, async/await) in this article:

https://eloquentjavascript.net/11_async.html

2 Likes