Firefox finalisation is longer than Edge

[chdenat]

My UC: A record of some WebGL canvases.
Before downloading or sharing the video, the user needs to finalise it.

On Edge, the finalisation process takes less than one second, even for a one-minute video.
On Firefox (Linux or Windows), finalising a 25-second video takes more than three minutes.

I've checked several codecs and it's the same issue every time.

Has anyone else experienced similar problems?

            // Initialize output with MP4 format
            this.#output = new Output({
                                          format: new Mp4OutputFormat({fastStart: false}),
                                          target: new BufferTarget(),
                                      })

            // Configure video source
            this.#videoSource = new CanvasSource(this.#outputCanvas, {
                codec:   'av1',
                bitrate: this.#quality.value,
                latencyMode: 'quality',
                keyFrameInterval: 5,
            })

            this.#output.addVideoTrack(this.#videoSource)

            // Track total bytes written
            this.#output.target.onwrite = (start, end) => {
                this.#size += end - start
                const now = Date.now()
                if (now - this.#lastWriteLogTime >= this.#timeslice) {
                    this.#lastWriteLogTime = now
                }
            }

            await this.#output.start()

            // frame loop ...
            
            this.#output.finalize()
            
            ....

[Vanilagy]

Please post this under issues, not discussion. Also, please post a simplified version of the "frame loop" as it's also important. Finalization must wait for all encoders to finish first. Maybe you're not awaiting smth in the frame loop.

And if something takes long, just do a performance profile.