Conversation
lttb
changed the title
| "jss": "^7.1.0", | ||
| "jss-preset-default": "^2.0.0" | ||
| "jss-preset-default": "^2.0.0", | ||
| "raf": "^3.3.0" |
There was a problem hiding this comment.
I think raf polyfill should be responsibility of the user, like any other new features.
There was a problem hiding this comment.
So I would just use requestAnimationFrame, its well implemented right now anyways. All required polyfills should be in the readme
There was a problem hiding this comment.
We can't use just window.requestAnimationFrame, because we run this code not only in the browser (tests, ssr) - so we need polyfill
But we can make it customizable
| raf(function update() { | ||
| if (dynamicCounter) { | ||
| dynamicCounter = 0 | ||
| dynamicSheet.attach().link() |
|
Tests should implement a mock if they need it. |
you are right, but the main point is ssr :) |
|
mock it for ssr or don't use it when on the server |
lttb
force-pushed
the
feature/improve-mount-performance
branch
2 times, most recently
from
47496c7 to
441f337
Compare
lttb
force-pushed
the
feature/improve-mount-performance
branch
from
441f337 to
972d102
Compare
|
|
||
| const addRule = (name: string, style: ComponentStyleType, data: Object) => { | ||
| if (data) { | ||
| dynamicSheet.detach().addRule(name, style) |
There was a problem hiding this comment.
needs a comment, its because of a bug, right?
| raf(listen) | ||
| } | ||
|
|
||
| export default { |
There was a problem hiding this comment.
its not really an observer ... also it might be confused with a real Observer .
|
The main problem of this fix is async styles attaching, that may cause FUC (flash of unstyled content). Problem with mount performance solved in #12 |
3 participants
We have some overhead on
detachandattach().link()each mount, so when we have a lot of components that we need to mount at the same time (like https://github.com/A-gambit/CSS-IN-JS-Benchmarks), there some issues.This fix make significant performance improvement by bulk updating (more then 20x in example above).
TODO: