Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improvement: Avoid using index as a key #332

Open
AndlerRL opened this issue Aug 24, 2024 · 0 comments
Open

Improvement: Avoid using index as a key #332

AndlerRL opened this issue Aug 24, 2024 · 0 comments
Labels
chore Routinary tasks discuss enhancement New feature or request

Comments

@AndlerRL
Copy link
Contributor

          **Avoid using index as a key in `LazyImage`.**

Using the index as a key can lead to performance issues and incorrect component state.

Consider using a unique identifier from the data as the key.

- key={`content-${image}-${index}`}
+ key={image.url}
Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

                          key={image.url}
Tools
Biome

[error] 146-146: Avoid using the index of an array as key property in an element.

This is the source of the key value.

The order of the items may change, and this also affects performances and component state.
Check the React documentation.

(lint/suspicious/noArrayIndexKey)

Originally posted by @coderabbitai[bot] in #324 (comment)


Like this issue above, there are some other places that we set the key with index. We must work on those areas too and to add missing keys.

@AndlerRL AndlerRL added enhancement New feature or request chore Routinary tasks discuss labels Aug 24, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
chore Routinary tasks discuss enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

1 participant