Skip to content

Use console.timeStamp instead of performance.measure in Component Performance Track #32736

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

Open
wants to merge 4 commits into
base: main
Choose a base branch
from

Conversation

sebmarkbage
Copy link
Collaborator

@sebmarkbage sebmarkbage commented Mar 25, 2025

This is a new extension that Chrome added to the existing console.timeStamp similar to the extensions added to performance.measure. This one should be significantly faster because it doesn't have the extra object indirection, it doesn't return a PerformanceMeasure entry and doesn't register itself with the global system of entries.

I also use performance.measure in DEV for errors since we can attach the error to the properties extension which doesn't exist for console.timeStamp.

A downside of using this API is that there's no programmatic API for the site itself to collect its own logs from React. Which the previous allowed us to use the standard performance.getEntries() for. The recommendation instead will be for the site to patch console.timeStamp if it wants to collect measurements from React just like you're recommended to patch console.error or fetch or whatever to collect other instrumentation metrics.

This extension works in Chrome canary but it doesn't yet work fully in Chrome stable. We might want to wait until it has propagated to Chrome to stable. It should be in Chrome 136.

@react-sizebot
Copy link

react-sizebot commented Mar 25, 2025

Comparing: 17f88c8...3bc3e8a

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.js = 6.68 kB 6.68 kB = 1.83 kB 1.83 kB
oss-stable/react-dom/cjs/react-dom-client.production.js = 518.75 kB 518.75 kB = 92.26 kB 92.26 kB
oss-experimental/react-dom/cjs/react-dom.production.js = 6.69 kB 6.69 kB = 1.83 kB 1.83 kB
oss-experimental/react-dom/cjs/react-dom-client.production.js = 624.61 kB 624.61 kB = 110.44 kB 110.44 kB
facebook-www/ReactDOM-prod.classic.js = 658.01 kB 658.01 kB = 115.99 kB 115.99 kB
facebook-www/ReactDOM-prod.modern.js = 648.29 kB 648.29 kB = 114.44 kB 114.44 kB

Significant size changes

Includes any change greater than 0.2%:

Expand to show
Name +/- Base Current +/- gzip Base gzip Current gzip
facebook-www/ReactART-dev.modern.js = 706.04 kB 704.63 kB = 110.29 kB 109.90 kB
oss-experimental/react-server-dom-esm/esm/react-server-dom-esm-client.browser.development.js = 145.48 kB 145.05 kB = 34.29 kB 34.19 kB
facebook-www/ReactDOM-profiling.classic.js = 729.44 kB 725.68 kB = 125.99 kB 125.21 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-client.node.development.js = 117.76 kB 117.15 kB = 22.18 kB 22.03 kB
facebook-www/ReactDOM-profiling.modern.js = 721.39 kB 717.63 kB = 124.69 kB 123.91 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-client.node.unbundled.development.js = 116.43 kB 115.82 kB = 21.92 kB 21.78 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-client.edge.development.js = 115.52 kB 114.91 kB = 22.04 kB 21.89 kB
oss-experimental/react-server-dom-turbopack/cjs/react-server-dom-turbopack-client.edge.development.js = 115.43 kB 114.82 kB = 22.01 kB 21.85 kB
oss-experimental/react-server-dom-turbopack/cjs/react-server-dom-turbopack-client.node.development.js = 113.69 kB 113.07 kB = 21.65 kB 21.50 kB
oss-experimental/react-server-dom-parcel/cjs/react-server-dom-parcel-client.edge.development.js = 112.34 kB 111.72 kB = 21.51 kB 21.35 kB
oss-experimental/react-server-dom-esm/cjs/react-server-dom-esm-client.node.development.js = 111.05 kB 110.44 kB = 21.17 kB 21.02 kB
oss-experimental/react-server-dom-parcel/cjs/react-server-dom-parcel-client.node.development.js = 110.53 kB 109.92 kB = 21.15 kB 21.00 kB
oss-experimental/react-dom/cjs/react-dom-profiling.profiling.js = 688.76 kB 684.90 kB = 120.19 kB 119.42 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-client.browser.development.js = 109.19 kB 108.58 kB = 20.93 kB 20.77 kB
oss-experimental/react-server-dom-turbopack/cjs/react-server-dom-turbopack-client.browser.development.js = 108.64 kB 108.02 kB = 20.79 kB 20.64 kB
oss-experimental/react-client/cjs/react-client-flight.development.js = 108.10 kB 107.49 kB = 20.16 kB 20.00 kB
oss-experimental/react-server-dom-parcel/cjs/react-server-dom-parcel-client.browser.development.js = 106.81 kB 106.20 kB = 20.34 kB 20.19 kB
oss-experimental/react-server-dom-esm/cjs/react-server-dom-esm-client.browser.development.js = 106.45 kB 105.84 kB = 20.40 kB 20.24 kB
oss-experimental/react-reconciler/cjs/react-reconciler.profiling.js = 528.10 kB 524.11 kB = 83.67 kB 82.82 kB

Generated by 🚫 dangerJS against 3bc3e8a

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.

5 participants