welldone-software / why-did-you-render

why-did-you-render by Welldone Software monkey patches React to notify you about potentially avoidable re-renders. (Works with React Native as well.)
https://www.npmjs.com/package/@welldone-software/why-did-you-render
MIT License
11.11k stars 196 forks source link

Cannot get WDYR output from nextjs dynamically loaded component (e.g. for no-ssr use case) #276

Open bram2000 opened 1 year ago

bram2000 commented 1 year ago

Hello,

In Next.js (12) I'm using the dynamic import as recommended in the docs to prevent the component from breaking when server-side. Unfortunately I'm unable to get any output from WDYR for such components and my assumption is that it's related to the dynamic import (since it works fine in my other components which are imported as normal).

Is this a limitation of WDYR, or is there something I can do to get it working?

Thanks!

bram2000 commented 1 year ago

Having tried to create an example of this in code sandbox, it seems that the library does in fact work with dynamically loaded components (at least in the very simple case), so I'm not actually sure why I can only get output for certain components within my app.

jens-duttke commented 1 year ago

This sounds similar to the problem I had, that why-did-you-render doesn't work with Next.js v13+ at all.

A workaround I found was to add include: [/./] to the why-did-you-render options, as described here: https://github.com/welldone-software/why-did-you-render/issues/272#issuecomment-1645114930

Maybe this works for you issue as well.