Add support for client-side batching to generate fewer <style> tags. #1
Conversation
| <div id='root'>{html}</div> | ||
| <script src="./bundle.js"></script> | ||
| <script>StyleSheet.markInjected({classNames});</script> | ||
| </body> |
There was a problem hiding this comment.
<script>ReactDOM.render(<App />, document.querySelector("#root"))</script>?
There was a problem hiding this comment.
Isn't that strictly worse than document.getElementById? Seems like querySelector should just be slower because it needs to the the string parser to figure out to search by id?
There was a problem hiding this comment.
Looks like yes: https://jsperf.com/getelementbyid-vs-queryselector
I mostly wanted to mention to add the corresponding client-side ReactDOM.render call.
jlfwong
force-pushed
the
jlfwong-batching
branch
from
09d3273
to
f7d0b3b
Compare
| injectionBuffer = ""; | ||
| }, | ||
|
|
||
| css(styleDefinitions) { |
There was a problem hiding this comment.
This can be removed, correct? (since it's now merged into css below?)
There was a problem hiding this comment.
Whoops, yep -- bad merge
|
This all looks fine to me (except for the function to be removed)! |
jlfwong
force-pushed
the
jlfwong-batching
branch
from
70cb73f
to
9891cb6
Compare
This also adds some examples to the repo, and paves the path forward for serverside rendering.
Test Plan:
cd examples
npm install
npm run examples
Open http://localhost:4114/, see 2 style tags generated: one for initial render, one for the dynamic blue added by the timer.
jlfwong
force-pushed
the
jlfwong-batching
branch
from
9891cb6
to
8e30455
Compare
Add support for client-side batching to generate fewer <style> tags.
This also adds some examples to the repo, and paves the path forward for serverside rendering.
Test Plan:
Open http://localhost:4114/, see 2 style tags generated: one for initial render, one for the dynamic blue added by the timer.
@xymostech