-
Couldn't load subscription status.
- Fork 1.2k
[Resizer] Improve performance by reading offsetHeight from previous frame #1301
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
113556e to
e6c87a1
Compare
e6c87a1 to
6f80e91
Compare
6f80e91 to
7c19a80
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM 🚢 This is awesome, def gonna look into doing this in the data table 🤓
re: the codecov check, I think once you rebase it'll pass
7c19a80 to
9c9151e
Compare
9c9151e to
49c257d
Compare
49c257d to
c05187e
Compare
c05187e to
3c1025f
Compare
8007a7c to
f2e0f97
Compare
f2e0f97 to
d10416b
Compare
| componentDidMount() { | ||
| this.handleHeightCheck(); | ||
|
|
||
| if (process.env.NODE_ENV === 'development') { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Verified in playground that it works in dev without timeout and tests passed.
d10416b to
167dfc4
Compare
| } | ||
|
|
||
| const contentHeight = this.contentNode.offsetHeight; | ||
| const minimumHeight = this.setMinimumLinesNode |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This condition is always true, because this.setMinimumLinesNode is a function and Boolean(Function) is truthy.
WHY are these changes introduced?
Improve performance of
Resizerto avoid forced synchronous layout.WHAT is this pull request doing?
Schedule
handleHeightCheckto run in next animation framehttps://developers.google.com/web/fundamentals/performance/rendering/avoid-large-complex-layouts-and-layout-thrashing
How to 🎩
🖥 Local development instructions
🗒 General tophatting guidelines
📄 Changelog guidelines
Copy-paste this code in
playground/Playground.tsx:🎩 checklist
@darrenhebner