next.js: 10.0.8 next/image high memory use
What version of Next.js are you using?
10.0.8
What version of Node.js are you using?
14.15.4
What browser are you using?
chrome
What operating system are you using?
macOS
How are you deploying your application?
next start
Describe the Bug
With v10.0.8 on pages with lots of next/image components seeing much higher memory use compared to 10.0.7. Possibly related to https://github.com/vercel/next.js/pull/22253
Expected Behavior
less memory use
To Reproduce
checkout branch nextjs-leak https://github.com/scttcper/xmplaylist/tree/nextjs-leak
run yarn && yarn build && cd frontend && npx next start
open localhost:3000 and just refresh the root/home page a few times (the backend is not required for this page). Memory should shoot up to 400-500mb. In production this was consuming 2gb (all memory available)
Production version is - https://xmplaylist.com/ you can see the home page has a good set of images.
About this issue
- Original URL
- State: closed
- Created 3 years ago
- Reactions: 9
- Comments: 18 (7 by maintainers)
Commits related to this issue
- Upgrade jest-worker (#23077) This PR upgrades `jest-worker` and `jest-cli` to the latest pre-release version, also removed `jest-circus` which is included in Jest by default. `jest-worker@next` inclu... — committed to vercel/next.js by shuding 3 years ago
- Improve image optimizer to only create 1 worker thread (#23188) As stated in #23157, this PR merges all the operations into 1 worker thread (`processBuffer` in `impl.ts`) and only pass a list of oper... — committed to vercel/next.js by shuding 3 years ago
- Upgrade jest-worker (#23077) This PR upgrades `jest-worker` and `jest-cli` to the latest pre-release version, also removed `jest-circus` which is included in Jest by default. `jest-worker@next` inclu... — committed to blitz-js/next.js by shuding 3 years ago
- Improve image optimizer to only create 1 worker thread (#23188) As stated in #23157, this PR merges all the operations into 1 worker thread (`processBuffer` in `impl.ts`) and only pass a list of oper... — committed to blitz-js/next.js by shuding 3 years ago
We experience this as well. We use Next.js for a shop-like website, which has 60-100 images per page. After updating Next.js from 10.0.7 to 10.0.8 our memory usage jumped from ~600MB to ~3.7GB
With 10.0.7:
With 10.0.8:
We reverted to 10.0.7 and memory usage is back to ~600MB.
We can’t say for sure if this is related to images. But we did see a general increase in response time for
/_next/imageURLs together with the memory increase while other routes didn’t show an increased response time.I can confirm this. I had the same memory issues when deployed to production. Even using
next@canary. Downgrade to next.js 10.0.7 has resolved the issues. Ubuntu 20.04.+1
10.0.8 was supposedly supposed to fix this issue by switching out the sharp library for a wasm equivalent but it’s made it even worse. We’ve had to rollback all usage of next/image now in production unfortunately.
It was consuming literally all memory available on our ec2 instances.
#23077
I guess the new issue tracking this problem is over here: https://github.com/vercel/next.js/issues/23189
@timneutkens Just built and started on my mac (not m1) the same project and opened the same page with ~10 next/image images
10.0.7 ~ 118 MB:
10.0.10-canary.2 ~ 826 MB:
Sorry for Activity Monitor but even here the problem is obvious
@shuding Unfortunately you good work doesn’t fix the issue for me (even on v10.0.10-canary.7). It still exceeds 1960MB, where as it uses much less memory in 10.0.7 (230MB).
Hi! @Timer @timneutkens
Why does https://github.com/vercel/next.js/pull/23077 close this and https://github.com/vercel/next.js/issues/20915 issues? This may be a mistake. This issue is still relevant. You need to open this issue again.