Video and Audio lag in psychopy when running on pavlovia

Online experiments
1

URL of experiment: Pavlovia

Description of the problem:

Hi everyone,

I’m running an online experiment on Pavlovia that involves playing several video clips, and I’ve been encountering issues with video playback. Specifically, I’ve noticed that videos sometimes lag or buffer when the experiment is run online, even though the same experiment works perfectly when run locally.

Here are some details about the setup:

  • Video files: H.264 MP4 videos with AAC audio codec, resolution 640x480, average bitrate ~128kbps.
  • Experiment setup: Created in PsychoPy Builder (v2024.2.4) with auto-JS enabled.
  • Preloading: Using the Resource Manager to preload videos and a static component to buffer resources before the routine.
  • Problem: Videos take a while to load on certain browsers (e.g., Chrome) and lag during playback, especially when tested online. Interestingly, this issue doesn’t seem to occur on Safari.

Steps I’ve Taken:

  1. Re-encoded videos to reduce size and improve compatibility (H.264 with AAC audio, constant bitrate).
  2. Used Resource Manager to preload the videos and added debugging to confirm that the resources are queued for download.
  3. Tested locally (no issues) and online using Chrome and Safari. Safari seems to work fine, but Chrome sometimes lags, and I’m not sure if it’s preloading videos properly.
  4. Tried a static component before video routines to load the files explicitly. This hasn’t solved the problem either.
  5. Added performance logging to check for video load times and resource statuses.

My Questions:

  1. How can I ensure that videos are preloaded and ready to play without buffering? Is there a specific workflow for using the Resource Manager with video components to avoid this issue?
  2. How can I test whether videos are playing from the preloaded resources? It’s unclear if the buffering is due to videos not being preloaded or if it’s something else.
  3. Has anyone experienced browser-specific issues with video playback on Pavlovia? Safari seems fine, but Chrome has buffering issues, and I’m concerned about participants using different setups.

Additional Context:

I’ve added debugging code to log video start times and resource statuses. I’m open to suggestions on alternative ways to preload or handle videos online.

Thanks in advance for your help! I’d appreciate any insights or solutions to get smoother video playback on Pavlovia.

Best,
Luca

2

Solution: Resolved Video Lag Issue on Pavlovia

The video lag issue was caused by how the video files were encoded. Initially, we tried using various advanced encoding settings, but the solution turned out to be much simpler than expected.

Here’s what worked:

  1. Open the video file in VLC Media Player.
  2. Go to Media > Convert/Save.
  3. Choose Convert, and in the settings, select MP4 as the output format without tweaking any additional encoding settings.
  4. Save and use the newly converted video file in the experiment.

This straightforward re-encoding process resolved all lag issues, and the videos now play smoothly in Pavlovia. Hopefully, this helps anyone else facing similar problems!