Question

194

React Re-Render Causes Flickering : How can i fix this?

rated 0 times [ 195] [ 1] / answers: 1 / hits: 6292 / 3 Years ago, thu, march 4, 2021, 12:00:00

I’m new in coding and i couldn’t get how to fix the issue after i googled many times. The issue is i have a layout component which contains 4 different components. When i call a function in a function component it affects the others and the others re-render. Re-render is fine tho however my images are flickering on mobile browser. I would like to remove the flickering of the image loading. I’ve tried using React.memo() and useCallBack() but both of them didn’t work for me. I hope I made myself clear , thanks in advance

This is my app https://stackblitz.com/github/mithatercann/qrmenu

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

jennie

Add To Favorites

Follow

Total Points: 593

Total Questions: 102

Total Answers: 106

Location: Federated States of Micronesia

Member since Fri, Sep 16, 2022

2 Years ago

jennie questions

1 Is there a React equivalent of Vue's nextTick() function?

Tue, Jun 21, 22, 00:00, 2 Years ago

1 how to loop to expect a list of item in jest

Tue, Feb 8, 22, 00:00, 2 Years ago

1 arrow function expected no return value with clean-up function in useEffect

Sun, May 23, 21, 00:00, 3 Years ago

1 React onChange not working for input inside functional component

Thu, Feb 25, 21, 00:00, 3 Years ago

1 Can't figure out why ScriptEngine engine is null in code

Sat, Jan 16, 21, 00:00, 3 Years ago

View All

answered 3 Years ago karyme · Accepted Answer

You are using what's its called "Prop Drilling". The better solution for your current problem is to implement some state management in your app, they are many third libraries for that, but for this instance and if your app is small you can use React Context API. If you're going to build big apps then I recommend implementing Redux.