ec430ea77d
This pull request adds an `elements.delete` operation to the `useIntersection`'s cleanup function: `unobserve`.
Without this delete operation, next.js holds onto an unreachable reference of every observed element indefinitely (automatically every Link and Image is observed, so that means every rendered Link and Image element adds to the leak). I found this memory leak when building out an infinite feed in next.js with thousands of Link elements.
The final code block of the `unobserve` function body:
```tsx
// Destroy observer when there's nothing left to watch:
if (elements.size === 0) {
observer.disconnect()
observers.delete(id)
}
```
Is effectively unreachable without this delete operation, as the `elements` map will never decrease in size as it is currently. This means that there will always be at least one IntersectionObserver instance in memory if useIntersection has been used once, regardless of if there are currently any components still using the hook.
|
||
|---|---|---|
| .. | ||
| bin | ||
| build | ||
| bundles/babel | ||
| cli | ||
| client | ||
| compiled | ||
| export | ||
| lib | ||
| next-server | ||
| pages | ||
| server | ||
| telemetry | ||
| types | ||
| amp.d.ts | ||
| amp.js | ||
| app.d.ts | ||
| app.js | ||
| babel.d.ts | ||
| babel.js | ||
| client.d.ts | ||
| client.js | ||
| config.d.ts | ||
| config.js | ||
| constants.d.ts | ||
| constants.js | ||
| data.d.ts | ||
| data.js | ||
| document.d.ts | ||
| document.js | ||
| dynamic.d.ts | ||
| dynamic.js | ||
| error.d.ts | ||
| error.js | ||
| experimental-script.d.ts | ||
| experimental-script.js | ||
| head.d.ts | ||
| head.js | ||
| image.d.ts | ||
| image.js | ||
| license.md | ||
| link.d.ts | ||
| link.js | ||
| package.json | ||
| README.md | ||
| router.d.ts | ||
| router.js | ||
| taskfile-babel.js | ||
| taskfile-ncc.js | ||
| taskfile.js | ||
| tsconfig.json | ||
Next.js
Getting Started
Visit https://nextjs.org/learn to get started with Next.js.
Documentation
Visit https://nextjs.org/docs to view the full documentation.
Who is using Next.js?
Next.js is used by the world's leading companies. Check out the Next.js Showcase to learn more.
Community
The Next.js community can be found on GitHub Discussions, where you can ask questions, voice ideas, and share your projects.
To chat with other community members you can join the Next.js Discord.
Our Code of Conduct applies to all Next.js community channels.
Contributing
Please see our contributing.md.
Authors
- Arunoda Susiripala (@arunoda) – Vercel
- Tim Neutkens (@timneutkens) – Vercel
- Naoyuki Kanezawa (@nkzawa) – Vercel
- Tony Kovanen (@tonykovanen) – Vercel
- Guillermo Rauch (@rauchg) – Vercel
- Dan Zajdband (@impronunciable) – Knight-Mozilla / Coral Project