Image library lag

Bug Reports
1

I have been experiencing some major lag with the library, in which I have about 50 images. It takes more than 5 seconds to load all of them and when I scroll frames are dropping like crazy!

2

Do you mean your own images you've imported to the Design area? Or are you talking about something in Components?

If components, yes, there's a ton of lag if you mouse over any of them when it's loading each of their little popups. I've been meaning to report that, but I keep forgetting.

If you mean images you've uploaded, I've got a directory that has well over 50 images in it and have no lag at all, and that's after playing Borderlands 2 for a while even. I'm on a Mac though so that may be part of it if you're not. Just shooting this out here in case it makes any difference to the Devs, and to clarify that it's not an issue for me on my Mac.

3

I have only noticed it with the images I've uploaded. I'm on Win 10

4

Sorry that you've run into problems!

To quickly narrow down and fix the issue, can you answer these questions:

  1. Are the images imported in your library, or are they uploaded to your server and only references by a URL?
  2. How large are the images (in terms of filesize)?
  3. Are the images inserted into the page?
  4. Where are you seeing the slowdowns - only when opening the design, or all the time?
5
  1. They are imported into BSS's image library they are not URL references
  2. The average size is 800kb
  3. They are inserted into a page with an image component
    • opening the design takes 3-4 seconds (and I have an SSD)
    • after inserting an image component to a page and double clicking on it, it takes ~5 seconds to load the library
    • scrolling thru the library mentioned above I have noticed that BSS uses ~45% of CPU and ~500MB of RAM
6

Thanks for the info! Right now Bootstrap Studio displays your images in their full size when opening the Image Chooser dialog. 50 images each weighing in at 800kb is a lot of data to process. We will optimize this in the future by generating thumbnails for the images when they are imported.

A relatively easy workaround is to not store so many high-res images in Bootstrap Studio or to resize them. If you upload them to your server instead of importing them in the app, you can link them by URL.