epam / epam/UUI

Investigate and prioritize UUI components performance issues

Open
#2,686 1 comment 0 reactions 0 assignees View on GitHub
Tech debt
Dominant language
TypeScript
Stars
247
Forks
78
Avg merge
14h 27m
Merged PRs (30d)
15

Description

## Description

We need to investigate and evaluate current performance issues with UUI components, especially for corner cases with heavily loaded pages and on low performance devices.

## To do

- Let's create a some heavily loaded page where we can detect some performance issues, when a lot of component rendered in one place. Probably it can be a Sandbox page where we will render grid(e.g. 20x40) with tested component in each cell.
- Using this stand check if there is some performance gaps on mount/update/unmount phases. Create separate tasks for this issues. Probably we should start from some complex components like PickerInput, DatePicker and etc.
- Investigate if UUI components wrapped in `React.memo` doesn't rerendered when it's not expected. Let's checked following cases(we can improve our current demos):
- Form where each component is memoized - only changed component should be updated .
- Editable table - only changed row should be updated.
- also check case with `lens.onChange()` in `getRowOptions`, where row `onChange` need some data from another row. Draft solution - https://codesandbox.io/p/sandbox/uui-custom-lens-for-onchange-memoization-6xjlyt?file=%2FExample.tsx%3A312%2C50
- TBD
- If we will find some good new approaches - create a appopriate doc examples describing this good practices

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.