👀 Views: 0 💬 Answers: 1 📅 Created: 2025-09-09

react-native aws-appsync graphql javascript

I'm getting frustrated with Recently started working on a mobile application using React Native backed by AWS AppSync for real-time data..... While implementing the GraphQL subscriptions, responsiveness varies significantly between devices. On older Android models, the UI seems to lag when new data arrives, but on newer models, it performs flawlessly. Using the following code for the subscription: ```javascript import { API, graphqlOperation } from 'aws-amplify'; import { onCreateMessage } from './graphql/subscriptions'; const subscribeToNewMessages = () => { const subscription = API.graphql(graphqlOperation(onCreateMessage)).subscribe({ next: (messageData) => { // Update state with new message }, error: (error) => console.warn(error), }); }; ``` I've tried optimizing the component that renders messages by using `React.memo` to prevent unnecessary re-renders, yet the performance is still subpar on older devices. I also adjusted the batch size of messages fetched to reduce the load, but this didn't yield the expected improvements either. On top of that, debugging reveals a potential excessive number of state updates triggered by incoming messages, causing the UI thread to be blocked. Is there a recommended strategy for managing state updates more effectively in this scenario or optimizing the GraphQL subscription to mitigate the performance drops across various mobile devices? I'm on Linux using the latest version of Javascript. How would you solve this? This issue appeared after updating to Javascript latest. Any examples would be super helpful. I'm using Javascript latest in this project. Is there a better approach?