Lazy collection rendering

[oleks-fedotov]

The main goal of this ticket will be, to first render only visible part of the lane and afterward to fetch next elements and also render them.

Main tasks:

• Implement 2 steps rendering for the lane
• Optimize the update for the second step, not to update already existing elements
• Only the last element's navigationRight property should be updated during the 2 rendering step
• Implement configurable lazy lane rendering, so when the user is getting closer to the visible border, the lane is fetching the next set of data to be rendered.

Configurable lazy lane rendering

During the first render, the lane is only rendering 10 elements. The lane also should have a right range parameter, which describes how many elements should always be kept on the right side of the focused element. The same parameter should exist also for the left side.

Example:
let's say the right range will be 15 and the left one is 5. This way after the first rendering step we have 9 elements on the left side from the focused one and 0 elements on the left side. Therefore, the second rendering step should additionally fetch 6 right elements and 5 left elements, also render them. When the user starts moving right and gets the number of elements smaller than 15, the lane should fetch additional 15 elements and render them. The same principle is applied on the left side.

Configurable parameters:

• initial elements number
• min right elements number
• min left elements number

[oleks-fedotov]

https://github.com/bvaughn/react-virtualized