nextjs - ✅(Solved) Fix Image component subsequence requests get stuck in a pending state after aborting the preceding request [1 pull requests, 4 comments, 3 participants]

Official PRs (…)
ON THIS PAGE

GitHub issue graph ai analysis

Paste a GitHub issue URL. We fetch that issue, discover linked issues from bodies/comments/timeline, collect linked pull requests, and produce a structured English report.

The report is written in English Markdown for sharing and archival.

Helpful · Quick feedback

Loading…
GitHub stats
vercel/next.js#88463Fetched 2026-04-08 02:04:51
View on GitHub
Comments
4
Participants
3
Timeline
9
Reactions
1
Author
Timeline (top)
commented ×4cross-referenced ×1issue_type_added ×1labeled ×1

Fix Action

Fixed

PR fix notes

PR #88574: fix: image component subsequence requests get stuck in a pending state after aborting the preceding request.

Description (problem / solution / changelog)

<!-- Thanks for opening a PR! Your contribution is much appreciated. To make sure your PR is handled as smoothly as possible we request that you follow the checklist sections below. Choose the right checklist for the change(s) that you're making: ## For Contributors ### Improving Documentation - Run `pnpm prettier-fix` to fix formatting issues before opening the PR. - Read the Docs Contribution Guide to ensure your contribution follows the docs guidelines: https://nextjs.org/docs/community/contribution-guide ### Fixing a bug - Related issues linked using `fixes #number` - Tests added. See: https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs - Errors have a helpful link attached, see https://github.com/vercel/next.js/blob/canary/contributing.md ### Adding a feature - Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR. (A discussion must be opened, see https://github.com/vercel/next.js/discussions/new?category=ideas) - Related issues/discussions are linked using `fixes #number` - e2e tests added (https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs) - Documentation added - Telemetry added. In case of a feature if it's used or not. - Errors have a helpful link attached, see https://github.com/vercel/next.js/blob/canary/contributing.md ## For Maintainers - Minimal description (aim for explaining to someone not on the team to understand the PR) - When linking to a Slack thread, you might want to share details of the conclusion - Link both the Linear (Fixes NEXT-xxx) and the GitHub issues - Add review comments if necessary to explain to the reviewer the logic behind a change ### What? ### Why? ### How? Closes NEXT- Fixes # -->

fixes: https://github.com/vercel/next.js/issues/88463

Changed files

  • packages/next/src/server/image-optimizer.ts (modified, +0/-1)
  • test/e2e/app-dir/next-image-abort-internal-image/app/layout.tsx (added, +9/-0)
  • test/e2e/app-dir/next-image-abort-internal-image/app/page.tsx (added, +6/-0)
  • test/e2e/app-dir/next-image-abort-internal-image/middleware.ts (added, +15/-0)
  • test/e2e/app-dir/next-image-abort-internal-image/next-image-abort-internal-image.test.ts (added, +59/-0)
  • test/e2e/app-dir/next-image-abort-internal-image/next.config.js (added, +6/-0)
  • test/e2e/app-dir/next-image-abort-internal-image/public/test.png (added, +0/-0)

Code Example

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 25.1.0: Mon Oct 20 19:32:56 PDT 2025; root:xnu-12377.41.6~2/RELEASE_ARM64_T8132
  Available memory (MB): 16384
  Available CPU cores: 10
Binaries:
  Node: 24.12.0
  npm: 11.6.2
  Yarn: 1.22.22
  pnpm: 10.25.0
Relevant Packages:
  next: 16.1.1 // Latest available version is detected (16.1.1).
  eslint-config-next: N/A
  react: 19.2.3
  react-dom: 19.2.3
  typescript: 5.9.3
Next.js Config:
  output: N/A
RAW_BUFFERClick to expand / collapse

Link to the code that reproduces this issue

https://github.com/soc221b/next-image-pending-issue

To Reproduce

  1. Place a large image (e.g. 4096x4096) in the app folder, named example.jpg.
  2. Run the Next.js application using next dev.
  3. Open the application in a web browser.
  4. Use browser developer tools to simulate 4096px width viewport.
  5. Observe the network requests.
  6. Increase the viewport width by 1px continuously and quickly.
  7. Sometimes, the request will be cancelled which is expected.
  8. However, after cancelling, refetching the image sometimes will result int a pending request that never resolves.

https://github.com/user-attachments/assets/1763bb71-e9bb-4eb0-a2ab-649a5704604f

Current vs. Expected behavior

Current behavior: After cancelling an image request and refetching it, the request sometimes remains in a pending state indefinitely. Expected behavior: After cancelling an image request and refetching it, the image should load successfully

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 25.1.0: Mon Oct 20 19:32:56 PDT 2025; root:xnu-12377.41.6~2/RELEASE_ARM64_T8132
  Available memory (MB): 16384
  Available CPU cores: 10
Binaries:
  Node: 24.12.0
  npm: 11.6.2
  Yarn: 1.22.22
  pnpm: 10.25.0
Relevant Packages:
  next: 16.1.1 // Latest available version is detected (16.1.1).
  eslint-config-next: N/A
  react: 19.2.3
  react-dom: 19.2.3
  typescript: 5.9.3
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

Image (next/image)

Which stage(s) are affected? (Select all that apply)

next dev (local), next start (local)

Additional context

Also not works with [email protected].

extent analysis

TL;DR

The issue with pending image requests in Next.js can be mitigated by adjusting the image loading strategy or implementing a retry mechanism.

Guidance

  • Investigate the next/image component configuration to ensure optimal loading strategy for large images.
  • Verify if the issue persists when using a different image loading library or a custom implementation.
  • Consider implementing a retry mechanism for failed image requests to handle intermittent network issues.
  • Review the browser's developer tools to analyze the network requests and identify potential patterns or errors related to the pending requests.

Example

No specific code example is provided due to the lack of explicit code snippets in the issue description.

Notes

The provided information suggests that the issue might be related to the next/image component or the image loading strategy. However, without further details or code snippets, it's challenging to provide a definitive solution.

Recommendation

Apply workaround: Implement a retry mechanism for failed image requests to handle intermittent network issues, as this approach can help mitigate the problem without requiring significant changes to the existing codebase.

Vote matrix · Quick signals

Works
Did the solution work? Tap to confirm.
Easy Fix
Was it a quick fix?
Time Saver
Did it save you time?
Blocking
Was it severely blocking?
Common Issue
Are others likely hitting this too?
Flaky / Intermittent
Is it intermittent?
Verified / Reproducible
Can you reproduce it reliably?
Loading…

Still need to ship something?

×6

Another batch ranked right after the header list — different links, same matching logic.

Back to top recommendations

TRENDING

nextjs - ✅(Solved) Fix Image component subsequence requests get stuck in a pending state after aborting the preceding request [1 pull requests, 4 comments, 3 participants]