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

refactor: allow tree-shaking of dev-only code #2259

Merged
merged 1 commit into from
Nov 18, 2024

Conversation

arturovt
Copy link
Member

In this commit, we're removing all const NG_DEV_MODE declarations and inlining typeof ngDevMode !== 'undefined' && ngDevMode conditions.

This change is required for ESBuild tree-shaking to work properly. It has been observed that development-only code is not being dropped in production builds.

For example, this code:

const NG_DEV_MODE = typeof ngDevMode !== 'undefined' && ngDevMode;
if (NG_DEV_MODE) {
  ensureStateNameIsValid(stateName);
}

Becomes the following after the build:

var NG_DEV_MODE$4 = !1;
NG_DEV_MODE$4 && ensureStateNameIsValid(stateName);

Terser was able to inline NG_DEV_MODE variables, because it was able to evaluate their expressions during the build (that it's falsy) and remove them entirely.

In this commit, we're removing all const `NG_DEV_MODE` declarations and inlining
`typeof ngDevMode !== 'undefined' && ngDevMode` conditions.

This change is **required** for ESBuild tree-shaking to work properly.
It has been observed that development-only code is not being dropped in production builds.

For example, this code:

```js
const NG_DEV_MODE = typeof ngDevMode !== 'undefined' && ngDevMode;
if (NG_DEV_MODE) {
  ensureStateNameIsValid(stateName);
}
```

Becomes the following after the build:

```js
var NG_DEV_MODE$4 = !1;
NG_DEV_MODE$4 && ensureStateNameIsValid(stateName);
```

Terser was able to inline `NG_DEV_MODE` variables, because it was able to evaluate their
expressions during the build (that it's _falsy_) and remove them entirely.
Copy link

nx-cloud bot commented Nov 18, 2024

☁️ Nx Cloud Report

CI is running/has finished running commands for commit 0dd8a74. As they complete they will appear below. Click to see the status, the terminal output, and the build insights.

📂 See all runs for this CI Pipeline Execution


✅ Successfully ran 4 targets

Sent with 💌 from NxCloud.

Copy link

bundlemon bot commented Nov 18, 2024

BundleMon

Files updated (3)
Status Path Size Limits
fesm2022/ngxs-store-plugins.mjs
2KB (-33B -1.58%) 3KB / +0.5%
fesm2022/ngxs-store-internals.mjs
11.29KB (-36B -0.31%) 13KB / +0.5%
fesm2022/ngxs-store.mjs
100.77KB (-76B -0.07%) 103KB / +0.5%
Unchanged files (3)
Status Path Size Limits
fesm2022/ngxs-store-internals-testing.mjs
6.83KB 7KB / +0.5%
fesm2022/ngxs-store-operators.mjs
6.22KB 7KB / +0.5%
fesm2022/ngxs-store-experimental.mjs
1.4KB 2KB / +0.5%

Total files change -145B -0.11%

Groups updated (2)
Status Path Size Limits
@ngxs/store(fesm2022)[gzip]
./fesm2022/*.mjs
30.72KB (-162B -0.51%) +1%
@ngxs/store(esm2022)[gzip]
./esm2022/**/*.mjs
223.42KB (-652B -0.28%) +1%

Final result: ✅

View report in BundleMon website ➡️


Current branch size history | Target branch size history

Copy link

bundlemon bot commented Nov 18, 2024

BundleMon (NGXS Plugins)

Files updated (4)
Status Path Size Limits
Plugins(fesm2022)[gzip]
storage-plugin/fesm2022/ngxs-storage-plugin-i
nternals.mjs
861B (-14B -1.6%) +0.5%
Plugins(fesm2022)[gzip]
router-plugin/fesm2022/ngxs-router-plugin-int
ernals.mjs
396B (-15B -3.65%) +0.5%
Plugins(fesm2022)[gzip]
websocket-plugin/fesm2022/ngxs-websocket-plug
in.mjs
2.57KB (-15B -0.57%) +0.5%
Plugins(fesm2022)[gzip]
storage-plugin/fesm2022/ngxs-storage-plugin.m
js
4.06KB (-33B -0.79%) +0.5%
Unchanged files (5)
Status Path Size Limits
Plugins(fesm2022)[gzip]
router-plugin/fesm2022/ngxs-router-plugin.mjs
3.01KB +0.5%
Plugins(fesm2022)[gzip]
hmr-plugin/fesm2022/ngxs-hmr-plugin.mjs
2.61KB +0.5%
Plugins(fesm2022)[gzip]
form-plugin/fesm2022/ngxs-form-plugin.mjs
2.52KB +0.5%
Plugins(fesm2022)[gzip]
devtools-plugin/fesm2022/ngxs-devtools-plugin
.mjs
2.17KB +0.5%
Plugins(fesm2022)[gzip]
logger-plugin/fesm2022/ngxs-logger-plugin.mjs
2.03KB +0.5%

Total files change -77B -0.37%

Groups updated (1)
Status Path Size Limits
All Plugins(fesm2022)[gzip]
./-plugin/fesm2022/.mjs
20.2KB (-77B -0.37%) +0.5%

Final result: ✅

View report in BundleMon website ➡️


Current branch size history | Target branch size history

Copy link

codeclimate bot commented Nov 18, 2024

Code Climate has analyzed commit 0dd8a74 and detected 3 issues on this pull request.

Here's the issue category breakdown:

Category Count
Complexity 1
Duplication 2

The test coverage on the diff in this pull request is 92.8% (50% is the threshold).

This pull request will bring the total coverage in the repository to 95.3% (0.0% change).

View more on Code Climate.

Copy link

bundlemon bot commented Nov 18, 2024

BundleMon (Integration Projects)

Files updated (3)
Status Path Size Limits
Main bundles(Gzip)
hello-world-ng17/dist-integration/main.(hash)
.js
68.27KB (-103B -0.15%) +1%
Main bundles(Gzip)
hello-world-ng16/dist-integration/main.(hash)
.js
67.31KB (-106B -0.15%) +1%
Main bundles(Gzip)
hello-world-ng18/dist-integration/browser/mai
n-(hash).js
70.11KB (-1.4KB -1.96%) +1%

Total files change -1.6KB -0.77%

Final result: ✅

View report in BundleMon website ➡️


Current branch size history | Target branch size history

@arturovt arturovt marked this pull request as ready for review November 18, 2024 14:34
@arturovt arturovt merged commit e14b71b into master Nov 18, 2024
17 of 18 checks passed
@arturovt arturovt deleted the refactor/tree-shake-fixes branch November 18, 2024 14:34
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant