Skip to content

Commit 96eec74

Browse files
manucorporatmanucorporat
committed
perf(compiler): better treeshake vdom features
1 parent 3ac02f3 commit 96eec74

File tree

13 files changed

+1511
-59
lines changed

13 files changed

+1511
-59
lines changed

‎src/declarations/vdom.ts‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -39,14 +39,14 @@ export interface FunctionalComponent<T = {}> {
3939
}
4040

4141
export interface VNode {
42+
$flags$: number;
4243
$tag$: string | number | Function;
43-
$key$: string | number;
44+
$elm$: any;
4445
$text$: string;
4546
$children$: VNode[];
46-
$attrs$: any;
47-
$name$: string;
48-
$flags$: number;
49-
$elm$: any;
47+
$attrs$?: any;
48+
$name$?: string;
49+
$key$?: string | number;
5050
}
5151

5252
export interface ChildNode {

‎src/runtime/bootstrap-lazy.ts‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -54,6 +54,12 @@ export const bootstrapLazy = (lazyBundles: d.LazyBundlesRuntimeData, options: d.
5454
$members$: compactMeta[2],
5555
$listeners$: compactMeta[3],
5656
};
57+
if (BUILD.member) {
58+
cmpMeta.$members$ = compactMeta[2];
59+
}
60+
if (BUILD.hostListener) {
61+
cmpMeta.$listeners$ = compactMeta[3];
62+
}
5763
if (BUILD.reflect) {
5864
cmpMeta.$attrsToReflect$ = [];
5965
}
@@ -75,9 +81,6 @@ export const bootstrapLazy = (lazyBundles: d.LazyBundlesRuntimeData, options: d.
7581
super(self);
7682
self = this;
7783

78-
this['s-p'] = [];
79-
this['s-rc'] = [];
80-
8184
registerHost(self);
8285
if (BUILD.shadowDom && cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation) {
8386
// this component is using shadow dom

‎src/runtime/define-native.ts‎

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -21,10 +21,16 @@ export const proxyCustomElement = (Cstr: any, compactMeta: d.ComponentRuntimeMet
2121
const cmpMeta: d.ComponentRuntimeMeta = {
2222
$flags$: compactMeta[0],
2323
$tagName$: compactMeta[1],
24-
$members$: compactMeta[2],
25-
$listeners$: compactMeta[3],
26-
$watchers$: Cstr.$watchers$
2724
};
25+
if (BUILD.member) {
26+
cmpMeta.$members$ = compactMeta[2];
27+
}
28+
if (BUILD.hostListener) {
29+
cmpMeta.$listeners$ = compactMeta[3];
30+
}
31+
if (BUILD.watchCallback) {
32+
cmpMeta.$watchers$ = Cstr.$watchers$;
33+
}
2834
if (BUILD.reflect) {
2935
cmpMeta.$attrsToReflect$ = [];
3036
}

‎src/runtime/vdom/h.ts‎

Lines changed: 19 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -89,16 +89,25 @@ export const h = (nodeName: any, vnodeData: any, ...children: d.ChildType[]): d.
8989
return vnode;
9090
};
9191

92-
export const newVNode = (tag: string, text: string): d.VNode => ({
93-
$flags$: 0,
94-
$tag$: tag,
95-
$text$: text,
96-
$elm$: null,
97-
$children$: null,
98-
$attrs$: null,
99-
$key$: null,
100-
$name$: null,
101-
});
92+
export const newVNode = (tag: string, text: string) => {
93+
const vnode: d.VNode = {
94+
$flags$: 0,
95+
$tag$: tag,
96+
$text$: text,
97+
$elm$: null,
98+
$children$: null
99+
};
100+
if (BUILD.vdomAttribute) {
101+
vnode.$attrs$ = null;
102+
}
103+
if (BUILD.vdomKey) {
104+
vnode.$key$ = null;
105+
}
106+
if (BUILD.slotRelocation) {
107+
vnode.$name$ = null;
108+
}
109+
return vnode;
110+
};
102111

103112
export const Host = {};
104113

‎test/.scripts/analysis.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ fileSizeProfile('Hello VDOM App',
2727

2828
fileSizeProfile('Todo App',
2929
[
30-
path.join(rootDir, 'todo-app', 'www', 'build', '*'),
30+
path.join(rootDir, 'todo-app', 'public', 'index.js'),
3131
],
3232
output
3333
);

‎test/hello-world/src/components.d.ts‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ declare global {
2626
}
2727

2828
declare namespace LocalJSX {
29-
interface HelloWorld extends JSXBase.HTMLAttributes<HTMLHelloWorldElement> {}
29+
interface HelloWorld {}
3030

3131
interface IntrinsicElements {
3232
'hello-world': HelloWorld;
@@ -38,7 +38,9 @@ export { LocalJSX as JSX };
3838

3939
declare module "@stencil/core" {
4040
export namespace JSX {
41-
interface IntrinsicElements extends LocalJSX.IntrinsicElements {}
41+
interface IntrinsicElements {
42+
'hello-world': LocalJSX.HelloWorld & JSXBase.HTMLAttributes<HTMLHelloWorldElement>;
43+
}
4244
}
4345
}
4446

‎test/readme.md‎

Lines changed: 18 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -7,48 +7,38 @@
77

88
| File | Brotli | Gzipped | Minified |
99
|----------------------------|----------|----------|----------|
10-
| index.js | 90B | 134B | 143B |
11-
| TOTAL | 90B | 134B | 143B |
10+
| index.js | 85B | 134B | 140B |
11+
| TOTAL | 85B | 134B | 140B |
1212

1313

1414

1515
## Hello VDOM App
1616

1717
| File | Brotli | Gzipped | Minified |
1818
|----------------------------|----------|----------|----------|
19-
| app.esm.js | 94B | 117B | 112B |
20-
| app.js | 48.56KB | 55.89KB | 181.51KB |
21-
| hello-vdom.entry.js | 109B | 143B | 138B |
22-
| hello-vdom.system.entry.js | 174B | 210B | 276B |
23-
| p-23cb3ca0.system.js | 160B | 182B | 233B |
24-
| p-39f11146.system.js | 2.90KB | 3.23KB | 8.36KB |
25-
| p-5cd8f2de.system.js | 4.26KB | 4.69KB | 11.93KB |
26-
| p-7da2a379.js | 2.09KB | 2.35KB | 4.48KB |
27-
| p-a0c82e31.js | 4.60KB | 5.23KB | 17.21KB |
28-
| p-a8fc097f.system.js | 4.66KB | 5.27KB | 17.45KB |
29-
| p-f7ddb189.js | 2.75KB | 3.02KB | 7.47KB |
30-
| TOTAL | 70.35KB | 80.32KB | 249.16KB |
19+
| app.esm.js | 87B | 102B | 97B |
20+
| app.js | 36.72KB | 41.28KB | 132.10KB |
21+
| hello-vdom.entry.js | 116B | 146B | 145B |
22+
| hello-vdom.system.entry.js | 175B | 213B | 276B |
23+
| index.esm.js | ERROR | ERROR | ERROR |
24+
| p-04a3b409.js | 2.12KB | 2.37KB | 4.61KB |
25+
| p-0e8365cd.system.js | 3.35KB | 3.73KB | 9.20KB |
26+
| p-1635c1a0.js | 2.95KB | 3.24KB | 8.06KB |
27+
| p-2ddc72bd.system.js | 148B | 175B | 222B |
28+
| p-50ea2036.system.js | 59B | 86B | 76B |
29+
| p-5b416380.system.js | 4.91KB | 5.56KB | 18.63KB |
30+
| p-9b741424.system.js | 3.10KB | 3.43KB | 8.96KB |
31+
| p-d0882b30.js | 4.85KB | 5.51KB | 18.13KB |
32+
| TOTAL | 58.57KB | 65.83KB | 200.48KB |
3133

3234

3335

3436
## Todo App
3537

3638
| File | Brotli | Gzipped | Minified |
3739
|----------------------------|----------|----------|----------|
38-
| app.css | 1.46KB | 1.74KB | 5.76KB |
39-
| app.esm.js | 141B | 171B | 191B |
40-
| app.js | 48.60KB | 55.89KB | 181.51KB |
41-
| p-22d8cae6.system.js | 198B | 234B | 312B |
42-
| p-29787b35.system.js | 5.43KB | 5.99KB | 15.64KB |
43-
| p-39f11146.system.js | 2.90KB | 3.23KB | 8.36KB |
44-
| p-438e2ca6.js | 3.21KB | 3.56KB | 7.18KB |
45-
| p-a0c82e31.js | 4.60KB | 5.23KB | 17.21KB |
46-
| p-a8fc097f.system.js | 4.66KB | 5.27KB | 17.45KB |
47-
| p-aqb5bg7q.entry.js | 569B | 677B | 1.45KB |
48-
| p-ely6dzxe.css | 1.46KB | 1.74KB | 5.76KB |
49-
| p-f7ddb189.js | 2.75KB | 3.02KB | 7.47KB |
50-
| p-hebbvmyh.system.entry.js | 645B | 761B | 1.80KB |
51-
| TOTAL | 76.59KB | 87.48KB | 270.08KB |
40+
| index.js | 2.18KB | 2.44KB | 5.16KB |
41+
| TOTAL | 2.18KB | 2.44KB | 5.16KB |
5242

5343

5444

0 commit comments

Comments
 (0)