Page 2 of 3

Re: Large number of images in a data grid

Posted: Tue Dec 25, 2018 6:57 pm
by jacque
Datagrids natively page their contents as they scroll, so you don't need to script that. The problem is likely the number and size of the images. Have you saved the thumbnails at their smallest size and resolution, or are you using full-sized images that are just scaled down in the IDE? A lot of work goes on to expand, scale, and draw images to screen, so smaller is faster.

Smaller refers primarily to the number of pixels in the image rather than the actual dimensions. Color depth matters too, if you are saving the images with millions of colors the actual file will be a magnitude larger than the same image saved at 8 or 16 bits. 8-bit color isn't usually great but 16 might do for such small images.

You could also save the image in an uncompressed format like BMP which would eliminate the need for the engine to decompress the file. The files would be larger on disk but would load faster.

Re: Large number of images in a data grid

Posted: Wed Dec 26, 2018 1:28 am
by hopkins
Thanks. I tried setting the paintCompression global setting to PICT before saving the thumbnails, and it seems to make the display a little quicker.

Re: Large number of images in a data grid

Posted: Wed Dec 26, 2018 5:45 pm
by jacque
How large are the images in bytes? That's the main thing. Is the width of the image the same size as the formattedWidth?

Re: Large number of images in a data grid

Posted: Wed Dec 26, 2018 7:50 pm
by hopkins
The images are 150x150 and are not resized in the data grid. They are roughly 30 to 50 Kb each. That corresponds to 75MB for 1500 pictures at 50kb.

I made some tests, and the size can be halved by saving them as 256 color BMP, or to about 5Kb in JPEG, without losing quality, it seems.

How would I go about transforming the format and number of colors within LiveCode ? EDIT: maybe use "export with palette" to copy it to another image with a specific number of colors ? seems to have been done here: https://forums.livecode.com/viewtopic.php?t=22080

Got it to work. Will play around with various formats. Thanks for the inputs.

Re: Large number of images in a data grid

Posted: Wed Dec 26, 2018 11:49 pm
by jacque
Glad you found that, I wasn't aware of the "with palette" parameter. If you use JPG format then each image will have to go through the decompresion process which adds a slight overhead, so if you you can get it work with an uncompressed image format you'll save a bit of time.

Re: Large number of images in a data grid

Posted: Fri Jan 04, 2019 1:42 am
by hopkins
The performance of data grids is really disapppointing. I am testing instead a browser widget with generated html code containing the url of the images, and it seems to work well. I will confirm...

Re: Large number of images in a data grid

Posted: Fri Jan 04, 2019 2:50 am
by hopkins
It is "lightning" fast with a widget !

Re: Large number of images in a data grid

Posted: Fri Jan 04, 2019 5:40 am
by trevordevore
For your needs a browser may give you the best results. I just skimmed through this thread and wanted to mention a couple of things though -

1. For a large data set that is displaying lots of images do not turn caching on. There is an initial slowdown when loading the data and it won't scale well if your data set increases.
2. Rather than converting the SQL cursor to an array and assigning it to the dgData it would be much more efficient use the GetDataForLine callback to feed data to the DataGrid on an as-needed basis. Here is a brief article on it:

http://lessons.livecode.com/m/datagrid/ ... ts-of-data

When using a database connection the approach would be as follows:

1. Open a database cursor using revQueryDatabase() and store the cursor id in a script local variable that you can pass to revdb handlers.
2. Set the dgNumberOfRecords of the DataGrid to revNumberOfRecords().
3. In the GetDataForLine command that you define pass pLine to revMoveToRecord() in order to move the cursor to the correct record.
4. Use revDatabaseColumnNamed() or revDatabaseColumnNamed() or revDatabaseColumnNumbered() to extract columns from the current row in the cursor and populate the @pDataA parameter passed to GetDataForLine.

This will be the most efficient way to streaming data from the database cursor into the DataGrid.

Re: Large number of images in a data grid

Posted: Fri Jan 04, 2019 4:17 pm
by hopkins
Thanks. I have another data grid which I use to display album tracks, which is also seems slow when there are a large number of tracks (> 100), and I will optimize it as you indicated.

Re: Large number of images in a data grid

Posted: Fri Jan 04, 2019 6:24 pm
by trevordevore
After I responded to you last night I decided to write a database cursor behavior for the DataView control I recently made available. You can read about it in this thread:

viewtopic.php?f=108&t=31987

A DataView is a more modern DataGrid and is more efficient. It is also easy to add behaviors to it in order to provide an interface to a specific type of data source. There is an interface for arrays, tree nodes, and now a database cursor.

If you want to take a look you can find the demo project here:

https://github.com/trevordevore/dataview_demo

The actual code that feeds a cursor to the DataView can be found here:

https://github.com/trevordevore/levureh ... codescript

You could do something similar for your DataGrids. Look at the `DataForRow` command which is similar to `GetDataForLine` in a DataGrid.

Re: Large number of images in a data grid

Posted: Sat Jan 05, 2019 12:11 am
by hopkins
Excellent, thank you, will definitely look into it. I just happened to be working also on a way to display folders & files, and I see you worked on that as well.

Re: Large number of images in a data grid

Posted: Sat Jan 05, 2019 11:13 am
by hopkins
I started out by downloading the example stack from LiveCode (Data Grid and Databases.rev). While the initial load of the database is fast, there are issues when scrolling through the grid, especially when clicking in the vertical bar.

Re: Large number of images in a data grid

Posted: Sat Jan 05, 2019 3:17 pm
by trevordevore
Where did you find the example stack? I'm not seeing it in my searches.

Re: Large number of images in a data grid

Posted: Sat Jan 05, 2019 7:10 pm
by trevordevore
@hopkins - do you have the Project Browser open when you are testing the Data Grid? If so, try closing it. The Project Browser will slow things down as the Data Grid is creating/deleting/showing controls.

Re: Large number of images in a data grid

Posted: Sat Jan 05, 2019 8:39 pm
by hopkins
No I do not have it open.

I found the example stack (livecode's) in the link you gave a few posts up: http://lessons.livecode.com/m/datagrid/ ... ts-of-data