Shopify / Shopify/flash-list

Setting startRenderingFromBottom makes initial render on Android glitchy and slow

Open
#1,998 6 comments 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

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

Description

The initial render of my flashlist when setting startRenderingFromBottom to true is quite glitchy. It shifts around the items inside it through like 3 or 4 frames after which it finally settles into its proper state. It looks awful. If I turn off startRenderingFromBottom it works perfectly. This only happens on Android.

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

Reproduce the initial render on Android with FlashList and startRenderingFromBottom set to true, then compare it with the setting disabled. Trace the rendering behavior that produces the three or four shifting frames; done means the list settles immediately without the glitch or slowdown.

Written by the indexing model from the issue text.

Assessment

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

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.