Preloading resources: Subsets, Many resources, CDN?

URL of experiment:

Description of the problem:
I’m working with @dgfitch on an experiment that uses several stimulus sets with hundreds of small stimuli in each set.

Right now, we have resource preloading working (thanks to your help!) but! It’s pretty slow — we’re loading 384 little (~30k) image stimuli for one set and it takes a bit over two minutes to get everything loaded. And if we put all the stimulus sets in there, it’ll preload all of them, even though we’ll only show any given ppt one set.

Watching in my browser dev tools, it looks like the requests are being made sequentially rather than in parallel. Also, there are a couple 301 redirects in each resource’s request, each of which involves a round-trip to, which is about 6000 km from here and hence adds about 100ms latency to each request.

So, a few questions:

  1. Is there a way to preload only a subset of stimuli from /resources into an experiment?
  2. Is there a way to parallelize loading stimuli?
  3. Can we escape the 301 redirect in request loading somehow?
  4. Is there a way to load resources from somewhere other than pavlovia — say, a CDN?



Hi Nate, I have one of the same questions-- did you figure out how to load a subset of images?

For anyone: for each participant in my study, I’d like to load a subset of ~100 randomly selected .png images out of a total pool of ~800. I’ll have startup code selecting the random subset (or can generate prerandomized xls lists) and am trying to figure out how the unique subset image arrays would be passed to


so that I could avoid default loading all 800 images in the resources folder, which takes a long time. I would just design this differently but am trying to recreate a study started in the lab. Thanks!

Hi Nate and Ewing,

I have the same problem. Did anyone find a solution?

Thanks a lot!

Best, Katrin

If found some interesting info here:

From what I understand you basically have to change the JS from:



  resources: [
    // relative path to index.html
    { name: 'trialTypes_A.xls', path: 'trialTypes_A.xls' },
    // absolute path:
    { name: 'trialTypes_B.xls', path: '' }

and then, your script will not load all resource files by default but instead only the ones that you specified. The question is now: how can I include this in my PsychoPy–>PsychoJS script? The builder always overrides changes in the PsychoJS script. But perhaps I can use the PsychoJS script made from the builder, make my changes there and upload it in a new project where I don’t use the builder?

Any thoughts anyone?


Best, Katrin


I’ve done this within a code component. Check my crib sheet for details:

The code looks like this:

{ name: (expInfo["participant"] + "s.jpg"), path: ("../faces/" + expInfo["participant"] + "s.jpg") },
{ name: (expInfo["participant"] + ".jpg"), path: ("../faces/" + expInfo["participant"] + ".jpg") }

Make sure you start downloading while the participant is reading the instructions. The experiment will fail if it tries to use a resource it hasn’t downloaded yet.

Best wishes,


Hi Wakefield, thanks a lot for the excellent advice!!! Also, your crib sheet is really helpful! It took me a while to get your code run, but now it finally works. I have the feeling that my videos play a little bit less smooth, though. Can that be the case? For instance, because the video that is currently played was already downloaded but the following videos are still downloading? Or is it just my impression? Thanks a lot again! All the best, Katrin

I think that if you look at the user messages in the console you’ll see how long it takes to download the videos. I can imagine that watching one while downloading others could cause lags.

Are you skipping through the instructions faster than a participant would? You could put some of the videos in html/resources so they download before the start.

Yes, this might be it… I will look into it! Thanks again!!

Just wanted to thank you again, its working now perfectly :blush: