payloadcms / payloadcms/payload

Collection list filters/search cause UI blinking before data loads correctly

Open
#15,032 2 comments 0 reactions 1 assignee View on GitHub

@paulpopus is already working on this.

Since Jan 26, 2026.

Dominant language
TypeScript
Stars
44.8k
Forks
4.2k
Avg merge
2d 21h
Merged PRs (30d)
53

Description

Describe the Bug.

After migrating from Payload CMS v2 to v3, collection list filtering and searching in the admin UI shows noticeable UI flickering/blinking before results are rendered. This behavior was not present in v2 and impacts usability and perceived performance.

Steps to Reproduce
  1. Open the admin panel
  2. Navigate to any collection with a moderate to large number of documents
  3. Use:
    • Text search, or
    • Any collection filter
  4. Observe the UI behavior when results are fetched
Expected Behavior
  • Results update smoothly without full list flicker or visual reset
  • Comparable performance and UX to Payload v2
Actual Behavior
  • The page briefly blinks/flickers before showing results
  • Noticeable delay before data is rendered
  • Behavior occurs consistently across collections
Environment
  • Payload CMS: v3.61.1
  • Previous version: v2.30.0 (no issue)
  • Database: MongoDB
Binaries:
  Node: 23.5.0
  npm: 10.9.2
  Yarn: 1.22.22
  pnpm: 10.11.0
Relevant Packages:
  payload: 3.69.0
  next: 15.4.10
  @payloadcms/db-mongodb: 3.69.0
  @payloadcms/email-nodemailer: 3.69.0
  @payloadcms/graphql: 3.69.0
  @payloadcms/next/utilities: 3.69.0
  @payloadcms/payload-cloud: 3.69.0
  @payloadcms/plugin-cloud-storage: 3.69.0
  @payloadcms/plugin-seo: 3.69.0
  @payloadcms/richtext-lexical: 3.69.0
  @payloadcms/storage-s3: 3.69.0
  @payloadcms/translations: 3.69.0
  @payloadcms/ui/shared: 3.69.0
  react: 19.2.1
  react-dom: 19.2.1
Operating System:
  Platform: linux
  Arch: x64
  Version: #37~24.04.1-Ubuntu SMP PREEMPT_DYNAMIC Thu Nov 20 10:25:38 UTC 2
  Available memory (MB): 15735
  Available CPU cores: 12

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.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.