Fix Stepper performance bug - Take II

[alshakero]

In another instance of tree-shaking breaking down, Stepper was pulling a ton of JS and CSS that it never runs since #67887.

Fixes #97337

Proposed Changes

This moves the setupErrorLogger function from a big file full of imports into its own file to help tree shaking.

Why are these changes being made?

To make Stepper faster.

Testing Instructions

1. Go to /setup/onboarding.
2. Make sure dashicons.css is not loaded.
3. Go to /me/purchases. Make sure the table headings (Site, Product, Status, Payment method) are well aligned.
4. /start/domains/use-your-domain.
5. Make sure the form is centered.

[github-actions]

Calypso Live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-127603

Jetpack Cloud live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-127603&env=jetpack

Automattic for Agencies live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-127603&env=a8c-for-agencies

[matticbot]

Here is how your PR affects size of JS and CSS bundles shipped to the user's browser:

App Entrypoints (~95808 bytes added 📈 [gzipped])

name                   parsed_size            gzip_size
entry-stepper            -867124 B  (-37.9%)  -195377 B  (-32.2%)
entry-main                +11114 B   (+0.5%)    +7995 B   (+1.4%)
entry-login                +9598 B   (+0.5%)    +8774 B   (+1.5%)
entry-domains-landing      +7296 B   (+1.1%)    +2292 B   (+1.1%)
entry-browsehappy          +7170 B   (+3.4%)    +1950 B   (+3.1%)
entry-subscriptions        +6450 B   (+0.4%)    +2794 B   (+0.5%)

Common code that is always downloaded and parsed every time the app is loaded, no matter which route is used.

Sections (~416694 bytes added 📈 [gzipped])

name                                parsed_size             gzip_size
link-in-bio-tld-flow                  +340248 B   (+19.0%)  +106248 B   (+20.2%)
update-design-flow                    +309973 B   (+25.8%)   +89263 B   (+26.3%)
write-flow                            +287314 B   (+37.4%)   +90585 B   (+38.2%)
build-flow                            +287314 B   (+37.4%)   +90600 B   (+38.2%)
import-hosted-site-flow               +262012 B   (+31.4%)   +83056 B   (+33.3%)
copy-site-flow                        +257114 B   (+38.6%)   +82890 B   (+40.5%)
transferring-hosted-site-flow         +167311 B  (+163.3%)   +53891 B  (+157.5%)
entrepreneur-flow                     +165123 B  (+133.8%)   +46712 B  (+167.8%)
plugin-bundle-flow                    +164882 B   (+86.2%)   +52826 B   (+81.0%)
newsletter-post-setup-flow            +160920 B  (+137.4%)   +52338 B  (+131.3%)
link-in-bio-post-setup-flow           +160920 B  (+137.7%)   +52338 B  (+131.7%)
stepper-user-step                     +156494 B  (+160.3%)   +49453 B  (+159.3%)
domain-user-transfer-flow             +134014 B   (+57.8%)   +42614 B   (+91.0%)
assembler-first-flow                  +132233 B  (+122.4%)   +35742 B  (+172.7%)
readymade-template-flow               +131868 B   (+93.8%)   +34177 B  (+107.1%)
site-setup-wg                          +52982 B   (+48.5%)   +10484 B   (+48.2%)
site-setup-flow                        +52982 B   (+49.2%)   +10484 B   (+49.8%)
ai-assembler-flow                      +44043 B   (+51.5%)    +7509 B   (+50.0%)
site-migration-flow                    +41113 B   (+46.8%)    +6857 B   (+43.0%)
hosted-site-migration-flow             +41113 B   (+46.5%)    +6857 B   (+42.3%)
with-theme-assembler-flow              +34379 B   (+45.6%)    +4363 B   (+37.2%)
import-flow                            +32790 B   (+48.3%)    +3996 B   (+39.9%)
migration-flow                         +31514 B   (+39.2%)    +3788 B   (+26.3%)
migration-signup                       +29666 B   (+47.1%)    +3195 B   (+38.3%)
onboarding-flow                        +25401 B   (+33.9%)    +1248 B   (+10.6%)
tailored-ecommerce-flow                +24155 B   (+39.5%)     +975 B   (+13.4%)
update-options-flow                    +23045 B   (+40.2%)     +847 B   (+13.5%)
trial-wooexpress-flow                  +23045 B   (+38.0%)     +859 B   (+11.3%)
free-post-setup-flow                   +23045 B   (+40.5%)     +831 B   (+13.5%)
design-first-flow                      +14496 B   (+56.4%)    +3347 B   (+55.8%)
signup                                 +14492 B    (+5.2%)     +414 B    (+0.6%)
start-writing-flow                     +14280 B   (+57.0%)    +3338 B   (+56.5%)
hundred-year-plan                      +13094 B   (+35.5%)    +3545 B   (+32.4%)
newsletter-flow                        +12610 B   (+60.4%)    +3299 B   (+59.4%)
hundred-year-domain                    +12006 B   (+23.7%)    +3574 B   (+23.6%)
new-hosted-site-flow                    +1969 B   (+20.7%)     +112 B    (+4.0%)
connect-domain                          +1878 B    (+7.2%)     +253 B    (+3.6%)
reblogging-flow                         +1462 B   (+24.7%)      +80 B    (+4.3%)
new-hosted-site-flow-user-included      +1223 B   (+19.3%)      +69 B    (+3.3%)
people                                  +1015 B    (+0.2%)     +817 B    (+0.4%)
google-transfer                         +1007 B   (+23.9%)      +78 B    (+5.7%)
domain-transfer                         +1007 B   (+25.5%)      +77 B    (+5.9%)
a8c-for-agencies-client                  +866 B    (+0.1%)     +445 B    (+0.1%)
jetpack-cloud-plugin-management          +760 B    (+0.0%)     +348 B    (+0.1%)
site-performance                         +703 B    (+0.0%)     -773 B    (-0.2%)
staging-site                             +682 B    (+0.0%)     -435 B    (-0.1%)
site-marketing                           +661 B    (+0.0%)     +632 B    (+0.1%)
site-settings                            +539 B    (+0.0%)     +380 B    (+0.1%)
site-monitoring                          +536 B    (+0.0%)      -32 B    (-0.0%)
site-logs                                +535 B    (+0.0%)      +54 B    (+0.0%)
site-tools                               +516 B    (+0.0%)     +514 B    (+0.1%)
plugins                                  +406 B    (+0.0%)     -330 B    (-0.0%)
plans                                    -349 B    (-0.0%)    -1433 B    (-0.4%)
hosting-features                         +312 B    (+0.0%)     +441 B    (+0.1%)
migrate                                  -279 B    (-0.1%)     -386 B    (-0.4%)
import                                   +276 B    (+0.0%)    -1359 B    (-0.6%)
jetpack-search                           -263 B    (-0.0%)     -652 B    (-0.4%)
hosting                                  +255 B    (+0.0%)     -363 B    (-0.1%)
gutenberg-editor                         -238 B    (-0.0%)     -774 B    (-0.4%)
sites-dashboard                          +214 B    (+0.0%)     +411 B    (+0.1%)
a8c-for-agencies-settings                +206 B    (+0.1%)     -402 B    (-0.6%)
a8c-for-agencies-plugins                 +206 B    (+0.1%)     -402 B    (-0.8%)
a8c-for-agencies-agency-tier             +206 B    (+0.1%)     -409 B    (-0.6%)
activity                                 -204 B    (-0.0%)     -860 B    (-0.4%)
customize                                -199 B    (-0.1%)     -502 B    (-0.5%)
jetpack-app                              -198 B    (-0.0%)     -775 B    (-0.6%)
jetpack-cloud-agency-sites-v2            -197 B    (-0.0%)      +41 B    (+0.0%)
preview                                  -191 B    (-0.1%)      -38 B    (-0.0%)
site-overview                            +190 B    (+0.0%)     -273 B    (-0.1%)
jetpack-connect                          +186 B    (+0.0%)     +715 B    (+0.2%)
subscribers                              -183 B    (-0.0%)     -265 B    (-0.1%)
jetpack-cloud-settings                   -180 B    (-0.0%)    +1011 B    (+0.5%)
settings-performance                     +178 B    (+0.0%)     +277 B    (+0.2%)
scan                                     -177 B    (-0.0%)    -1254 B    (-0.5%)
github-deployments                       +173 B    (+0.0%)     +489 B    (+0.1%)
settings-security                        +169 B    (+0.0%)     +262 B    (+0.2%)
marketing                                -157 B    (-0.0%)     +427 B    (+0.2%)
settings-reading                         -153 B    (-0.0%)     +311 B    (+0.2%)
domains                                  +143 B    (+0.0%)     +138 B    (+0.0%)
settings-podcast                         +139 B    (+0.0%)     +350 B    (+0.2%)
settings                                 +134 B    (+0.0%)     +745 B    (+0.2%)
woocommerce                              +133 B    (+0.0%)      +27 B    (+0.0%)
marketplace                              +133 B    (+0.0%)      +69 B    (+0.0%)
reader                                   +126 B    (+0.0%)     +620 B    (+0.1%)
a8c-for-agencies-referrals               +126 B    (+0.0%)     +793 B    (+0.3%)
a8c-for-agencies-overview                +126 B    (+0.0%)     +707 B    (+0.3%)
a8c-for-agencies-migrations              +126 B    (+0.0%)     +793 B    (+0.3%)
settings-writing                         +119 B    (+0.0%)     +230 B    (+0.1%)
themes                                   -114 B    (-0.0%)     +473 B    (+0.2%)
stats                                    +111 B    (+0.0%)     -474 B    (-0.1%)
a8c-for-agencies-partner-directory       -109 B    (-0.0%)      -21 B    (-0.0%)
devdocs                                  +101 B    (+0.1%)      +19 B    (+0.0%)
promote-post-i2                          +100 B    (+0.0%)     +897 B    (+0.4%)
purchase-product                          -96 B    (-0.1%)      +21 B    (+0.0%)
settings-jetpack                          -95 B    (-0.0%)     -586 B    (-0.4%)
a8c-for-agencies-landing                  +93 B    (+0.1%)      -14 B    (-0.0%)
woocommerce-installation                  -87 B    (-0.0%)     -211 B    (-0.2%)
switch-site                               +86 B    (+0.0%)       +4 B    (+0.0%)
site-blocks                               -83 B    (-0.0%)       -7 B    (-0.0%)
performance-profiler                      -83 B    (-0.0%)      -22 B    (-0.0%)
notification-settings                     -83 B    (-0.0%)       -4 B    (-0.0%)
media                                     -83 B    (-0.0%)       -9 B    (-0.0%)
me                                        -83 B    (-0.0%)       -6 B    (-0.0%)
jetpack-cloud-features-comparison         -83 B    (-0.0%)      -64 B    (-0.0%)
help                                      -83 B    (-0.0%)       -6 B    (-0.0%)
google-my-business                        -83 B    (-0.0%)       -9 B    (-0.0%)
export                                    -83 B    (-0.0%)       -9 B    (-0.0%)
email                                     -83 B    (-0.0%)      +67 B    (+0.0%)
concierge                                 -83 B    (-0.0%)       -9 B    (-0.0%)
add-ons                                   -83 B    (-0.0%)       -9 B    (-0.0%)
account-close                             -83 B    (-0.0%)       -6 B    (-0.0%)
a8c-for-agencies                          -83 B    (-0.1%)      -22 B    (-0.1%)
theme                                     -82 B    (-0.0%)     -218 B    (-0.1%)
a8c-for-agencies-sites                    +75 B    (+0.0%)     +682 B    (+0.1%)
site-purchases                            +74 B    (+0.0%)    -1073 B    (-0.2%)
a8c-for-agencies-team                     -70 B    (-0.0%)     +363 B    (+0.1%)
settings-newsletter                       +54 B    (+0.0%)     -315 B    (-0.2%)
earn                                      -54 B    (-0.0%)     -519 B    (-0.2%)
pages                                     +45 B    (+0.0%)     +169 B    (+0.1%)
checkout                                  +43 B    (+0.0%)     -557 B    (-0.1%)
jetpack-cloud-partner-portal              -40 B    (-0.0%)      -90 B    (-0.0%)
backup                                    -37 B    (-0.0%)     -451 B    (-0.1%)
posts                                     +31 B    (+0.0%)     -287 B    (-0.1%)
patterns                                  -31 B    (-0.0%)     -101 B    (-0.0%)
settings-discussion                       +29 B    (+0.0%)     +337 B    (+0.3%)
posts-custom                              -29 B    (-0.0%)     -317 B    (-0.2%)
security                                  -23 B    (-0.0%)       -2 B    (-0.0%)
purchases                                 +23 B    (+0.0%)     -615 B    (-0.1%)
comments                                  +20 B    (+0.0%)      +14 B    (+0.0%)
home                                      +16 B    (+0.0%)     +379 B    (+0.1%)

Sections contain code specific for a given set of routes. Is downloaded and parsed only when a particular route is navigated to.

Async-loaded Components (~214485 bytes added 📈 [gzipped])

name                                                                              parsed_size             gzip_size
async-load-automattic-help-center-v-2                                               +821926 B      (new)  +250459 B      (new)
async-load-calypso-my-sites-checkout-modal                                          +284664 B   (+23.6%)   +93734 B   (+27.6%)
async-load-signup-steps-theme-selection                                             +115605 B   (+60.2%)   +37581 B   (+65.0%)
async-load-signup-steps-clone-point                                                  +96682 B   (+55.7%)   +30576 B   (+69.1%)
async-load-signup-steps-site-picker                                                  +94378 B   (+63.7%)   +30993 B   (+67.2%)
async-load-signup-steps-difm-site-picker                                             +94378 B   (+63.8%)   +31026 B   (+67.1%)
async-load-signup-steps-domains                                                      +93989 B   (+17.0%)   +30654 B   (+18.6%)
async-load-signup-steps-website-content                                              +84387 B   (+73.9%)   +26787 B   (+69.9%)
async-load-signup-steps-courses                                                      +80275 B  (+238.2%)   +25449 B  (+225.4%)
async-load-signup-steps-website-content-section-types                                +60918 B   (+85.2%)   +19439 B   (+84.4%)
async-load-calypso-blocks-jitm                                                       +59473 B  (+421.0%)   +18940 B  (+422.3%)
async-load-signup-steps-user                                                         +57072 B   (+34.1%)   +20440 B   (+42.6%)
async-load-signup-steps-page-picker                                                  +48050 B   (+13.0%)   +15905 B   (+13.7%)
async-load-signup-steps-p2-complete-profile                                          +40806 B   (+38.0%)   +13930 B   (+41.6%)
async-load-signup-steps-design-picker                                                +26041 B   (+49.1%)    +8199 B   (+46.8%)
async-load-signup-steps-woocommerce-install-step-business-info                       +25443 B   (+28.7%)    +8040 B   (+28.2%)
async-load-purchase-modal-wrapper                                                    +25422 B    (+6.9%)    +9229 B    (+8.1%)
async-load-signup-steps-woocommerce-install-step-store-address                       +25353 B   (+38.1%)    +7950 B   (+36.0%)
async-load-my-sites-checkout-purchase-modal-is-eligible-for-one-click-checkou...     +25226 B    (+7.1%)    +8588 B    (+7.8%)
async-load-signup-steps-creds-permission                                             +23275 B   (+44.9%)    +6760 B   (+38.5%)
async-load-signup-steps-woocommerce-install-transfer                                 +23210 B   (+72.3%)    +7349 B   (+70.1%)
async-load-signup-steps-woocommerce-install-confirm                                  +23028 B   (+41.7%)    +7365 B   (+41.1%)
async-load-signup-steps-store-features                                               +22896 B   (+51.9%)    +7154 B   (+52.0%)
async-load-signup-steps-p2-join-workspace                                            +22823 B   (+73.2%)    +7255 B   (+71.2%)
async-load-signup-steps-hosting-decider                                              +22814 B  (+101.3%)    +7275 B   (+94.0%)
async-load-signup-steps-p2-details                                                   +22695 B   (+90.2%)    +7271 B   (+85.6%)
async-load-signup-steps-site                                                         +22629 B   (+52.2%)    +7231 B   (+54.5%)
async-load-signup-steps-p2-site                                                      +22629 B   (+43.0%)    +7223 B   (+45.6%)
async-load-signup-steps-rewind-form-creds                                            +21593 B   (+30.7%)    +6293 B   (+27.5%)
async-load-signup-steps-creds-confirm                                                +21593 B   (+41.6%)    +6276 B   (+35.8%)
async-load-signup-steps-clone-credentials                                            +21593 B   (+29.2%)    +6288 B   (+26.5%)
async-load-signup-steps-new-or-existing-site                                         +21409 B   (+46.4%)    +6657 B   (+43.9%)
async-load-signup-steps-emails                                                       +21279 B   (+34.1%)    +6613 B   (+32.6%)
async-load-signup-steps-intent                                                       +21026 B   (+53.0%)    +6574 B   (+52.4%)
async-load-signup-steps-initial-intent                                               +20942 B   (+26.3%)    +6705 B   (+25.7%)
async-load-signup-steps-test-step                                                    +20880 B   (+97.5%)    +6520 B   (+90.8%)
async-load-signup-steps-starting-point                                               +20880 B   (+56.8%)    +6520 B   (+56.2%)
async-load-signup-steps-social-profiles                                              +20880 B   (+75.1%)    +6520 B   (+71.8%)
async-load-signup-steps-site-or-domain                                               +20880 B   (+50.8%)    +6520 B   (+51.7%)
async-load-signup-steps-site-options                                                 +20880 B   (+49.0%)    +6520 B   (+49.2%)
async-load-signup-steps-rewind-were-backing                                          +20880 B   (+90.9%)    +6520 B   (+84.4%)
async-load-signup-steps-reader-landing                                               +20880 B   (+81.1%)    +6520 B   (+78.5%)
async-load-signup-steps-p2-confirm-email                                             +20880 B   (+77.2%)    +6520 B   (+71.9%)
async-load-signup-steps-clone-start                                                  +20880 B   (+73.6%)    +6520 B   (+69.7%)
async-load-signup-steps-clone-destination                                            +20880 B   (+62.7%)    +6520 B   (+62.7%)
async-load-signup-steps-clone-cloning                                                +20880 B   (+74.8%)    +6520 B   (+71.0%)
async-load-calypso-signup-step-wrapper                                               +20880 B  (+133.7%)    +6520 B  (+124.4%)
async-load-signup-steps-clone-ready                                                  +20700 B   (+37.7%)    +6238 B   (+36.0%)
async-load-signup-steps-woocommerce-install                                          +20341 B  (+679.8%)    +6335 B  (+596.0%)
async-load-calypso-blocks-jitm-templates-modal                                       +20341 B   (+77.9%)    +6335 B   (+69.5%)
async-load-automattic-onboarding-src-step-container                                  +20341 B  (+209.8%)    +6335 B  (+195.2%)
async-load-signup-steps-plans-theme-preselected                                      +18562 B    (+4.8%)    +5337 B    (+4.2%)
async-load-signup-steps-plans                                                        +18562 B    (+4.8%)    +5337 B    (+4.2%)
async-load-calypso-blocks-cookie-banner                                              +15836 B      (new)    +5327 B      (new)
async-load-automattic-help-center                                                    +11952 B    (+1.8%)     +265 B    (+0.1%)
async-load-calypso-blocks-jitm-templates-sidebar-banner                               +5209 B   (+11.2%)    +1939 B   (+11.8%)
async-load-calypso-blocks-jitm-templates-notice                                       +5209 B   (+11.1%)    +1939 B   (+11.7%)
async-load-calypso-blocks-jitm-templates-default                                      +5209 B   (+11.2%)    +1940 B   (+11.7%)
async-load-calypso-components-global-notices                                          +2911 B   (+60.3%)    +1072 B   (+63.4%)
async-load-signup-steps-woocommerce-install-hooks-use-site-settings                   +2690 B   (+65.1%)     +814 B   (+50.7%)
async-load-automattic-search                                                          +2685 B    (+8.9%)     +928 B    (+8.9%)
async-load-site-build-showcase                                                        +2231 B   (+92.3%)     +906 B   (+82.7%)
async-load-automattic-design-preview                                                  +2097 B    (+0.1%)     +268 B    (+0.1%)
async-load-signup-steps-woocommerce-install-components-support-card                   +1943 B  (+145.7%)     +787 B  (+108.1%)
async-load-calypso-state-lib-automated-transfer-middleware                             +996 B    (+4.9%)     +942 B   (+15.4%)
async-load-design                                                                      -607 B    (-0.0%)     +133 B    (+0.0%)
async-load-calypso-components-web-preview-component                                    +497 B    (+0.1%)     -464 B    (-0.3%)
async-load-calypso-blocks-support-article-dialog-dialog                                -279 B    (-0.3%)     -562 B    (-1.9%)
async-load-publish                                                                     +246 B    (+2.6%)      +41 B    (+1.2%)
async-load-design-blocks                                                               +225 B    (+0.0%)     +695 B    (+0.1%)
async-load-calypso-my-sites-current-site-notice                                        +222 B    (+0.4%)      +13 B    (+0.1%)
async-load-calypso-layout-popup-search                                                 -196 B    (-1.2%)     -392 B    (-7.6%)
async-load-design-wordpress-components-gallery                                         +181 B    (+0.0%)     -119 B    (-0.1%)
async-load-comment-block-editor                                                        +168 B    (+0.0%)      -73 B    (-0.0%)
async-load-automattic-global-styles-src-components-global-styles-variations            +168 B    (+0.0%)      -70 B    (-0.0%)
async-load-calypso-reader-sidebar                                                      +162 B    (+0.2%)       +7 B    (+0.0%)
async-load-calypso-my-sites-stats-summary                                              +162 B    (+0.3%)       +8 B    (+0.1%)
async-load-calypso-blocks-product-purchase-features-list                               -116 B    (-0.2%)     -363 B    (-2.9%)
async-load-calypso-layout-masterbar-drafts-popover                                     +113 B    (+0.4%)     +619 B    (+6.4%)
async-load-calypso-my-sites-stats-stats-post-detail                                    -108 B    (-0.3%)      -33 B    (-0.3%)
async-load-calypso-my-sites-site-settings-seo-settings-form                            -108 B    (-0.0%)      -34 B    (-0.0%)
async-load-calypso-blocks-support-article-dialog                                       -108 B    (-5.6%)      -55 B    (-6.3%)
async-load-calypso-layout-command-palette                                               +86 B    (+0.0%)       +4 B    (+0.0%)
async-load-calypso-components-sites-popover                                             -83 B    (-0.1%)       -9 B    (-0.0%)
async-load-calypso-components-jetpack-portal-nav                                        -83 B    (-0.2%)      -12 B    (-0.1%)
async-load-calypso-lib-store-sandbox-helper                                             +73 B    (+0.2%)       +6 B    (+0.1%)
async-load-calypso-jetpack-cloud-sections-sidebar-navigation-manage-selected-...        +73 B    (+0.1%)       +0 B
async-load-calypso-blocks-editor-checkout-modal                                         +73 B    (+0.0%)     -108 B    (-0.0%)
async-load-design-playground                                                            +16 B    (+0.0%)     +239 B    (+0.1%)
async-load-store-app-store-stats-listview                                               +13 B    (+0.0%)      -16 B    (-0.0%)

React components that are loaded lazily, when a certain part of UI is displayed for the first time.

Legend

What is parsed and gzip size?

Parsed Size: Uncompressed size of the JS and CSS files. This much code needs to be parsed and stored in memory.
Gzip Size: Compressed size of the JS and CSS files. This much data needs to be downloaded over network.

Generated by performance advisor bot at iscalypsofastyet.com.

[matticbot]

This PR modifies the release build for the following Calypso Apps:

For info about this notification, see here: PCYsg-OT6-p2

• notifications

To test WordPress.com changes, run install-plugin.sh $pluginSlug revert-97429-revert-97354-fix/stepper-perf-bug on your sandbox.