Not loading bulk data (say 2000) at one go

[kirtishjain9]

Hi,

Thanks a lot for this amazing library. It's easy to implement and use.
But I've some time latency issues to load bulk data at one go.

So what I'm doing exactly is:
I've around 2000 data in an array and for each item there is tappable view (TouchableHighlight , like pinterest) so that user can tap any item to see corresponding detail view. see my code below for your reference:

`<TouchableHighlight style = {styles.ingredientItem} key = {item.identifier.toString()} onPress = {() => this.didSelectIngredientCell(item)} underlayColor = 'transparent'>

    <View style = {styles.ingredientCellView}>
      <FastImage style = {styles.ingredientImage}
                  source = {{
                        uri: JSON.stringify(item.imageURLString),
                        headers: { 'atipik-custom-key': Constants.atipikCustomKey },
                        cache: FastImage.cacheControl.cacheOnly }}
                 resizeMode = {FastImage.resizeMode.cover}/>
      <Text style = {styles.ingredientNameText}>{item.name.toUpperCase()}</Text>
      <Text style = {styles.ingredientRestDetailsText}>{item.upn}</Text>
      {(item.typeName != null && item.typeName != '') && <Text style = {styles.ingredientRestDetailsText}>{item.typeName}</Text>}
      {(item.primaryFamily != null && item.primaryFamily.name != '') &&
      <View style = {styles.bgViewForObjects}>
         <View style = {{width: 14, height: 14, borderRadius: 7, backgroundColor: item.primaryFamily.colorString}} />
         <Text style = {styles.ingredientRestDetailsText}>{item.primaryFamily.name.toUpperCase()}</Text>
      </View>}
      {(item.secondaryFamily != null && item.secondaryFamily.name != '') &&
        <View style = {[styles.bgViewForObjects, {paddingTop: 3}]}>
          <View style = {{width: 14, height: 14, borderRadius: 7, backgroundColor: item.secondaryFamily.colorString}} />
          <Text style = {styles.ingredientRestDetailsText}>{item.secondaryFamily.name.toUpperCase()}</Text>
      </View>}
      <Text style = {{paddingBottom: 0}}></Text>
    </View>
  </TouchableHighlight>

`
Now, when i load these 2000 data then it's not loading at one go. Initially it's loading 50-70 data views and then as I scroll, further views are loading but with very normal speed which means it'll take sufficient amount to load all 2000 data which is not acceptable.

Could you please assist me how do i load all 2000 data instantaneously?

thanks & regards

[manyuanrong]

Do you use addItemsWithHeight to add data?

[kirtishjain9]

@manyuanrong: No, I'm not using addItemsWithHeight instead m using addItems() method to pass my data array.

[manyuanrong]

he correct typesetting of a waterfall flow requires knowing the height of each item. The addItems method automatically measures the height one by one. It's very accurate, but it's a bit slow; and the addItemWithHeight doesn't measure the height, it's very fast. If you load many items at once, you should use addItemWithHeight

[kirtishjain9]

@manyuanrong: I've tried what you have suggested but still bulk loading is not happening. I've added height: 150 for each object dictionary of my array and then use addItemWithHeight method to add items in grid (pinterest like view) but still initially 100 cells are loaded and then as I scroll the list loading is going to load 15-20 objects and then halt for a second and goes on further like this but with very slow speed.

Any further suggestion from your side.

Thanks in advance.