You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Thanks for the great library! It's a lifesaver and I've used it for multiple projects!
I ran into an issue and was wondering if we could make a change to fix it.
The Problem
I'm building out a complex interface where the small screen and large screen experiences are very different. On large screens an element should have a fill gap selector. On small screens it should not. I had a function that looked roughly like this:
This function would be called whenever a user opened or closed a menu. This action could happen a number of times. At first the menu opening and closing was snappy, but over time I noticed that the performance degraded on large screen lower-power machines (and in low performing browsers).
I dug into it and realized that every time the menu was toggled the fill gap selector was being re-added so that state.fillGapSelectors looked like this: ['.foo', '.foo', '.foo', ...]. I think this was slowing down performance, since when scroll locking was toggled it had to iterate over all those duplicate selectors and make changes.
A Quick Fix
I was able to work around it by doing something like this:
Hey @FL3NKEY ! I hope you and yours are well and healthy. Things are starting to get crazy here in Oregon with COVID. I finally got around to making a PR to fix this issue. Let me know if you'd like any changes 🙂
Thanks for the great library! It's a lifesaver and I've used it for multiple projects!
I ran into an issue and was wondering if we could make a change to fix it.
The Problem
I'm building out a complex interface where the small screen and large screen experiences are very different. On large screens an element should have a fill gap selector. On small screens it should not. I had a function that looked roughly like this:
This function would be called whenever a user opened or closed a menu. This action could happen a number of times. At first the menu opening and closing was snappy, but over time I noticed that the performance degraded on large screen lower-power machines (and in low performing browsers).
I dug into it and realized that every time the menu was toggled the fill gap selector was being re-added so that
state.fillGapSelectors
looked like this:['.foo', '.foo', '.foo', ...]
. I think this was slowing down performance, since when scroll locking was toggled it had to iterate over all those duplicate selectors and make changes.A Quick Fix
I was able to work around it by doing something like this:
-->
This works fine but it would be nice if it was impossible to get into this situation in the first place.
A Fix in the Library
We could avoid this by doing something like this:
I'd be happy to put up a PR if this makes sense to you.
The text was updated successfully, but these errors were encountered: