WebListBox AddRow SLOOOOOOW

Working on a Web app, and it’s going extremely well.
One issue is that once I’m adding more than 800-ish colors the addRow really bogs down. I am using WebListBoxStyleRenderer, which maybe is contributing to the performance lag?

Any ways to speed this up? I know I can alter the workflow to display a limited # of rows and then have a next / previous (etc).

Suggestions?

This:

I don’t think WebListBox is designed to have a big number of rows/columns and with Style Renderer.

I suspect you are right.
I was hoping there was some internal optimization but maybe I need to build my own handling.

Well for extremely large sets of data you’re supposed to use WebListboxDataSource but I don’t know if that’s compatible with custom cell renderers.

1 Like

that’s interesting. I’m half way implementing limiting to 25 rows at a time. I’ll try WebListBOxDataSource if anyone else can confirm it will help.

FYI, added a 50 row limit and manage it with the WebPagination control. It’s now really speedy. Just wish it was a little cleaner.

1 Like

Yeah the kicker is that I don’t know if the DataSource method works with custom cell renderers. It looks like it only handles string values, but I have never actually used a custom cell renderer. I’ve only implemented the DataSource method as far as getting ARGen to write the code for it.

I will have to spend a little time looking into that.
The good news now is that this paging is working great and people are used to having list limits on web pages.

Yes it does. You need to do the style rendering in the RowData Method of the DataSource. Here is a snippet on how in a datasource I am using. I got a fair amount of help on using a datasource from @Ricardo_Cruz on a project I was struggling to get a few thousand lines to display and render in reasonable time and switching to a datasource worked very well to fix that

Var columns() As WebListBoxColumnData = ColumnData
For i As Integer = RowOffset To Min(RowOffset + RowCount, rows.LastIndex)
  Var row As Dictionary = rows(i)
  Var rowData As New WebListBoxRowData
  Var tagData As String
  
  For Each column As WebListBoxColumnData In columns
    
    tagData =  row.Lookup("Job_Number", "").StringValue + Chr(9) _ 
    + row.Lookup("Job_Year", "").StringValue + Chr(9) _ 
    + row.Lookup("Job_Name", "").StringValue
    
    rowData.PrimaryKey = row.Lookup("PK_ID", "").IntegerValue
    rowData.Tag = tagData
    If column.DatabaseColumnName = "Detail" Or column.DatabaseColumnName = "Brief_Description" Then
      rowData.Value(column.DatabaseColumnName) = StyleCellTextWrap(row.Lookup(column.DatabaseColumnName, "").StringValue)
    End If
  Next
  
  result.Add(rowData)
Next

I have all my style renderers in a module of style methods. The StyleCellTextWrap method is this:

Public Function StyleCellTextWrap(celltext As String) As WebListBoxStyleRenderer
  // Usage: [ListBox].CellTextAt([ListBox].LastAddedRowIndex,[Column]) = StyleCellTextWrap([String])
  Var style as New WebStyle
  style.value("white-space") = "normal"
  style.value("word-wrap") = "break-word"
  Var cellrenderer as New WebListBoxStyleRenderer(style,celltext)
  Return cellrenderer
End Function

4 Likes

Very useful example. Thank you for sharing this, Tom.

1 Like

Thank you for sharing.

How can I implement this code on my machine?

If you can help me with this, I would appreciate it.
I’m taking time using ListBox to see which is my best option.

I’ll see if I can find the time to put together a sample project using Listbox DataSource

1 Like

Here is a link to a test project for Listbox DataSource. I have not included the MySQL Database and I removed the login credentials before sharing. You will need to edit this project to use your own database .

3 Likes