useWindowDimensions() isn't debounced

[yairopro]

Description

I think useWindowDimensions() hook should be debounced (and maybe make the debouncing time configurable) since it triggers a render of the components calling it at each change event. On desktop (web or native) it's common for a user to resize its app/browser window. So the event is going to be fired at each small resize, causing the components to render multiple times at once.

Version

master

Output of npx react-native info

No need.

Steps to reproduce

Call useWindowDimensions() and resize the window.

Snack, code example, screenshot, or link to a repository

In this sandbox, when you resize the width of the preview, it fires the log render multiple times.
https://codesandbox.io/s/late-violet-je3hz?file=/src/App.js

[github-actions]

This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days.

[yairopro]

🤖💀

[kennethstarkrl]

+1 this behavior will kill performance just for simple window resizing. If you're using this in a higher level page component it causes a re-rendering nightmare even with React.memo because the props do change. Especially if you're using a flatlist because vertical scrolling causes a height adjustment and re-renders all the components in the flatlist. Went with Dimensions.get('window').width to work around the issue but can no longer adjust some components based off the window size without a full reload. Even with using it at lower level components causes problems. I haven't found a good solution for dynamic window adjustments.

[react-native-bot]

This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days.

[react-native-bot]

This issue was closed because it has been stalled for 7 days with no activity.