Skip to content

Add RecycleList (virtualized list) #203

@haywoodfu

Description

@haywoodfu

I’d like to contribute a RecycleList component for large-list performance.

Why
Normal lists render all items at once, which can cause startup jank with large datasets, especially on lower-end mobile devices.

Proposal
Add a reusable virtualized list component that:

  • Renders only rows near the viewport
  • Recycles row nodes while scrolling
  • Supports dynamic row heights
  • Keeps UX consistent with a normal list

Preview
Image

Suggested API
RecycleList(RecycleListProps { items: &rows, buffer: 8, render_item: |row, idx| rsx! { ... } })

If accepted, I will submit a PR with

  • Primitive implementation in dioxus-primitives
  • Styled demo in preview
  • Tests and docs

Reference implementation
https://github.com/haywoodfu/dioxus-recycle-list

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions