Shopify / Shopify/flash-list

Dynamic item height causes items to overlap during fast scroll

Open
#2,175 1 comment 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

agent-triage P1
Dominant language
TypeScript
Stars
7.2k
Forks
393
Avg merge
1d 3h
Merged PRs (30d)
1

Description

Description

When using FlashList with dynamic item heights, quickly scrolling up/down causes content to jump, collapse, and overlap each other.

Steps to Reproduce

  1. Render a FlashList with dynamic item heights (items have varying/unpredictable heights)
  2. Scroll quickly up and down

Expected Behavior

Items maintain their correct heights and positions while scrolling.

Actual Behavior

Items jump, collapse, and overlap each other during fast scroll due to incorrect height estimations for dynamic items.

Platform

  • iOS
  • Android

FlashList Version

2.3.0

https://github.com/user-attachments/assets/a9bbb356-4942-4773-b9d0-3ec0c8e3cde9

Image

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

No files, tests, or entry points are named in the issue. Start by reproducing the fast-scroll behavior with dynamic-height items on iOS and Android, then trace the height estimation and layout path. Done means items retain their correct heights and positions without jumping, collapsing, or overlapping.

Written by the indexing model from the issue text.

Assessment

Tech stack
react-native, typescript
Domain
mobile
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Quiet
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.