gridjs: [BUGS] [SERVER-SIDE] [COLUMNS] It's doing extra request for each column

Describe the bug The library doing request for each columns that actually unwanted because it increase traffic and make problems to debug

To Reproduce Steps to reproduce the behavior:

  1. Go to https://gridjs.io/docs/examples/server-side-sort
  2. clear networks
  3. add 3 columns to the example code or copy full code below
  4. look networks expected: 1 request current: 5 requests
image
const grid = new Grid({
  sort: {
    multiColumn: false,
    server: {
      url: (prev, columns) => {
       if (!columns.length) return prev;
       
       const col = columns[0];
       const dir = col.direction === 1 ? 'asc' : 'desc';
       let colName = ['name', 'rarity', '1', '2', '3'][col.index];
       
       return `${prev}&order=${colName}&dir=${dir}`;
     }
    }
  },
  columns: [
   'Name',
   'Rarity',
   '1',
   '2',
   '3',
   {
     name: 'Image',
     width: '30%',
     sort: false,
     formatter: (img) => html(`<center><img src='${img}'/></center>`)
   }
  ],
  server: {
    url: 'https://api.scryfall.com/cards/search?q=Inspiring',
    then: data => data.data.map(card => [card.name, card.rarity, card.image_uris.small]),
    total: data => data.total_cards
  } 
});

About this issue

  • Original URL
  • State: closed
  • Created a year ago
  • Reactions: 12
  • Comments: 21 (2 by maintainers)

Most upvoted comments

Apologies for this issue. I have a fix for this that should address this issue and improve the overall rendering performance of the library: https://github.com/grid-js/gridjs/pull/1408

Quick solution: Downgrade to version 5. All features seems to work fine, at least the ones I’m using.

Quick solution: Downgrade to version 5. All features seems to work fine, at least the ones I’m using.

Confirmed - downgrading to 5.0.2 prevents the request overload.

<script src="https://unpkg.com/gridjs@5.0.2/dist/gridjs.umd.js"></script>

I have the same problem. It’s a great idea and library but this is an important bug. I guess adding a loading screen or something similar but this will not solved it entirely.

Just came across this as well. You can reproduce it with the example here:

https://gridjs.io/docs/examples/server-side-sort

image