Skip to content

Conversation

gaearon
Copy link
Member

@gaearon gaearon commented May 23, 2022

We shouldn't be loading CodeMirror Linter plugin on the homepage. At least is should be delayed.

Note this change may not be ideal either because now it loads the linter rules earlier than before. So maybe there are more changes needed. I've changed this to keep the old strategy but just avoid the accidental eager import by splitting the utils file.

@github-actions
Copy link

github-actions bot commented May 23, 2022

Size Changes

📦 Next.js Bundle Analysis

This analysis was generated by the next.js bundle analysis action 🤖

⚠️ Global Bundle Size Increased

Page Size (compressed)
global 95.32 KB (🟡 +22 B)
Details

The global bundle is the javascript bundle that loads alongside every page. It is in its own category because its impact is much higher - an increase to its size means that every page on your website loads slower, and a decrease means every page loads faster.

Any third party scripts you have added directly to your app using the <script> tag are not accounted for in this analysis

If you want further insight into what is behind the changes, give @next/bundle-analyzer a try!

One Hundred Eighty-seven Pages Changed Size

The following pages changed size from the code in this PR compared to its base branch:

Page Size (compressed) First Load
/ 54.71 KB (🟢 -62.3 KB) 150.03 KB
/404 53.81 KB (🟢 -62.3 KB) 149.13 KB
/apis 54.59 KB (🟢 -62.3 KB) 149.91 KB
/apis/createcontext 56.34 KB (🟢 -62.3 KB) 151.67 KB
/apis/reactdom 54.53 KB (🟢 -62.3 KB) 149.85 KB
/apis/render 56.57 KB (🟢 -62.3 KB) 151.89 KB
/apis/usecontext 62.3 KB (🟢 -62.3 KB) 157.63 KB
/apis/usereducer 61.93 KB (🟢 -62.3 KB) 157.25 KB
/apis/useref 59.65 KB (🟢 -62.3 KB) 154.97 KB
/apis/usestate 65.56 KB (🟢 -62.3 KB) 160.88 KB
/blog/2013/06/02/jsfiddle-integration 65.09 KB (🟢 -62.3 KB) 160.41 KB
/blog/2013/06/05/why-react 66.82 KB (🟢 -62.3 KB) 162.14 KB
/blog/2013/06/12/community-roundup 66.52 KB (🟢 -62.3 KB) 161.84 KB
/blog/2013/06/19/community-roundup-2 67.19 KB (🟢 -62.3 KB) 162.51 KB
/blog/2013/06/21/react-v0-3-3 65.24 KB (🟢 -62.3 KB) 160.56 KB
/blog/2013/06/27/community-roundup-3 67.56 KB (🟢 -62.3 KB) 162.88 KB
/blog/2013/07/02/react-v0-4-autobind-by-default 65.86 KB (🟢 -62.3 KB) 161.18 KB
/blog/2013/07/03/community-roundup-4 66.92 KB (🟢 -62.3 KB) 162.25 KB
/blog/2013/07/11/react-v0-4-prop-validation-and-default-values 65.73 KB (🟢 -62.3 KB) 161.05 KB
/blog/2013/07/17/react-v0-4-0 66.44 KB (🟢 -62.3 KB) 161.76 KB
/blog/2013/07/23/community-roundup-5 67.32 KB (🟢 -62.3 KB) 162.64 KB
/blog/2013/07/26/react-v0-4-1 65.2 KB (🟢 -62.3 KB) 160.53 KB
/blog/2013/07/30/use-react-and-jsx-in-ruby-on-rails 65.81 KB (🟢 -62.3 KB) 161.13 KB
/blog/2013/08/05/community-roundup-6 66.61 KB (🟢 -62.3 KB) 161.93 KB
/blog/2013/08/19/use-react-and-jsx-in-python-applications 65.82 KB (🟢 -62.3 KB) 161.14 KB
/blog/2013/08/26/community-roundup-7 66.78 KB (🟢 -62.3 KB) 162.11 KB
/blog/2013/09/24/community-roundup-8 68.21 KB (🟢 -62.3 KB) 163.54 KB
/blog/2013/10/03/community-roundup-9 67.15 KB (🟢 -62.3 KB) 162.47 KB
/blog/2013/10/16/react-v0.5.0 66.83 KB (🟢 -62.3 KB) 162.15 KB
/blog/2013/10/29/react-v0-5-1 65.19 KB (🟢 -62.3 KB) 160.51 KB
/blog/2013/11/06/community-roundup-10 68.81 KB (🟢 -62.3 KB) 164.13 KB
/blog/2013/11/18/community-roundup-11 67.89 KB (🟢 -62.3 KB) 163.21 KB
/blog/2013/12/18/react-v0.5.2-v0.4.2 65.66 KB (🟢 -62.3 KB) 160.99 KB
/blog/2013/12/19/react-v0.8.0 66.08 KB (🟢 -62.3 KB) 161.41 KB
/blog/2013/12/23/community-roundup-12 67.54 KB (🟢 -62.3 KB) 162.87 KB
/blog/2013/12/30/community-roundup-13 67.33 KB (🟢 -62.3 KB) 162.65 KB
/blog/2014/01/02/react-chrome-developer-tools 65.58 KB (🟢 -62.3 KB) 160.9 KB
/blog/2014/01/06/community-roundup-14 66.92 KB (🟢 -62.3 KB) 162.24 KB
/blog/2014/02/05/community-roundup-15 68.14 KB (🟢 -62.3 KB) 163.46 KB
/blog/2014/02/15/community-roundup-16 67.85 KB (🟢 -62.3 KB) 163.17 KB
/blog/2014/02/16/react-v0.9-rc1 68.25 KB (🟢 -62.3 KB) 163.58 KB
/blog/2014/02/20/react-v0.9 68.7 KB (🟢 -62.3 KB) 164.02 KB
/blog/2014/02/24/community-roundup-17 67.56 KB (🟢 -62.3 KB) 162.89 KB
/blog/2014/03/14/community-roundup-18 68.53 KB (🟢 -62.3 KB) 163.85 KB
/blog/2014/03/19/react-v0.10-rc1 66.84 KB (🟢 -62.3 KB) 162.16 KB
/blog/2014/03/21/react-v0.10 66.86 KB (🟢 -62.3 KB) 162.18 KB
/blog/2014/03/28/the-road-to-1.0 66.97 KB (🟢 -62.3 KB) 162.29 KB
/blog/2014/04/04/reactnet 65.61 KB (🟢 -62.3 KB) 160.94 KB
/blog/2014/05/06/flux 65.74 KB (🟢 -62.3 KB) 161.06 KB
/blog/2014/05/29/one-year-of-open-source-react 65.96 KB (🟢 -62.3 KB) 161.29 KB
/blog/2014/06/27/community-roundup-19 67.51 KB (🟢 -62.3 KB) 162.83 KB
/blog/2014/07/13/react-v0.11-rc1 67.89 KB (🟢 -62.3 KB) 163.21 KB
/blog/2014/07/17/react-v0.11 69.15 KB (🟢 -62.3 KB) 164.47 KB
/blog/2014/07/25/react-v0.11.1 66.1 KB (🟢 -62.3 KB) 161.42 KB
/blog/2014/07/28/community-roundup-20 67.65 KB (🟢 -62.3 KB) 162.98 KB
/blog/2014/07/30/flux-actions-and-the-dispatcher 67.28 KB (🟢 -62.3 KB) 162.61 KB
/blog/2014/08/03/community-roundup-21 67.32 KB (🟢 -62.3 KB) 162.64 KB
/blog/2014/09/03/introducing-the-jsx-specification 65.32 KB (🟢 -62.3 KB) 160.65 KB
/blog/2014/09/12/community-round-up-22 67.8 KB (🟢 -62.3 KB) 163.12 KB
/blog/2014/09/16/react-v0.11.2 66.09 KB (🟢 -62.3 KB) 161.42 KB
/blog/2014/09/24/testing-flux-applications 69.27 KB (🟢 -62.3 KB) 164.6 KB
/blog/2014/10/14/introducing-react-elements 68.23 KB (🟢 -62.3 KB) 163.55 KB
/blog/2014/10/16/react-v0.12-rc1 68.19 KB (🟢 -62.3 KB) 163.52 KB
/blog/2014/10/17/community-roundup-23 68.77 KB (🟢 -62.3 KB) 164.09 KB
/blog/2014/10/27/react-js-conf 65.37 KB (🟢 -62.3 KB) 160.69 KB
/blog/2014/10/28/react-v0.12 68.14 KB (🟢 -62.3 KB) 163.46 KB
/blog/2014/11/24/react-js-conf-updates 65.75 KB (🟢 -62.3 KB) 161.08 KB
/blog/2014/11/25/community-roundup-24 68.99 KB (🟢 -62.3 KB) 164.32 KB
/blog/2014/12/18/react-v0.12.2 65.78 KB (🟢 -62.3 KB) 161.11 KB
/blog/2014/12/19/react-js-conf-diversity-scholarship 66.18 KB (🟢 -62.3 KB) 161.5 KB
/blog/2015/01/27/react-v0.13.0-beta-1 67.15 KB (🟢 -62.3 KB) 162.47 KB
/blog/2015/02/18/react-conf-roundup-2015 69.13 KB (🟢 -62.3 KB) 164.45 KB
/blog/2015/02/20/introducing-relay-and-graphql 68.28 KB (🟢 -62.3 KB) 163.61 KB
/blog/2015/02/24/react-v0.13-rc1 67.18 KB (🟢 -62.3 KB) 162.51 KB
/blog/2015/02/24/streamlining-react-elements 69.74 KB (🟢 -62.3 KB) 165.06 KB
/blog/2015/03/03/react-v0.13-rc2 66.52 KB (🟢 -62.3 KB) 161.84 KB
/blog/2015/03/04/community-roundup-25 67.48 KB (🟢 -62.3 KB) 162.8 KB
/blog/2015/03/10/react-v0.13 67.8 KB (🟢 -62.3 KB) 163.12 KB
/blog/2015/03/16/react-v0.13.1 65.62 KB (🟢 -62.3 KB) 160.94 KB
/blog/2015/03/19/building-the-facebook-news-feed-with-relay 68.38 KB (🟢 -62.3 KB) 163.7 KB
/blog/2015/03/26/introducing-react-native 65.51 KB (🟢 -62.3 KB) 160.84 KB
/blog/2015/03/30/community-roundup-26 67.45 KB (🟢 -62.3 KB) 162.77 KB
/blog/2015/04/17/react-native-v0.4 66.36 KB (🟢 -62.3 KB) 161.68 KB
/blog/2015/04/18/react-v0.13.2 65.7 KB (🟢 -62.3 KB) 161.02 KB
/blog/2015/05/01/graphql-introduction 70.19 KB (🟢 -62.3 KB) 165.51 KB
/blog/2015/05/08/react-v0.13.3 65.58 KB (🟢 -62.3 KB) 160.91 KB
/blog/2015/05/22/react-native-release-process 65.74 KB (🟢 -62.3 KB) 161.06 KB
/blog/2015/06/12/deprecating-jstransform-and-react-tools 66.19 KB (🟢 -62.3 KB) 161.51 KB
/blog/2015/07/03/react-v0.14-beta-1 67.7 KB (🟢 -62.3 KB) 163.02 KB
/blog/2015/08/03/new-react-devtools-beta 66.3 KB (🟢 -62.3 KB) 161.62 KB
/blog/2015/08/11/relay-technical-preview 66.36 KB (🟢 -62.3 KB) 161.69 KB
/blog/2015/08/13/reacteurope-roundup 67.95 KB (🟢 -62.3 KB) 163.28 KB
/blog/2015/09/02/new-react-developer-tools 65.72 KB (🟢 -62.3 KB) 161.04 KB
/blog/2015/09/10/react-v0.14-rc1 71.4 KB (🟢 -62.3 KB) 166.73 KB
/blog/2015/09/14/community-roundup-27 67.88 KB (🟢 -62.3 KB) 163.2 KB
/blog/2015/10/01/react-render-and-top-level-api 66.85 KB (🟢 -62.3 KB) 162.17 KB
/blog/2015/10/07/react-v0.14 71.89 KB (🟢 -62.3 KB) 167.21 KB
/blog/2015/10/19/reactiflux-is-moving-to-discord 67.6 KB (🟢 -62.3 KB) 162.92 KB
/blog/2015/10/28/react-v0.14.1 65.61 KB (🟢 -62.3 KB) 160.93 KB
/blog/2015/11/02/react-v0.14.2 65.64 KB (🟢 -62.3 KB) 160.96 KB
/blog/2015/11/18/react-v0.14.3 65.76 KB (🟢 -62.3 KB) 161.09 KB
/blog/2015/12/04/react-js-conf-2016-diversity-scholarship 66.64 KB (🟢 -62.3 KB) 161.96 KB
/blog/2015/12/16/ismounted-antipattern 66.24 KB (🟢 -62.3 KB) 161.56 KB
/blog/2015/12/18/react-components-elements-and-instances 70.16 KB (🟢 -62.3 KB) 165.48 KB
/blog/2015/12/29/react-v0.14.4 65.43 KB (🟢 -62.3 KB) 160.75 KB
/blog/2016/01/08/A-implies-B-does-not-imply-B-implies-A 66.45 KB (🟢 -62.3 KB) 161.77 KB
/blog/2016/01/12/discontinuing-ie8-support 65.26 KB (🟢 -62.3 KB) 160.58 KB
/blog/2016/02/19/new-versioning-scheme 66.64 KB (🟢 -62.3 KB) 161.96 KB
/blog/2016/03/07/react-v15-rc1 69.39 KB (🟢 -62.3 KB) 164.71 KB
/blog/2016/03/16/react-v15-rc2 66.25 KB (🟢 -62.3 KB) 161.57 KB
/blog/2016/03/29/react-v0.14.8 65.38 KB (🟢 -62.3 KB) 160.71 KB
/blog/2016/04/07/react-v15 73.58 KB (🟢 -62.3 KB) 168.9 KB
/blog/2016/04/08/react-v15.0.1 66.14 KB (🟢 -62.3 KB) 161.47 KB
/blog/2016/07/11/introducing-reacts-error-code-system 65.85 KB (🟢 -62.3 KB) 161.18 KB
/blog/2016/07/13/mixins-considered-harmful 74.01 KB (🟢 -62.3 KB) 169.33 KB
/blog/2016/07/22/create-apps-with-no-configuration 69.34 KB (🟢 -62.3 KB) 164.66 KB
/blog/2016/08/05/relay-state-of-the-state 69.38 KB (🟢 -62.3 KB) 164.7 KB
/blog/2016/09/28/our-first-50000-stars 70.82 KB (🟢 -62.3 KB) 166.15 KB
/blog/2016/11/16/react-v15.4.0 68.78 KB (🟢 -62.3 KB) 164.1 KB
/blog/2017/04/07/react-v15.5.0 69.34 KB (🟢 -62.3 KB) 164.66 KB
/blog/2017/05/18/whats-new-in-create-react-app 68.74 KB (🟢 -62.3 KB) 164.06 KB
/blog/2017/06/13/react-v15.6.0 67.36 KB (🟢 -62.3 KB) 162.68 KB
/blog/2017/07/26/error-handling-in-react-16 67.71 KB (🟢 -62.3 KB) 163.03 KB
/blog/2017/09/08/dom-attributes-in-react-16 68.14 KB (🟢 -62.3 KB) 163.46 KB
/blog/2017/09/25/react-v15.6.2 66.47 KB (🟢 -62.3 KB) 161.8 KB
/blog/2017/09/26/react-v16.0 71.6 KB (🟢 -62.3 KB) 166.92 KB
/blog/2017/11/28/react-v16.2.0-fragment-support 69.54 KB (🟢 -62.3 KB) 164.86 KB
/blog/2017/12/07/introducing-the-react-rfc-process 66.05 KB (🟢 -62.3 KB) 161.38 KB
/blog/2017/12/15/improving-the-repository-infrastructure 81.84 KB (🟢 -62.3 KB) 177.17 KB
/blog/2018/03/01/sneak-peek-beyond-react-16 66.01 KB (🟢 -62.3 KB) 161.33 KB
/blog/2018/03/27/update-on-async-rendering 71.25 KB (🟢 -62.3 KB) 166.58 KB
/blog/2018/03/29/react-v-16-3 68.08 KB (🟢 -62.3 KB) 163.4 KB
/blog/2018/05/23/react-v-16-4 68.21 KB (🟢 -62.3 KB) 163.54 KB
/blog/2018/06/07/you-probably-dont-need-derived-state 71.87 KB (🟢 -62.3 KB) 167.19 KB
/blog/2018/08/01/react-v-16-4-2 66.86 KB (🟢 -62.3 KB) 162.19 KB
/blog/2018/09/10/introducing-the-react-profiler 68.47 KB (🟢 -62.3 KB) 163.8 KB
/blog/2018/10/01/create-react-app-v2 68.95 KB (🟢 -62.3 KB) 164.27 KB
/blog/2018/10/23/react-v-16-6 68.15 KB (🟢 -62.3 KB) 163.47 KB
/blog/2018/11/13/react-conf-recap 65.86 KB (🟢 -62.3 KB) 161.19 KB
/blog/2018/11/27/react-16-roadmap 72.06 KB (🟢 -62.3 KB) 167.38 KB
/blog/2018/12/19/react-v-16-7 66.99 KB (🟢 -62.3 KB) 162.31 KB
/blog/2019/02/06/react-v16.8.0 69.25 KB (🟢 -62.3 KB) 164.58 KB
/blog/2019/02/23/is-react-translated-yet 68.82 KB (🟢 -62.3 KB) 164.14 KB
/blog/2019/08/08/react-v16.9.0 71.75 KB (🟢 -62.3 KB) 167.07 KB
/blog/2019/08/15/new-react-devtools 66.36 KB (🟢 -62.3 KB) 161.68 KB
/blog/2019/10/22/react-release-channels 68.18 KB (🟢 -62.3 KB) 163.5 KB
/blog/2019/11/06/building-great-user-experiences-with-concurrent-mode-and-suspense 72.87 KB (🟢 -62.3 KB) 168.19 KB
/blog/2020/02/26/react-v16.13.0 69.09 KB (🟢 -62.3 KB) 164.41 KB
/blog/2020/08/10/react-v17-rc 75.37 KB (🟢 -62.3 KB) 170.7 KB
/community 54.39 KB (🟢 -62.3 KB) 149.72 KB
/community/acknowledgements 55.59 KB (🟢 -62.3 KB) 150.91 KB
/community/meet-the-team 56.28 KB (🟢 -62.3 KB) 151.6 KB
/learn 59.35 KB (🟢 -62.3 KB) 154.67 KB
/learn/add-react-to-a-website 59.47 KB (🟢 -62.3 KB) 154.8 KB
/learn/adding-interactivity 61.04 KB (🟢 -62.3 KB) 156.36 KB
/learn/choosing-the-state-structure 66.76 KB (🟢 -62.3 KB) 162.08 KB
/learn/conditional-rendering 58.99 KB (🟢 -62.3 KB) 154.32 KB
/learn/describing-the-ui 58.21 KB (🟢 -62.3 KB) 153.53 KB
/learn/editor-setup 55.67 KB (🟢 -62.3 KB) 151 KB
/learn/escape-hatches 53.73 KB (🟢 -62.3 KB) 149.05 KB
/learn/extracting-state-logic-into-a-reducer 64.4 KB (🟢 -62.3 KB) 159.73 KB
/learn/importing-and-exporting-components 57.39 KB (🟢 -62.3 KB) 152.72 KB
/learn/installation 55 KB (🟢 -62.3 KB) 150.32 KB
/learn/javascript-in-jsx-with-curly-braces 57.47 KB (🟢 -62.3 KB) 152.79 KB
/learn/keeping-components-pure 61.6 KB (🟢 -62.3 KB) 156.92 KB
/learn/managing-state 60.33 KB (🟢 -62.3 KB) 155.65 KB
/learn/manipulating-the-dom-with-refs 62.57 KB (🟢 -62.3 KB) 157.89 KB
/learn/passing-data-deeply-with-context 62.13 KB (🟢 -62.3 KB) 157.45 KB
/learn/passing-props-to-a-component 61.17 KB (🟢 -62.3 KB) 156.49 KB
/learn/preserving-and-resetting-state 65.14 KB (🟢 -62.3 KB) 160.46 KB
/learn/queueing-a-series-of-state-updates 58.96 KB (🟢 -62.3 KB) 154.29 KB
/learn/react-developer-tools 54.96 KB (🟢 -62.3 KB) 150.28 KB
/learn/reacting-to-input-with-state 63.58 KB (🟢 -62.3 KB) 158.9 KB
/learn/referencing-values-with-refs 60.48 KB (🟢 -62.3 KB) 155.81 KB
/learn/render-and-commit 57.46 KB (🟢 -62.3 KB) 152.78 KB
/learn/rendering-lists 61.55 KB (🟢 -62.3 KB) 156.87 KB
/learn/responding-to-events 60.49 KB (🟢 -62.3 KB) 155.81 KB
/learn/scaling-up-with-reducer-and-context 58.54 KB (🟢 -62.3 KB) 153.86 KB
/learn/sharing-state-between-components 59.61 KB (🟢 -62.3 KB) 154.94 KB
/learn/start-a-new-react-project 56.01 KB (🟢 -62.3 KB) 151.33 KB
/learn/state-a-components-memory 64.69 KB (🟢 -62.3 KB) 160.02 KB
/learn/state-as-a-snapshot 58.27 KB (🟢 -62.3 KB) 153.59 KB
/learn/thinking-in-react 60.33 KB (🟢 -62.3 KB) 155.65 KB
/learn/updating-arrays-in-state 62.56 KB (🟢 -62.3 KB) 157.88 KB
/learn/updating-objects-in-state 62.29 KB (🟢 -62.3 KB) 157.62 KB
/learn/writing-markup-with-jsx 57.71 KB (🟢 -62.3 KB) 153.03 KB
/learn/your-first-component 58.3 KB (🟢 -62.3 KB) 153.62 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.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants