In-cell editing & grid rendering too many times

2 posts, 0 answers
  1. Jean-Pierre
    Jean-Pierre avatar
    15 posts
    Member since:
    Dec 2018

    Posted 09 Jan 2019 Link to this post

    Hello,

    In a react grid, i have an editable text field. I discovered that the whole grid was re-rendered after each keystroke. Depending on the size of the grid and its complexity, this may slow down the cell edition.   

    Is it possible to only re-render the edited cell ? How can I speed up cell edition ?

    Regards,

    Jean-Pierre

  2. Stefan
    Admin
    Stefan avatar
    2909 posts

    Posted 10 Jan 2019 Link to this post

    Hello, Jean-Pierre.

    Yes, the Grid is re-rendered after each key press, but this is expected as it is taking advantage of React virtual DOM. Even if the render of the entire Grid component is called, React compare the DOM and only repainting the changed cell.

    I extended our editing example to have more records and the Grid is still working at the same speed:

    https://stackblitz.com/edit/react-bhmvrh?file=app/main.js

    The main idea for speeding up is the ensure that the component that holds the Grid data state will have only the Grid, as this may cause re-render other components.

    Regards,
    Stefan
    Progress Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top