Question

I’m using jqgrid on clienside for a financial web app where rows get added and/or updated very frequently (every few ms).
Max number of rows always stays under 80.
data gets pushed to the web through comet (reverse ajax)
when data comes in, the following code is applied

update
the jqgrid is defined this way:

jQuery(selector).jqGrid(
                {
                    datatype: 'local',
                    localReader: {
                        id: "id" 

                    },
                    colNames: ["id","price","volume","time"],
                    colModel: [ {name:'id', width:60},
                                {name:'price', width:80,
                                       align:"right",sorttype:"float"},
                                {name:'volume', width:100},
                                {name:'time',index:'amount', width:80} 
                                ], 
                    sortname: '', 
                    sortorder: 'desc',
                    height:'100%',
                    rowNum: 80,
                    viewrecords: true,
                    loadonce: true

                });

        ........................

_updateGrid: function (handle, args) { 
    var updated = args.data;
    var current = handle.jqGrid('getRowData', updated.id);
    if (typeof current.id == 'undefined' || current.id == null
                                         || current.id == "") {
        current = updated;
        var itWorks = handle.addRowData(updated.id, current);
    }
    else {
        handle.jqGrid('setRowData', updated.id,
                      {
                          id: updated.id
                          , price: updated.price
                          , volume: updated.volume
                          , time: updated.time
                      });
    }

    handle.sortGrid('price', false, 'desc');
}

right now the performance are very bad, so bad that firefox pops-up an error message requesting to stop the script.

I’m thinking of switching of grid widget, but before I would like to see if other developers have any idea that could solve the issue.

Answer 1

In all performance problems it is important to localize the bottleneck.

I suppose that the problem is bad performance of the data sorting used in the jqGrid now. To verify this you can try set sortname parameter to “” and call handle.trigger("reloadGrid") instead of handle.sortGrid('price', false, 'desc');

If you will see that the refresh of data will work much more quickly then we can discuss about the corresponding solution. One will need to replace the _doSort method used to sort local data with more effective version (based of Quick Sort or probably Array.sort).

Another possibility to improve performance of your code is the use data and _index parameters of jqGrid to make direct access to the internal grid data. The _index parameter help you to get the index in the data array of data identified by rowid. After modification of all data you can trigger reloadGrid to refresh the grid.

Updated: With the code

var lastData = handle.jqGrid('getGridParam','data');
var dataIndex = handle.jqGrid('getGridParam','_index');

one can get the local data saved in the grid and its index. With

var i = dataIndex[updated.id], var current = null;
if (i>0) { current = lastData[i]; }

you get reference of the data element by rowid updated.id (I hope I understand your code correct and updated.id is the rowid).

Now you can make any modification of properties of the current element without need to save it. You work on place. After you made all modifications should just refresh the grid contain based of the modified data. You can do this with handle.trigger("reloadGrid") or with handle.sortGrid('price', false, 'desc'); which do the same.