question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Unnecessary recalculation of state

See original GitHub issue

I use react-sticky along with ReactCSSTransitionGroup for some animations (these animations not inside a sticky element). I noticed the following issue: when I use ReactCSSTransitionGroup on the same page with react-sticky transitions act weird and skip entering animation for elements. I checked the code and found that for every change of properties there is a recalculation for the whole state:

componentWillReceiveProps() {
    this.recomputeState();
  }

I tried to remove these function and all transitions work fine. Probably, because of page reflow (recalculation triggers reflow because it reads properties directly from DOM node).

Is it possible to get rid of these recalculations for each property? Or at least check particular properties? What do you think?

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Reactions:3
  • Comments:10 (1 by maintainers)

github_iconTop GitHub Comments

5reactions
osdiabcommented, Aug 3, 2016

With react-sticky, redraws everywhere (the stutters in the gif are due to poor performance, not GIF recording):

choppy2

With same code, except not using react-sticky but instead a custom implementation that only calls setState on sticky state change:

smooth2

Read more comments on GitHub >

github_iconTop Results From Across the Web

POMS: RS 00605.580 - Recalculation of Benefits - 08/02/1999
When a prior computation is incorrect, any necessary recalculation is made under the rules applicable to the computation being corrected.
Read more >
Change formula recalculation, iteration, or precision in Excel
Calculation is the process of computing formulas and then displaying the results as values in the cells that contain the formulas. To avoid...
Read more >
Department of Education Announces Actions to Fix ...
Today, the Department of Education announced steps that will bring borrowers closer to public service loan and income-driven repayment (IDR) ...
Read more >
Why you should avoid using state for computed properties
The answer is yes, it depends. It could be if it's some computationally expensive calculation and variable that the calculation relies on don't ......
Read more >
States Can Preserve Revenue by Decoupling From CARES ...
Background on State Income Tax “Conformity”. In most states, the calculation of state taxable income starts with the federal “adjusted gross ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found