Skip to content
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

[Fizz][Float] Refactor StyleResource #27398

Closed
wants to merge 1 commit into from

Conversation

gnoff
Copy link
Collaborator

@gnoff gnoff commented Sep 20, 2023

This change refactors the implementation of stylesheet resources and style tag resources. The style tag resource was already handled with special rules because it does not Flush is the same way as other resources do. This change reimagines the precedences as a combination of a style tag rules queue and a list of stylesheets.

This change eliminates a number of conditionals by embedding these variants in the data represenation itself.

This change also moves the binary encoding to work time rather than flush time.

Since style resources were the only type that actually used the type property I've removed this making resource object size slightly smaller

…Style tag Resources. The Style tag resource was already handled with special rules because it does not Flush is the same way as other resources do. This change reimagines the precedences as a combination of a style tag rules queue and a list of stylesheets.

This change eliminates a number of conditionals by embedding these variants in the data represenation itself.

This change also moves the binary encoding to work time rather than flush time.

Since style resources were the only type that actually used the `type` property I've removed this making resource object size slightly smaller
@facebook-github-bot facebook-github-bot added CLA Signed React Core Team Opened by a member of the React Core Team labels Sep 20, 2023
@gnoff gnoff requested a review from sebmarkbage September 20, 2023 21:05
Comment on lines +4168 to +4169
// Determine if this boundary has stylesheets that need to be awaited upon completion
boundaryResources.sheets.forEach(hasStylesToHoist);
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

would be nice if Set.prototype.some existed. Would love to bail out early but not sure if using a raw iterator is slower enough in the common case (few sheets) to be worth it

@react-sizebot
Copy link

Comparing: b775564...1254235

Critical size changes

Includes critical production bundles, as well as any change greater than 2%:

Name +/- Base Current +/- gzip Base gzip Current gzip
oss-stable/react-dom/cjs/react-dom.production.min.js = 166.62 kB 166.62 kB = 52.13 kB 52.13 kB
oss-experimental/react-dom/cjs/react-dom.production.min.js = 176.05 kB 176.05 kB = 54.97 kB 54.97 kB
facebook-www/ReactDOM-prod.classic.js = 571.73 kB 571.73 kB = 100.64 kB 100.64 kB
facebook-www/ReactDOM-prod.modern.js = 555.46 kB 555.46 kB = 97.75 kB 97.75 kB

Significant size changes

Includes any change greater than 0.2%:

Expand to show
Name +/- Base Current +/- gzip Base gzip Current gzip
facebook-www/ReactDOMServerStreaming-prod.modern.js = 182.16 kB 181.36 kB = 32.74 kB 32.55 kB
oss-experimental/react-dom/cjs/react-dom-server.node.development.js = 403.75 kB 401.71 kB = 87.24 kB 86.81 kB
oss-experimental/react-dom/cjs/react-dom-server.edge.development.js = 402.86 kB 400.83 kB = 87.04 kB 86.62 kB
oss-experimental/react-dom/cjs/react-dom-server.browser.development.js = 402.45 kB 400.42 kB = 86.92 kB 86.50 kB
oss-experimental/react-dom/umd/react-dom-server.browser.development.js = 421.63 kB 419.49 kB = 88.29 kB 87.54 kB
oss-experimental/react-dom/cjs/react-dom-server.node.production.min.js = 81.62 kB 81.19 kB = 24.87 kB 24.76 kB
oss-experimental/react-dom/cjs/react-dom-server.bun.development.js = 393.86 kB 391.83 kB = 85.72 kB 85.29 kB
oss-experimental/react-dom/cjs/react-dom-server.edge.production.min.js = 81.35 kB 80.92 kB = 24.68 kB 24.59 kB
oss-experimental/react-dom/cjs/react-dom-server-legacy.node.development.js = 398.77 kB 396.68 kB = 86.71 kB 86.29 kB
facebook-www/ReactDOMServer-prod.classic.js = 174.75 kB 173.83 kB = 30.94 kB 30.74 kB
oss-experimental/react-dom/cjs/react-dom-server-legacy.browser.development.js = 396.91 kB 394.83 kB = 86.26 kB 85.83 kB
facebook-www/ReactDOMServer-prod.modern.js = 173.81 kB 172.90 kB = 30.70 kB 30.49 kB
oss-experimental/react-dom/umd/react-dom-server-legacy.browser.development.js = 415.82 kB 413.63 kB = 87.62 kB 86.86 kB
oss-stable/react-dom/cjs/react-dom-server.node.development.js = 376.04 kB 374.01 kB = 82.10 kB 81.67 kB
oss-stable-semver/react-dom/cjs/react-dom-server.node.development.js = 376.01 kB 373.98 kB = 82.07 kB 81.65 kB
oss-experimental/react-dom/cjs/react-dom-server.bun.production.min.js = 77.53 kB 77.11 kB = 23.51 kB 23.42 kB
oss-stable/react-dom/cjs/react-dom-server.edge.development.js = 374.97 kB 372.94 kB = 82.19 kB 81.77 kB
oss-stable-semver/react-dom/cjs/react-dom-server.edge.development.js = 374.95 kB 372.91 kB = 82.16 kB 81.74 kB
oss-stable/react-dom/cjs/react-dom-server.browser.development.js = 374.56 kB 372.53 kB = 82.07 kB 81.65 kB
oss-stable-semver/react-dom/cjs/react-dom-server.browser.development.js = 374.54 kB 372.50 kB = 82.04 kB 81.62 kB
oss-stable/react-dom/umd/react-dom-server.browser.development.js = 392.58 kB 390.44 kB = 83.01 kB 82.52 kB
oss-stable-semver/react-dom/umd/react-dom-server.browser.development.js = 392.55 kB 390.41 kB = 82.98 kB 82.50 kB
oss-stable/react-dom/cjs/react-dom-server.bun.development.js = 371.79 kB 369.75 kB = 81.16 kB 80.74 kB
oss-stable-semver/react-dom/cjs/react-dom-server.bun.development.js = 371.76 kB 369.73 kB = 81.13 kB 80.71 kB
oss-stable/react-dom/cjs/react-dom-server-legacy.node.development.js = 376.69 kB 374.61 kB = 82.15 kB 81.72 kB
oss-stable-semver/react-dom/cjs/react-dom-server-legacy.node.development.js = 376.67 kB 374.58 kB = 82.12 kB 81.70 kB
oss-experimental/react-dom/umd/react-dom-server.browser.production.min.js = 76.13 kB 75.71 kB = 23.37 kB 23.26 kB
facebook-www/ReactDOMServer-dev.classic.js = 396.83 kB 394.63 kB = 85.96 kB 85.40 kB
oss-stable/react-dom/cjs/react-dom-server-legacy.browser.development.js = 374.84 kB 372.75 kB = 81.69 kB 81.27 kB
oss-stable-semver/react-dom/cjs/react-dom-server-legacy.browser.development.js = 374.81 kB 372.73 kB = 81.67 kB 81.24 kB
oss-stable/react-dom/umd/react-dom-server-legacy.browser.development.js = 392.88 kB 390.69 kB = 82.61 kB 82.13 kB
oss-stable-semver/react-dom/umd/react-dom-server-legacy.browser.development.js = 392.85 kB 390.66 kB = 82.59 kB 82.11 kB
oss-experimental/react-dom/cjs/react-dom-server.browser.production.min.js = 76.01 kB 75.58 kB = 23.03 kB 22.94 kB
facebook-www/ReactDOMServerStreaming-dev.modern.js = 384.09 kB 381.93 kB = 83.06 kB 82.51 kB
oss-stable/react-dom/cjs/react-dom-server.node.production.min.js = 74.94 kB 74.52 kB = 23.08 kB 23.00 kB
oss-stable-semver/react-dom/cjs/react-dom-server.node.production.min.js = 74.91 kB 74.49 kB = 23.05 kB 22.98 kB
oss-experimental/react-dom/cjs/react-dom-server-legacy.node.production.min.js = 77.38 kB 76.94 kB = 23.31 kB 23.21 kB
oss-stable/react-dom/cjs/react-dom-server.edge.production.min.js = 74.88 kB 74.45 kB = 23.00 kB 22.93 kB
oss-stable-semver/react-dom/cjs/react-dom-server.edge.production.min.js = 74.85 kB 74.43 kB = 22.97 kB 22.91 kB
facebook-www/ReactDOMServer-dev.modern.js = 389.41 kB 387.20 kB = 84.32 kB 83.77 kB
oss-stable/react-dom/cjs/react-dom-server.bun.production.min.js = 72.98 kB 72.56 kB = 22.01 kB 21.94 kB
oss-stable-semver/react-dom/cjs/react-dom-server.bun.production.min.js = 72.96 kB 72.54 kB = 21.98 kB 21.91 kB
oss-stable/react-dom/cjs/react-dom-server-legacy.node.production.min.js = 72.84 kB 72.40 kB = 21.82 kB 21.71 kB
oss-stable-semver/react-dom/cjs/react-dom-server-legacy.node.production.min.js = 72.81 kB 72.37 kB = 21.80 kB 21.69 kB
oss-stable/react-dom/umd/react-dom-server.browser.production.min.js = 69.90 kB 69.48 kB = 21.77 kB 21.65 kB
oss-stable-semver/react-dom/umd/react-dom-server.browser.production.min.js = 69.88 kB 69.46 kB = 21.74 kB 21.63 kB
oss-experimental/react-dom/umd/react-dom-server-legacy.browser.production.min.js = 71.51 kB 71.08 kB = 21.81 kB 21.68 kB
oss-stable/react-dom/cjs/react-dom-server.browser.production.min.js = 69.76 kB 69.34 kB = 21.45 kB 21.37 kB
oss-stable-semver/react-dom/cjs/react-dom-server.browser.production.min.js = 69.74 kB 69.31 kB = 21.43 kB 21.34 kB
oss-experimental/react-dom/cjs/react-dom-server-legacy.browser.production.min.js = 71.36 kB 70.92 kB = 21.47 kB 21.37 kB
oss-stable/react-dom/umd/react-dom-server-legacy.browser.production.min.js = 67.23 kB 66.79 kB = 20.35 kB 20.21 kB
oss-stable-semver/react-dom/umd/react-dom-server-legacy.browser.production.min.js = 67.20 kB 66.77 kB = 20.32 kB 20.19 kB
oss-stable/react-dom/cjs/react-dom-server-legacy.browser.production.min.js = 67.07 kB 66.63 kB = 20.00 kB 19.89 kB
oss-stable-semver/react-dom/cjs/react-dom-server-legacy.browser.production.min.js = 67.04 kB 66.61 kB = 19.97 kB 19.87 kB

Generated by 🚫 dangerJS against 1254235

@gnoff
Copy link
Collaborator Author

gnoff commented Sep 25, 2023

closing as part of #27400

@gnoff gnoff closed this Sep 25, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed React Core Team Opened by a member of the React Core Team
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants