Hi, Ive developed an app “Noshous” a on demand convenience store. It loads the menu on average 9- 10 secs and wondering why would be loading this slow. With 1-2 items on the menu instant. But, with each item being added it slows down a bit more than previous. Everything else on the pge isnt a concern i.e. Tracking info, Promotions, checkout. 2nd would upgrading even noticably improve RPG load speeds? I have read around on the forums that it could it could be my UX and not a bubble thing. I have tried boosting the server but it doesnt seem like a huge difference is made. Overall no complaints with bubbl😃. thanks in advance- Mike.
1 Like
Hi @marsj3716 
This might not do the trick, but the “cips” repeating group currently uses this data source:
(1 constraint in the Search)
(5 filtered constraints)
Since those filtered constraints can be put into the “Do a Search For” part of the expression, I would recommend removing the :filtered part of the expression completely, and adding those as search constraints (so the expression is “Do a Search for Products with 5 constraints”).
This is because currently, Bubble is loading/bringing back all of the Products which meet the search constraint “Arrived 2 doesn’t contain FREE” in the “Do a Search for” part, and then 1-by-1 filtering all of the Products that don’t meet the five :filtered constraints here:
It should be faster if you move all of the constraints to the “Do a Search For” part of the expression in this case, but let me know if not!
1 Like
Thanks! That helped a tad bit. Still kind of “in the way”. Its not a huge list… My worry is scaling Im adding products weekly and Its less than 50 products not even half inventory… any other suggestions?
Thanks! That helped a tad bit. Still kind of “in the way”. Its not a huge list… My worry is scaling Im adding products weekly and Its less than 50 products not even half inventory… any other suggestions?
@marsj3716 No problem at all! 
From my understanding, I don’t believe it should be that slow with only ~75 products. I’ve heard different things in the forum about this, but in my experience, image file size has slowed down my app’s page load times. It looks like some of the Product images are large (1500pixels by 1500 pixels), so it might be worth a try to see if there’s a difference without them.
Just so you don’t make significant changes to your existing app, could you clone your app, remove some of those larger images, and see if there is a difference in the page load time?
I attempted that huge difference. files size sounds like it could be it. any way to reduce it or speed it up without affecting my layout? Thanks for the replys.
Awesome! Glad to hear it made a difference I would first delete the large images from your app’s storage since you won’t be displaying them. In order to make the images smaller, I like to use Kraken.io’s image optimizer/resizer (I’m not affiliated with Kraken, just a fan!). If you sign up for an account with them (free), then click their “Web Interface PRO - File Uploader” once you’re logged in, you can optimize and resize images at one time. Once you’re done, you can download them all in a folder, and reupload to Bubble.
I’m not sure if this would help, but you could have two images for each Product: a thumbnail image (~110 pixels in width), and a somewhat larger image of each product in a second image field. The thumbnails might help with the initial page load speed, and then you can show the larger images once a Product is clicked.
1 Like
Hey Faye
Hope your well
Following on from your suggestions what would you suggest for Users that upload there own images?. What would you suggest in this scenario is there any API or Plugins you would suggest?
Thanks
Hi @i.naseem.in24 Hope all is well with you too!
Edit: I haven’t tested this, but it looks like this Uploadcare plugin allows you to re-size images uploaded to Bubble:
Kraken has an API; I assume a plugin could be created for this, similar to the existing Uploadcare plugins. Their docs state that you can use their API to directly upload images to Kraken, or you can pass the URL of the Bubble-uploaded image to Kraken, keep the Kraken version and delete the original Bubble image. I wish I had a better idea of how complicated it would be to create a plugin for it, but I’m not sure. 
@fayewatson, Thanks!
something to look into I guess, as the platform i am building relies heavily on user input and imagery/product images uploading so likely could cause me problems if it creates long times to retrieval images from the db
all work in progress i guess
@i.naseem.in24 No problem at all!
Totally agree - always a work in progress But that’s awesome you’re trying to optimize it! I’m going to test this UploadCare plugin later and will post back a demo on it as long as I can get it working:
2 Likes
Thanks Faye! Will check that out! I will be posting an update on that 
1 Like
Hi! I tried out the Kraken io and it most def improved the load speeds, Id say by like 5-6 seconds. Its not “lightning” fast which is my main peeve It originally was like 10 sec loading time but its way better than before. Do you think uploading digital photos are gonna improve the UX in comparison to kraken?
@marsj3716 Awesome! So glad to hear it’s a little faster!
Are you asking if uploading photos will be faster than uploading from Kraken? If so, I think it more so just depends on the file size of the image, but digital photos will most likely be smaller than the 1500 pixels size. You may be able to find smaller images through Creative Commons that are labeled for “Reuse with Modification for Commercial Purposes”:
https://www.google.com/search?q=chips&site=imghp&tbs=isz:i,sur:fmc&tbm=isch&chips=q:chips,g_1:lays:bOlIM14a7Co=&source=lnt&sa=X&ved=0ahUKEwjwlfjE3b_gAhVir1QKHSn_DrIQpwUIIA&biw=1280&bih=666&dpr=2
Let me know if that helps!
@i.naseem.in24, @marsj3716, Sorry for the delay on the UploadCare demo! The free plugins works perfectly. The plugin creator has a very helpful demo here as well with a ton of picture editing options:
Preview:
https://uploadcare.bubbleapps.io/
Editor:
Link to Plugin Code/Docs:
The demo doesn’t include the resize function, but I’ve added it a new demo here:
Preview:
Editor:
In summary, there are two custom states set on this page to keep track of the uploaded image’s “token” and “Upload_Info” from UploadCare, after an image is uploaded to UploadCare:
The first group contains a picture uploader and a button:
When the Upload this to Uploadcare button is clicked, the “token” custom state is set, and it uses the expression:
“Get Data From External API”
API: UploadCare - UploadURL
(path) source_url: Picture Uploader A’s value (the picture that was just uploaded)
*Be sure to select “UploadCare - Upload URL’s token” for the value of this custom state.
The second group contains the “Get Upload Info” button, which will display the information of the image that was uploaded to UploadCare in Group 1:
When the “Get Upload Info” button is clicked, the “Upload_Info” custom state is set using this expression:
“Get Data From External API”
API: UploadCare - Upload Status"
(path) Token: index’s token (the UploadCare image token that was saved to the index page’s “token” custom state in the first step)
The third group contains a single image element which resizes the image using the expression:
“Get Data From External API”
API: UploadCare - Image Transform
(path) operation: resize
(path) parameters: 200x
(200x makes the image very small. Here is more information about the different parameters that you can use for the resize operation)
Once you’ve resized the image, you can delete the original, larger file from your app’s storage:
Then save the smaller, UploadCare image URL to the field you need:
And that should work! Feel free to let me know if you have any questions!
2 Likes
Hi! The app is almost back to its original speeds 
Its mainly on load with the main menu is my concern. Its just unfortunate to lose app downloads due to speed
But popups, groups, or w/e are on the fly 
But, Im also thinking it has something to do with the more images i put in Te images are only like less than or around 100kb.
Both Kraken.io and Uploadcare sounds interesting. I saw that Kraken let you configured a callback free (faster). Call Kraken from API connector is relatively easy. Kraken interface sound more robuste. Illusion? Setup time: 5 min.!
thanks @fayewatson for the demo explanation.
Kraken: We highly recommend use of the “callback_url” option over the “wait” option, as it eliminates the possibility of a request timeout occurring where large files are being Kraked.
EDIT: Kraken with Bubble API Connector is working fine. Great product. I compressed a 287k image to 4.3k in less than 1 second.
{
“auth”: {
“api_key”: “public key from Kraken”,
“api_secret”: “your private key from Kraken”
},
“url”: “https://cdn.pixabay.com/photo/2016/06/18/17/42/image-1465348_1280.jpg”,
“wait”: true,
“resize”: {
“width”: 75,
“height”: 75,
“strategy”: “auto”,
“enhance”: true
}
}
Here:
Result:
1 Like
@marsj3716 Are you experiencing the long load time when viewing this page as a logged-in User?
https://noshous.com/version-test/main_menu
If so, can you possibly clone the app, and set the cloned app to “Everyone can edit”? This will allow others to view the page as a logged-in User.