Is the value of the 'lengthComputable' attribute always false when loading the glb model?

Questions
1

Is the value of the ‘lengthComputable’ attribute always false when loading the glb model? What should I do if I want to calculate the progress of loading the glb model

2

LengthComputable will get its value from the underlying XMLHttpRequest: ProgressEvent: lengthComputable property - Web APIs | MDN (mozilla.org). From this javascript - Why is ProgressEvent.lengthComputable false? - Stack Overflow it seems good to check if the Content-Length property is being returned.

1 Like
3

This helped me resolve my problem with displaying progress to the user, so I am sharing.

When loading a compressed file, in my case with gzip, the lengthComputable is always set to false. The way I got around it was to serve the file with a custom header (something like X-File-Size) that was holding the original uncompressed file size. Before loading the model to the scene, I am doing a HEAD request to obtain this header. Then I just used the value in an onProgress callback.

// 1. Obtain the header
const response = await fetch(url, { method: 'HEAD' })
const originalFileSize = Number(response.headers.get('X-File-Size'))

// 2. Use it in the progress function
const onProgress = ({ loaded }: ISceneLoaderProgressEvent) => {
  console.log(`progress is ${(loaded / originalFileSize) * 100} %`)
}

// 3. Import the model
SceneLoader.ImportMeshAsync(undefined, url, undefined, scene, onProgress)

Need to say that I don’t run this exact code snippet in my app, but you can get the gist of it. Also, you probably don’t want to await the HEAD request, but instead, consider the progress “indeterminate” until you receive a response in the background. At least that’s what I’m doing.

1 Like