ui-grid: Slow performance with fixed header and pinned column

Hi,

I’m using latest version of ng-grid: 3.0.0-RC21 and really small dataset (JSON length of approximately 100 rows) with 20 columns, but did this for showing table (not all fields of array visible):

  this.gridOptions = {
    enableSorting: true,
    excessRows: 100,
    columnDefs: [
      { name:'Number', field: 'atomicNumber', width: 80 },
      { name:'Symbol', field: 'elementSymbol', width: 80, pinnedLeft:true },
      { name:'Designation', field: 'designation.EN', width: 140 },
      { name:'Classification', field: 'classification.EN', width: 140 },
      { name: 'Period', field: 'period', width: 140  },
      { name: 'Group', field: 'group', width: 140  },
      { name: 'anisotopicElement', field: 'anisotopicElement', width: 140  },
      { name: 'artificialElement', field: 'artificialElement', width: 140  },
      { name: 'radioactiveElement', field: 'radioactiveElement', width: 140  },
      { name: 'aggregateState', field: 'aggregateState.EN', width: 140  }
    ],
    data: this.elements
  };

HTML looks like this:

    <div ui-grid="main.gridOptions" class="grid" ui-grid-pinning></div>

Now, when I run this example on iOS simulator or iPad4, the scrolling seems very very unresponsive. When scrolling, the pinned column just doesn’t refresh so fast as it should. The fields stay where they are until scrolling slows down a bit, then the pinned column also refreshes the rows to be on the position of non-fixed fields. The excessRows part above is there because we need to have snappy and fast performing ui. At the moment, it looks very bad and totally laggy, not even close to what the example with pinned columns show. In Chrome it looks great, but, as I said, iOS simulator or iPad, it is just laggy as hell.

Why is that so and could I get snappier scrolling with some code optimization?

About this issue

  • Original URL
  • State: open
  • Created 9 years ago
  • Comments: 16 (3 by maintainers)

Commits related to this issue

Most upvoted comments

Stupid iPhone. Plunker.