Skip to content

Commit 38e2926

Browse files
wmertenswmertens
committed
fix(preloader): minify wasn't working
- enum wasn't getting removed - vite doesn't minify ES libraries
1 parent 46e83fb commit 38e2926

File tree

4 files changed

+69
-35
lines changed

4 files changed

+69
-35
lines changed

‎packages/qwik/src/core/preloader/bundle-graph.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import {
77
} from './constants';
88
import { adjustProbabilities, bundles, log, trigger } from './queue';
99
import type { BundleGraph, BundleImport, ImportProbability } from './types';
10-
import { BundleImportState } from './types';
10+
import { BundleImportState_None, BundleImportState_Alias } from './types';
1111

1212
export let base: string | undefined;
1313
export let graph: BundleGraph;
@@ -21,7 +21,7 @@ const makeBundle = (name: string, deps?: ImportProbability[]) => {
2121
return {
2222
$name$: name,
2323
$url$: url,
24-
$state$: url ? BundleImportState.None : BundleImportState.Alias,
24+
$state$: url ? BundleImportState_None : BundleImportState_Alias,
2525
$deps$: deps,
2626
$inverseProbability$: 1,
2727
$createdTs$: Date.now(),

‎packages/qwik/src/core/preloader/queue.ts

Lines changed: 18 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,12 @@ import {
99
rel,
1010
} from './constants';
1111
import type { BundleImport, BundleImports } from './types';
12-
import { BundleImportState } from './types';
12+
import {
13+
BundleImportState_None,
14+
BundleImportState_Queued,
15+
BundleImportState_Preload,
16+
BundleImportState_Loaded,
17+
} from './types';
1318

1419
export const bundles: BundleImports = new Map();
1520
let queueDirty: boolean;
@@ -93,7 +98,7 @@ export const trigger = () => {
9398
* for other resources, so we cycle between 4 and 10 outstanding modulepreloads.
9499
*/
95100
if (config.DEBUG && !queue.length) {
96-
const loaded = [...bundles.values()].filter((b) => b.$state$ > BundleImportState.None);
101+
const loaded = [...bundles.values()].filter((b) => b.$state$ > BundleImportState_None);
97102
const waitTime = loaded.reduce((acc, b) => acc + b.$waitedMs$, 0);
98103
const loadTime = loaded.reduce((acc, b) => acc + b.$loadedMs$, 0);
99104
log(
@@ -103,16 +108,20 @@ export const trigger = () => {
103108
};
104109

105110
const preloadOne = (bundle: BundleImport) => {
106-
if (bundle.$state$ >= BundleImportState.Preload) {
111+
if (bundle.$state$ >= BundleImportState_Preload) {
107112
return;
108113
}
109114
preloadCount++;
110115

111116
const start = Date.now();
112117
bundle.$waitedMs$ = start - bundle.$createdTs$;
113-
bundle.$state$ = BundleImportState.Preload;
118+
bundle.$state$ = BundleImportState_Preload;
114119

115-
config.DEBUG && log(`<< load after ${`${bundle.$waitedMs$}ms`}`, bundle.$name$);
120+
config.DEBUG &&
121+
log(
122+
`<< load ${Math.round((1 - bundle.$inverseProbability$) * 100)}% after ${`${bundle.$waitedMs$}ms`}`,
123+
bundle.$name$
124+
);
116125

117126
const link = doc.createElement('link');
118127
link.href = bundle.$url$!;
@@ -124,7 +133,7 @@ const preloadOne = (bundle: BundleImport) => {
124133
preloadCount--;
125134
const end = Date.now();
126135
bundle.$loadedMs$ = end - start;
127-
bundle.$state$ = BundleImportState.Loaded;
136+
bundle.$state$ = BundleImportState_Loaded;
128137
config.DEBUG && log(`>> done after ${bundle.$loadedMs$}ms`, bundle.$name$);
129138
// Keep the <head> clean
130139
link.remove();
@@ -151,11 +160,11 @@ export const adjustProbabilities = (
151160
}
152161

153162
if (
154-
bundle.$state$ < BundleImportState.Preload &&
163+
bundle.$state$ < BundleImportState_Preload &&
155164
bundle.$inverseProbability$ < config[maxSignificantInverseProbabilityStr]
156165
) {
157-
if (bundle.$state$ === BundleImportState.None) {
158-
bundle.$state$ = BundleImportState.Queued;
166+
if (bundle.$state$ === BundleImportState_None) {
167+
bundle.$state$ = BundleImportState_Queued;
159168
queue.push(bundle);
160169
config.DEBUG &&
161170
log(`queued ${Math.round((1 - bundle.$inverseProbability$) * 100)}%`, bundle.$name$);

‎packages/qwik/src/core/preloader/types.ts

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,8 @@
1-
export const enum BundleImportState {
2-
None,
3-
Queued,
4-
Preload,
5-
Alias,
6-
Loaded,
7-
}
1+
export const BundleImportState_None = 0;
2+
export const BundleImportState_Queued = 1;
3+
export const BundleImportState_Preload = 2;
4+
export const BundleImportState_Alias = 3;
5+
export const BundleImportState_Loaded = 4;
86

97
export type BundleInfo = {
108
$inverseProbability$: number;
@@ -15,7 +13,7 @@ export type BundleInfo = {
1513
export type BundleImport = BundleInfo & {
1614
$name$: string;
1715
$url$: string | null;
18-
$state$: BundleImportState;
16+
$state$: number;
1917
$createdTs$: number;
2018
$waitedMs$: number;
2119
$loadedMs$: number;

‎scripts/submodule-preloader.ts

Lines changed: 43 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,47 @@
11
import { join } from 'node:path';
22
import { build } from 'vite';
33
import { fileSize, type BuildConfig } from './util';
4+
import { minify } from 'terser';
5+
import type { Plugin } from 'vite';
6+
7+
/**
8+
* Custom plugin to apply terser during the bundle generation. Vite doesn't minify library ES
9+
* modules.
10+
*/
11+
function customTerserPlugin(): Plugin {
12+
return {
13+
name: 'custom-terser',
14+
async renderChunk(code, chunk) {
15+
// Only process JavaScript chunks
16+
if (!chunk.fileName.endsWith('.mjs') && !chunk.fileName.endsWith('.js')) {
17+
return null;
18+
}
19+
20+
// Keep the result readable for debugging
21+
const result = await minify(code, {
22+
compress: {
23+
defaults: false,
24+
module: true,
25+
hoist_props: true,
26+
unused: true,
27+
booleans_as_integers: true,
28+
},
29+
mangle: {
30+
toplevel: false,
31+
properties: {
32+
// use short attribute names for internal properties
33+
regex: '^\\$.+\\$$|^[A-Z][a-zA-Z]+$',
34+
},
35+
},
36+
format: {
37+
comments: true,
38+
},
39+
});
40+
41+
return result.code || null;
42+
},
43+
};
44+
}
445

546
/**
647
* Builds the qwikloader javascript files using Vite. These files can be used by other tooling, and
@@ -18,24 +59,10 @@ export async function submodulePreloader(config: BuildConfig) {
1859
rollupOptions: {
1960
external: ['@builder.io/qwik/build'],
2061
},
21-
minify: 'terser',
22-
terserOptions: {
23-
compress: {
24-
dead_code: true,
25-
unused: true,
26-
conditionals: true,
27-
},
28-
mangle: {
29-
toplevel: false,
30-
module: false,
31-
keep_fnames: true,
32-
properties: {
33-
regex: '^\\$.+\\$$',
34-
},
35-
},
36-
},
62+
minify: false, // This is the default, just to be explicit
3763
outDir: config.distQwikPkgDir,
3864
},
65+
plugins: [customTerserPlugin()],
3966
});
4067

4168
const preloaderSize = await fileSize(join(config.distQwikPkgDir, 'preloader.mjs'));

0 commit comments

Comments
 (0)