Problem
There is a huge component (>1.1k lines) - ReportActionItem.
Solution
There is an option to pick a scope of the “created” action rendering and move it to a new file. The new file can be called ReportActionItemContentCreated. It is a stateless component and gets props from the parent. Obviously, we can apply React.memo for this child component. This change saves 117 lines of ReportActionItem.
Before: 1118 lines / After: 1001 lines / Diff: 117 lines.
I did some measures and recorded mean value. So It really improves the rendering of the created action.
Before: 2.4ms / After 2.1ms around 15% of improvement.
This change doesn’t have a predictable improvement for text actions, the numbers floats for the legacy and updated versions. However, if the user refresh the page, there is a slight boost.
Before: 3.8ms / After 3.5ms around 9% of improvement.
A commit is here.
cc @rezkiy37
Issue Owner
Current Issue Owner: @abekkala
Problem
There is a huge component (>1.1k lines) - ReportActionItem.
Solution
There is an option to pick a scope of the “created” action rendering and move it to a new file. The new file can be called ReportActionItemContentCreated. It is a stateless component and gets props from the parent. Obviously, we can apply React.memo for this child component. This change saves 117 lines of ReportActionItem.
Before: 1118 lines / After: 1001 lines / Diff: 117 lines.
I did some measures and recorded mean value. So It really improves the rendering of the created action.
Before: 2.4ms / After 2.1ms around 15% of improvement.
This change doesn’t have a predictable improvement for text actions, the numbers floats for the legacy and updated versions. However, if the user refresh the page, there is a slight boost.
Before: 3.8ms / After 3.5ms around 9% of improvement.
A commit is here.
cc @rezkiy37
Issue Owner
Current Issue Owner: @abekkala