react.dev
react.dev copied to clipboard
Published
20 hours ago •
reactjs
reactjs
[Beta] Replace render with createRoot
Size Changes
📦 Next.js Bundle Analysis
This analysis was generated by the next.js bundle analysis action 🤖
New Page Added
The following page was added to the bundle from the code in this PR:
| Page | Size (compressed) | First Load |
|---|---|---|
/apis/createroot |
48.65 KB |
133.32 KB |
One Hundred Ninety-one Pages Changed Size
The following pages changed size from the code in this PR compared to its base branch:
| Page | Size (compressed) | First Load |
|---|---|---|
/ |
47.97 KB (🟡 +2 B) |
132.64 KB |
/404 |
47.07 KB (🟡 +2 B) |
131.74 KB |
/apis |
47.85 KB (🟡 +2 B) |
132.52 KB |
/apis/createcontext |
49.6 KB (🟡 +2 B) |
134.27 KB |
/apis/reactdom |
47.79 KB (-4 B) |
132.46 KB |
/apis/render |
49.83 KB (🟡 +2 B) |
134.5 KB |
/apis/usecontext |
55.56 KB (🟡 +2 B) |
140.23 KB |
/apis/usereducer |
55.19 KB (🟡 +2 B) |
139.86 KB |
/apis/useref |
52.89 KB (🟡 +2 B) |
137.55 KB |
/apis/usestate |
58.83 KB (🟡 +2 B) |
143.5 KB |
/blog |
40.42 KB (🟡 +2 B) |
125.09 KB |
/blog/2013/06/02/jsfiddle-integration |
57.88 KB (🟡 +2 B) |
142.55 KB |
/blog/2013/06/05/why-react |
59.61 KB (🟡 +2 B) |
144.27 KB |
/blog/2013/06/12/community-roundup |
59.31 KB (🟡 +2 B) |
143.98 KB |
/blog/2013/06/19/community-roundup-2 |
59.97 KB (🟡 +2 B) |
144.64 KB |
/blog/2013/06/21/react-v0-3-3 |
58.03 KB (🟡 +2 B) |
142.69 KB |
/blog/2013/06/27/community-roundup-3 |
60.34 KB (🟡 +2 B) |
145.01 KB |
/blog/2013/07/02/react-v0-4-autobind-by-default |
58.64 KB (🟡 +2 B) |
143.31 KB |
/blog/2013/07/03/community-roundup-4 |
59.71 KB (🟡 +2 B) |
144.38 KB |
/blog/2013/07/11/react-v0-4-prop-validation-and-default-values |
58.52 KB (🟡 +2 B) |
143.18 KB |
/blog/2013/07/17/react-v0-4-0 |
59.23 KB (🟡 +2 B) |
143.89 KB |
/blog/2013/07/23/community-roundup-5 |
60.1 KB (🟡 +2 B) |
144.77 KB |
/blog/2013/07/26/react-v0-4-1 |
57.99 KB (🟡 +2 B) |
142.66 KB |
/blog/2013/07/30/use-react-and-jsx-in-ruby-on-rails |
58.59 KB (🟡 +2 B) |
143.26 KB |
/blog/2013/08/05/community-roundup-6 |
59.4 KB (🟡 +2 B) |
144.07 KB |
/blog/2013/08/19/use-react-and-jsx-in-python-applications |
58.61 KB (🟡 +2 B) |
143.27 KB |
/blog/2013/08/26/community-roundup-7 |
59.57 KB (🟡 +2 B) |
144.24 KB |
/blog/2013/09/24/community-roundup-8 |
61 KB (🟡 +2 B) |
145.67 KB |
/blog/2013/10/03/community-roundup-9 |
59.93 KB (🟡 +2 B) |
144.6 KB |
/blog/2013/10/16/react-v0.5.0 |
59.62 KB (🟡 +2 B) |
144.29 KB |
/blog/2013/10/29/react-v0-5-1 |
57.98 KB (🟡 +2 B) |
142.65 KB |
/blog/2013/11/06/community-roundup-10 |
61.6 KB (🟡 +2 B) |
146.26 KB |
/blog/2013/11/18/community-roundup-11 |
60.68 KB (🟡 +2 B) |
145.35 KB |
/blog/2013/12/18/react-v0.5.2-v0.4.2 |
58.45 KB (🟡 +2 B) |
143.12 KB |
/blog/2013/12/19/react-v0.8.0 |
58.87 KB (🟡 +2 B) |
143.54 KB |
/blog/2013/12/23/community-roundup-12 |
60.33 KB (🟡 +2 B) |
145 KB |
/blog/2013/12/30/community-roundup-13 |
60.11 KB (🟡 +2 B) |
144.78 KB |
/blog/2014/01/02/react-chrome-developer-tools |
58.37 KB (🟡 +2 B) |
143.04 KB |
/blog/2014/01/06/community-roundup-14 |
59.71 KB (🟡 +2 B) |
144.38 KB |
/blog/2014/02/05/community-roundup-15 |
60.93 KB (🟡 +2 B) |
145.59 KB |
/blog/2014/02/15/community-roundup-16 |
60.63 KB (🟡 +2 B) |
145.3 KB |
/blog/2014/02/16/react-v0.9-rc1 |
61.04 KB (🟡 +2 B) |
145.71 KB |
/blog/2014/02/20/react-v0.9 |
61.49 KB (🟡 +2 B) |
146.16 KB |
/blog/2014/02/24/community-roundup-17 |
60.35 KB (🟡 +2 B) |
145.02 KB |
/blog/2014/03/14/community-roundup-18 |
61.32 KB (🟡 +2 B) |
145.99 KB |
/blog/2014/03/19/react-v0.10-rc1 |
59.63 KB (🟡 +2 B) |
144.29 KB |
/blog/2014/03/21/react-v0.10 |
59.65 KB (🟡 +2 B) |
144.32 KB |
/blog/2014/03/28/the-road-to-1.0 |
59.76 KB (🟡 +2 B) |
144.43 KB |
/blog/2014/04/04/reactnet |
58.41 KB (🟡 +2 B) |
143.07 KB |
/blog/2014/05/06/flux |
58.53 KB (🟡 +2 B) |
143.2 KB |
/blog/2014/05/29/one-year-of-open-source-react |
58.75 KB (🟡 +2 B) |
143.42 KB |
/blog/2014/06/27/community-roundup-19 |
60.3 KB (🟡 +2 B) |
144.96 KB |
/blog/2014/07/13/react-v0.11-rc1 |
60.68 KB (🟡 +2 B) |
145.35 KB |
/blog/2014/07/17/react-v0.11 |
61.93 KB (🟡 +2 B) |
146.6 KB |
/blog/2014/07/25/react-v0.11.1 |
58.88 KB (🟡 +2 B) |
143.55 KB |
/blog/2014/07/28/community-roundup-20 |
60.44 KB (🟡 +2 B) |
145.11 KB |
/blog/2014/07/30/flux-actions-and-the-dispatcher |
60.07 KB (🟡 +2 B) |
144.74 KB |
/blog/2014/08/03/community-roundup-21 |
60.11 KB (🟡 +2 B) |
144.77 KB |
/blog/2014/09/03/introducing-the-jsx-specification |
58.11 KB (🟡 +2 B) |
142.78 KB |
/blog/2014/09/12/community-round-up-22 |
60.59 KB (🟡 +2 B) |
145.25 KB |
/blog/2014/09/16/react-v0.11.2 |
58.88 KB (🟡 +2 B) |
143.55 KB |
/blog/2014/09/24/testing-flux-applications |
62.06 KB (🟡 +2 B) |
146.73 KB |
/blog/2014/10/14/introducing-react-elements |
61.02 KB (🟡 +2 B) |
145.68 KB |
/blog/2014/10/16/react-v0.12-rc1 |
60.98 KB (🟡 +2 B) |
145.65 KB |
/blog/2014/10/17/community-roundup-23 |
61.55 KB (🟡 +2 B) |
146.22 KB |
/blog/2014/10/27/react-js-conf |
58.16 KB (🟡 +2 B) |
142.82 KB |
/blog/2014/10/28/react-v0.12 |
60.92 KB (🟡 +2 B) |
145.59 KB |
/blog/2014/11/24/react-js-conf-updates |
58.54 KB (🟡 +2 B) |
143.21 KB |
/blog/2014/11/25/community-roundup-24 |
61.78 KB (🟡 +2 B) |
146.45 KB |
/blog/2014/12/18/react-v0.12.2 |
58.57 KB (🟡 +2 B) |
143.24 KB |
/blog/2014/12/19/react-js-conf-diversity-scholarship |
58.97 KB (🟡 +2 B) |
143.63 KB |
/blog/2015/01/27/react-v0.13.0-beta-1 |
59.93 KB (🟡 +2 B) |
144.6 KB |
/blog/2015/02/18/react-conf-roundup-2015 |
61.92 KB (🟡 +2 B) |
146.58 KB |
/blog/2015/02/20/introducing-relay-and-graphql |
61.07 KB (🟡 +2 B) |
145.74 KB |
/blog/2015/02/24/react-v0.13-rc1 |
59.97 KB (🟡 +2 B) |
144.64 KB |
/blog/2015/02/24/streamlining-react-elements |
62.52 KB (🟡 +2 B) |
147.19 KB |
/blog/2015/03/03/react-v0.13-rc2 |
59.31 KB (🟡 +2 B) |
143.98 KB |
/blog/2015/03/04/community-roundup-25 |
60.27 KB (🟡 +2 B) |
144.93 KB |
/blog/2015/03/10/react-v0.13 |
60.58 KB (🟡 +2 B) |
145.25 KB |
/blog/2015/03/16/react-v0.13.1 |
58.41 KB (🟡 +2 B) |
143.07 KB |
/blog/2015/03/19/building-the-facebook-news-feed-with-relay |
61.16 KB (🟡 +2 B) |
145.83 KB |
/blog/2015/03/26/introducing-react-native |
58.3 KB (🟡 +2 B) |
142.97 KB |
/blog/2015/03/30/community-roundup-26 |
60.23 KB (🟡 +2 B) |
144.9 KB |
/blog/2015/04/17/react-native-v0.4 |
59.15 KB (🟡 +2 B) |
143.82 KB |
/blog/2015/04/18/react-v0.13.2 |
58.48 KB (🟡 +2 B) |
143.15 KB |
/blog/2015/05/01/graphql-introduction |
62.98 KB (🟡 +2 B) |
147.64 KB |
/blog/2015/05/08/react-v0.13.3 |
58.37 KB (🟡 +2 B) |
143.04 KB |
/blog/2015/05/22/react-native-release-process |
58.53 KB (🟡 +2 B) |
143.19 KB |
/blog/2015/06/12/deprecating-jstransform-and-react-tools |
58.98 KB (🟡 +2 B) |
143.64 KB |
/blog/2015/07/03/react-v0.14-beta-1 |
60.48 KB (🟡 +2 B) |
145.15 KB |
/blog/2015/08/03/new-react-devtools-beta |
59.09 KB (🟡 +2 B) |
143.75 KB |
/blog/2015/08/11/relay-technical-preview |
59.15 KB (🟡 +2 B) |
143.82 KB |
/blog/2015/08/13/reacteurope-roundup |
60.74 KB (🟡 +2 B) |
145.41 KB |
/blog/2015/09/02/new-react-developer-tools |
58.5 KB (🟡 +2 B) |
143.17 KB |
/blog/2015/09/10/react-v0.14-rc1 |
64.19 KB (🟡 +2 B) |
148.86 KB |
/blog/2015/09/14/community-roundup-27 |
60.66 KB (🟡 +2 B) |
145.33 KB |
/blog/2015/10/01/react-render-and-top-level-api |
59.64 KB (🟡 +2 B) |
144.3 KB |
/blog/2015/10/07/react-v0.14 |
64.67 KB (🟡 +2 B) |
149.34 KB |
/blog/2015/10/19/reactiflux-is-moving-to-discord |
60.39 KB (🟡 +2 B) |
145.06 KB |
/blog/2015/10/28/react-v0.14.1 |
58.4 KB (🟡 +2 B) |
143.07 KB |
/blog/2015/11/02/react-v0.14.2 |
58.43 KB (🟡 +2 B) |
143.09 KB |
/blog/2015/11/18/react-v0.14.3 |
58.55 KB (🟡 +2 B) |
143.22 KB |
/blog/2015/12/04/react-js-conf-2016-diversity-scholarship |
59.42 KB (🟡 +2 B) |
144.09 KB |
/blog/2015/12/16/ismounted-antipattern |
59.02 KB (🟡 +2 B) |
143.69 KB |
/blog/2015/12/18/react-components-elements-and-instances |
62.94 KB (🟡 +2 B) |
147.61 KB |
/blog/2015/12/29/react-v0.14.4 |
58.22 KB (🟡 +2 B) |
142.89 KB |
/blog/2016/01/08/A-implies-B-does-not-imply-B-implies-A |
59.24 KB (🟡 +2 B) |
143.9 KB |
/blog/2016/01/12/discontinuing-ie8-support |
58.05 KB (🟡 +2 B) |
142.71 KB |
/blog/2016/02/19/new-versioning-scheme |
59.42 KB (🟡 +2 B) |
144.09 KB |
/blog/2016/03/07/react-v15-rc1 |
62.18 KB (🟡 +2 B) |
146.85 KB |
/blog/2016/03/16/react-v15-rc2 |
59.04 KB (🟡 +2 B) |
143.71 KB |
/blog/2016/03/29/react-v0.14.8 |
58.18 KB (🟡 +2 B) |
142.84 KB |
/blog/2016/04/07/react-v15 |
66.37 KB (🟡 +2 B) |
151.03 KB |
/blog/2016/04/08/react-v15.0.1 |
58.93 KB (🟡 +2 B) |
143.6 KB |
/blog/2016/07/11/introducing-reacts-error-code-system |
58.64 KB (🟡 +2 B) |
143.31 KB |
/blog/2016/07/13/mixins-considered-harmful |
66.79 KB (🟡 +2 B) |
151.46 KB |
/blog/2016/07/22/create-apps-with-no-configuration |
62.12 KB (🟡 +2 B) |
146.79 KB |
/blog/2016/08/05/relay-state-of-the-state |
62.16 KB (🟡 +2 B) |
146.83 KB |
/blog/2016/09/28/our-first-50000-stars |
63.61 KB (🟡 +2 B) |
148.28 KB |
/blog/2016/11/16/react-v15.4.0 |
61.56 KB (🟡 +2 B) |
146.23 KB |
/blog/2017/04/07/react-v15.5.0 |
62.13 KB (🟡 +2 B) |
146.8 KB |
/blog/2017/05/18/whats-new-in-create-react-app |
61.53 KB (🟡 +2 B) |
146.19 KB |
/blog/2017/06/13/react-v15.6.0 |
60.15 KB (🟡 +2 B) |
144.81 KB |
/blog/2017/07/26/error-handling-in-react-16 |
60.5 KB (🟡 +2 B) |
145.17 KB |
/blog/2017/09/08/dom-attributes-in-react-16 |
60.93 KB (🟡 +2 B) |
145.59 KB |
/blog/2017/09/25/react-v15.6.2 |
59.26 KB (🟡 +2 B) |
143.93 KB |
/blog/2017/09/26/react-v16.0 |
64.39 KB (🟡 +2 B) |
149.06 KB |
/blog/2017/11/28/react-v16.2.0-fragment-support |
62.32 KB (🟡 +2 B) |
146.99 KB |
/blog/2017/12/07/introducing-the-react-rfc-process |
58.84 KB (🟡 +2 B) |
143.51 KB |
/blog/2017/12/15/improving-the-repository-infrastructure |
74.63 KB (🟡 +2 B) |
159.3 KB |
/blog/2018/03/01/sneak-peek-beyond-react-16 |
58.8 KB (🟡 +2 B) |
143.47 KB |
/blog/2018/03/27/update-on-async-rendering |
64.04 KB (🟡 +2 B) |
148.71 KB |
/blog/2018/03/29/react-v-16-3 |
60.86 KB (🟡 +2 B) |
145.53 KB |
/blog/2018/05/23/react-v-16-4 |
61 KB (🟡 +2 B) |
145.67 KB |
/blog/2018/06/07/you-probably-dont-need-derived-state |
64.66 KB (🟡 +2 B) |
149.33 KB |
/blog/2018/08/01/react-v-16-4-2 |
59.65 KB (🟡 +2 B) |
144.32 KB |
/blog/2018/09/10/introducing-the-react-profiler |
61.26 KB (🟡 +2 B) |
145.93 KB |
/blog/2018/10/01/create-react-app-v2 |
61.74 KB (🟡 +2 B) |
146.41 KB |
/blog/2018/10/23/react-v-16-6 |
60.94 KB (🟡 +2 B) |
145.6 KB |
/blog/2018/11/13/react-conf-recap |
58.65 KB (🟡 +2 B) |
143.32 KB |
/blog/2018/11/27/react-16-roadmap |
64.84 KB (🟡 +2 B) |
149.51 KB |
/blog/2018/12/19/react-v-16-7 |
59.77 KB (🟡 +2 B) |
144.44 KB |
/blog/2019/02/06/react-v16.8.0 |
62.04 KB (🟡 +2 B) |
146.71 KB |
/blog/2019/02/23/is-react-translated-yet |
61.6 KB (🟡 +2 B) |
146.27 KB |
/blog/2019/08/08/react-v16.9.0 |
64.53 KB (🟡 +2 B) |
149.2 KB |
/blog/2019/08/15/new-react-devtools |
59.14 KB (🟡 +2 B) |
143.81 KB |
/blog/2019/10/22/react-release-channels |
60.96 KB (🟡 +2 B) |
145.63 KB |
/blog/2019/11/06/building-great-user-experiences-with-concurrent-mode-and-suspense |
65.66 KB (🟡 +2 B) |
150.33 KB |
/blog/2020/02/26/react-v16.13.0 |
61.88 KB (🟡 +2 B) |
146.55 KB |
/blog/2020/08/10/react-v17-rc |
68.16 KB (🟡 +2 B) |
152.83 KB |
/blog/all |
56.44 KB (🟡 +2 B) |
141.11 KB |
/community |
47.66 KB (🟡 +2 B) |
132.33 KB |
/community/acknowledgements |
48.85 KB (🟡 +2 B) |
133.52 KB |
/community/meet-the-team |
49.55 KB (🟡 +2 B) |
134.21 KB |
/learn |
52.62 KB (🟡 +2 B) |
137.29 KB |
/learn/add-react-to-a-website |
52.74 KB (🟡 +2 B) |
137.4 KB |
/learn/adding-interactivity |
54.31 KB (🟡 +2 B) |
138.97 KB |
/learn/choosing-the-state-structure |
60.03 KB (🟡 +2 B) |
144.7 KB |
/learn/conditional-rendering |
52.26 KB (🟡 +2 B) |
136.93 KB |
/learn/describing-the-ui |
51.47 KB (🟡 +2 B) |
136.14 KB |
/learn/editor-setup |
48.94 KB (🟡 +2 B) |
133.61 KB |
/learn/escape-hatches |
46.99 KB (🟡 +2 B) |
131.66 KB |
/learn/extracting-state-logic-into-a-reducer |
57.67 KB (🟡 +2 B) |
142.33 KB |
/learn/importing-and-exporting-components |
50.66 KB (🟡 +2 B) |
135.32 KB |
/learn/installation |
48.27 KB (🟡 +2 B) |
132.93 KB |
/learn/javascript-in-jsx-with-curly-braces |
50.73 KB (🟡 +2 B) |
135.4 KB |
/learn/keeping-components-pure |
54.86 KB (🟡 +2 B) |
139.53 KB |
/learn/managing-state |
53.58 KB (🟡 +2 B) |
138.25 KB |
/learn/manipulating-the-dom-with-refs |
55.83 KB (🟡 +2 B) |
140.5 KB |
/learn/passing-data-deeply-with-context |
55.38 KB (🟡 +2 B) |
140.05 KB |
/learn/passing-props-to-a-component |
54.43 KB (🟡 +2 B) |
139.1 KB |
/learn/preserving-and-resetting-state |
58.4 KB (🟡 +2 B) |
143.07 KB |
/learn/queueing-a-series-of-state-updates |
52.23 KB (🟡 +2 B) |
136.9 KB |
/learn/react-developer-tools |
48.22 KB (🟡 +2 B) |
132.89 KB |
/learn/reacting-to-input-with-state |
56.84 KB (🟡 +2 B) |
141.51 KB |
/learn/referencing-values-with-refs |
53.75 KB (🟡 +2 B) |
138.42 KB |
/learn/render-and-commit |
50.73 KB (🟡 +2 B) |
135.4 KB |
/learn/rendering-lists |
54.82 KB (🟡 +2 B) |
139.49 KB |
/learn/responding-to-events |
53.75 KB (🟡 +2 B) |
138.42 KB |
/learn/scaling-up-with-reducer-and-context |
51.8 KB (🟡 +2 B) |
136.46 KB |
/learn/sharing-state-between-components |
52.88 KB (🟡 +2 B) |
137.55 KB |
/learn/start-a-new-react-project |
49.3 KB (🟡 +2 B) |
133.96 KB |
/learn/state-a-components-memory |
57.96 KB (🟡 +2 B) |
142.62 KB |
/learn/state-as-a-snapshot |
51.53 KB (🟡 +2 B) |
136.2 KB |
/learn/synchronizing-with-effects |
64.6 KB (🟡 +2 B) |
149.27 KB |
/learn/thinking-in-react |
53.59 KB (🟡 +2 B) |
138.26 KB |
/learn/updating-arrays-in-state |
55.83 KB (🟡 +2 B) |
140.5 KB |
/learn/updating-objects-in-state |
55.56 KB (🟡 +2 B) |
140.23 KB |
/learn/writing-markup-with-jsx |
50.98 KB (🟡 +2 B) |
135.64 KB |
/learn/you-might-not-need-an-effect |
62.92 KB (🟡 +2 B) |
147.59 KB |
/learn/your-first-component |
51.57 KB (🟡 +2 B) |
136.23 KB |
Details
Only the gzipped size is provided here based on an expert tip.
First Load is the size of the global bundle plus the bundle for the individual page. If a user were to show up to your website and land on a given page, the first load size represents the amount of javascript that user would need to download. If next/link is used, subsequent page loads would only need to download that page's bundle (the number in the "Size" column), since the global bundle has already been downloaded.
Any third party scripts you have added directly to your app using the <script> tag are not accounted for in this analysis
Next to the size is how much the size has increased or decreased compared with the base branch of this PR. If this percentage has increased by 10% or more, there will be a red status indicator applied, indicating that special attention should be given to this.
![github-actions[bot] avatar](https://avatars.githubusercontent.com/in/15368?v=4 "Published by a pub.dev verified publisher"){kind=small}
