1. #1
    Sencha Premium Member
    Join Date
    Mar 2012
    Posts
    8
    Vote Rating
    0
    svalmont is on a distinguished road

      0  

    Default Usage of new ExtJS 4.2 bufferedrenderer Grid

    Usage of new ExtJS 4.2 bufferedrenderer Grid


    How exactly is the new bufferedrenderer grid to be used?

    Do I have to load all records into the store (buffered: false, pageSize: 50000 (or whatever)) or do I have to add buffered: true and pageSize to the store to make this thing work?!?
    Case 1 reduces the DOM elements as expected - but of course you still have the mega loading time since you are loading ALL records!
    Case 2 actually produces less DOM elements if you DO NOT add the bufferedrenderer!
    So what exactly is the purpose of this new feature?

    Thanks for your help!
    Thomas

  2. #2
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    16,639
    Vote Rating
    582
    evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute

      0  

    Default


    The buffered renderer only renders what it needs to be viewed (+ a few either side to keep smoothness). It can be used with or without a buffered store.

    Using it with a buffered store is good when you have a ~lot~ of records, because it will continually request what it needs from the server.

    If you have a small amount (say 2000), it's better to use a normal store with buffered rendering.
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

  3. #3
    Sencha - Services Team
    Join Date
    Feb 2013
    Posts
    44
    Vote Rating
    5
    IvanJouikov is on a distinguished road

      1  

    Default


    To better understand the new plugin, it's worth examining the general "buffered rendering/loading" concept, and how it differs from 4.1 to 4.2.

    Terms
    • Buffered Loading - term relevant to the store i.e. we want our store to contain the 3rd page of 500 records of the 1 million that exists in the backend
    • Buffered Rendering - term relevant to the grid view i.e. our store contains 500 records, but we only want to render 50 HTML rows at a time in DOM
    4.1
    • The two functionalities were "lumped" together, where you achieved both Buffered Loading and Rendering in one punch, by setting "buffered: true" on the store connected to the grid
    • As the two concepts are logically separate, you still had ability to configure how the store buffers (i.e. pageSize, leading, and trailing buffer zones), as well as how the grid renders (on the vertical scroller you could specify leading and trailing zones)
    4.2
    • The "bufferedrenderer" plugin enables Buffered Rendering on the gridview, regardless of whether store is buffered or not, effectively de-coupling this functionality
    • Using only store "buffered: true" setting still behaves like it did in 4.1 - the behaviors are coupled, so both Buffered Loading (Store) & Rendering (Grid View) are utilized
    • For that matter, using "buffered: true" on a store simply causes the "bufferedrenderer" plugin to be used with the grid
    I hope this helps!

  4. #4
    Sencha User
    Join Date
    May 2012
    Posts
    52
    Vote Rating
    0
    gtsafas is on a distinguished road

      0  

    Default


    I subscribe to data on the javascript end and want to keep the grid updated. When I use the normal Datagrid unbuffered its pretty straight forward to insert the record since the javascript applies the current filter and sort for me. With 4.1 using the buffered grid was kind of a pain, I had to figure out what was rendered and where to insert the record. I also had to clear the page map because otherwise it would just reload the old data once I scrolled.

    I was hoping the bufferedrenderer would help me with this, but it seems that I would still need to use the buffered store. As some of our tables have 70k records. Any suggestions?