Forum Documentation Showcase Pricing Learn more

Dynamic image for background fails to load on first page load

Typically, on the first load, no image shows up no matter how long you wait. If you refresh, you get the image instantly. The image I’m using is 200kb so it’s not really a file size issue.

I saved the image in my database, gave it name, then used dynamic data for the background. I did a search for that database and used the name as a constraint to fetch the image, and processed it with Imgix. I’m disappointed because the image quality for static images is terrible and you can’t use imgix.

Hi Rob,

A few questions:

  • Which browser are you using?
  • What type of image (JPG, PNG, SVG)?
  • How did you save it to the DB?
  • Do you really need it to be dynamic? If it’s a static design element, why not simply use the Static image property on the Appearance tab of the property editor to assign the image as the background?

Also, FWIW, I think Imgix awesome - one of the lesser understood and appreciated features of Bubble IMO.

Thanks for the reply. Tried chrome, safari, and brave on Mac OS latest version. Tried on multiple machines. As well as iphone.
I’ve tried JPG and PNG with various levels of compression.
Created a table with two fields, image and name. I upload the image and name it “background”.
I don’t need it to be dynamic. My problem with static though is that it compresses the image automatically into something kind of ugly. Because of this bug, I’m currently using static because some image is better than nothing, and you can see it at https://www.cone.network

First of all, I don’t understand the benefit of adding the image to the database. Just add it as a Static image for the element’s background, and then append “?ignore_imgix” to the URL that appears in the Dynamic image field as described here. That will bypass Imgix processing.

:warning: A word of caution, however: You should make sure the image is optimized for the web before uploading it if you go this route. The whole point of Imgix is to handle website image optimizations “behind the scenes”, and since you’re bypassing that functionality, you’ll have to do it yourself, or page load performance might suffer.

FWIW, I looked at your page, and the image looks fine to me.

That’s great. That works for me. Thank you Shot.
I’d still say that the dynamic image not loading though is a bug and this is a suitable workaround in my specific case. If I wanted a different background image for different users, for example, I’d be SOL.

This topic was automatically closed after 14 days. New replies are no longer allowed.