I am working on creating a react native app using Expo. There is a particular scenario I am having difficulty with. There are like option for the posts in the feeds page. I am using graphQL subscription to update the like count of posts. The subscription to get like count is a parameterized subscription. I am looping to run subscription of each post items s below.
posts.data.listUSER_HOME_FEED_POSTS.forEach(element => {
subscription.push(API.graphql(graphqlOperation(onCreatePostLikeItem, { POST_ID: element.POST_ID }))
.subscribe({
next: subonCreateUserLike => {
updatePostLike(element.POST_ID, subonCreateUserLike.value.data.onCreateUSER_LIKE_ITEM)
},
error: error => console.warn(error)
}));
});
This works smoothly when there is fewer posts (3-4). When there are 10-15 posts, UI starts hanging and takes about 3-4 seconds to respond for interactions and to re-render. As the number of posts increases, the hanging too is increases and takes more time to re-render and reflect the change in UI.
Am I following the right method to subscribe multiple parameterized subscriptions? Can someone help me identify what's wrong in my code or lead me to a better implementation?