react / react/react-native

0.69+ SectionList jumps

Offen
#36,414 23 Kommentare 6 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Component: SectionList Issue: Author Provided Repro Needs: Triage :mag:
Vorherrschende Sprache
C++
Sterne
127k
Forks
25.3k
Ø Merge
1 T. 23 Std.
Gemergte PRs (30 T.)
4

Beschreibung

Description

Something happening with SectionList at react-native: 0.69+
See videos for better understanding. It is something with huge lists (big amount of items)
It starts to jump and blink

Also, I've noticed that when I'm doing downgrade of react-native to 0.68 - it starts to work totally fine

Video:
https://user-images.githubusercontent.com/77282657/223980567-9bedf240-abd6-4eec-a912-9a7af1116ec3.mov

React Native Version

0.69.6

Output of npx react-native info
OS: macOS 12.5
    CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
    Memory: 240.36 MB / 16.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 16.16.0 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 9.5.0 - /usr/local/bin/npm
    Watchman: Not Found
  Managers:
    CocoaPods: 1.12.0 - /Users/denys/.rvm/rubies/ruby-2.7.6/bin/pod
  SDKs:
    iOS SDK:
      Platforms: DriverKit 22.1, iOS 16.1, macOS 13.0, tvOS 16.1, watchOS 9.1
    Android SDK: Not Found
  IDEs:
    Android Studio: 2021.2 AI-212.5712.43.2112.8815526
    Xcode: 14.1/14B47b - /usr/bin/xcodebuild
  Languages:
    Java: Not Found
  npmPackages:
    @react-native-community/cli: Not Found
    react: 18.0.0 => 18.0.0 
    react-native: 0.69.6 => 0.69.6 
    react-native-macos: Not Found
  npmGlobalPackages:
    *react-native*: Not Found
Steps to reproduce
  • Install fresh expo project or clone from git
  • Scroll up and down to trigger pagination
  • Scroll for about 1-2-4 minutes (can't upload full 3 minutes video)
Snack, code example, screenshot, or link to a repository

https://github.com/DenysMoro/reactNativeSectionListJumps

Beitragsleitfaden

Beitragsleitfaden öffnen

Erste Schritte

  1. Lies das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreib ins Issue, dass du es übernimmst — das erspart doppelte Arbeit.
  3. Forke das Repository und arbeite in einem Branch.
  4. Öffne einen Pull Request, der die Issue-Nummer nennt.

Rechercherichtung

Beginne damit, das Springen und Blinken im verlinkten reactNativeSectionListJumps-Repository mit React Native 0.69.6, einer großen SectionList und Paginierung beim Scrollen zu reproduzieren. Vergleiche das Verhalten mit React Native 0.68 und verwende das bereitgestellte Video und die Reproduktionsschritte als Grundlage. Als erledigt gilt die Aufgabe, wenn große SectionLists im gemeldeten Paginierungsszenario beim Scrollen nicht mehr springen oder blinken.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
react-native
Bereich
mobile
Issue-Typ
Bug
Schwierigkeit
4/5
Geschätzter Aufwand
3-5 Tage
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
38/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.