React Context – Helpful Context Like AdBlock and OS (opens in new tab)

No (edit: kinda). It looks like the site calls setState() on the root React component every time the scroll event is fired.

For those not familiar with React, setState() is a function that is used to update mutable state, and it is not a very cheap function, because it propagates the state through all child components, re-renders some virtual DOM, and potentially also causes actual DOM reflowing. Calling this in the scroll handler is what causes the noticeable delay.

edit: it seems like the lib itself does also call setState on scroll [0]. I don't think this is the source of the issue on the site itself, which has additional scroll handlers (for the magic non-scrolling sidebar), but it could cause similar performance problems, depending on how many child components are in your Context.

[0]: https://github.com/casesandberg/react-context/blob/master/sr...

Potentially. This lib is going to call setState on every scroll event, which is triggered multiple times every time you scroll up or down the page. Traditionally you would debounce a scroll handler like this.

Probably; JavaScript scroll handlers often incur a major performance penalty.

Looking into it now carlob, thanks for the heads up!

I agree. The name confused me until I spent more time with the docs than should have been necessary.