Skip to content

Commit 1c818f0

Browse files
X-Ryl669X-Ryl669
committed
Reduce the vanjs file size even more (by 32 bytes, minimized).
1 parent eeb061b commit 1c818f0

10 files changed

+86
-76
lines changed

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "vanjs-core",
3-
"version": "1.5.2",
3+
"version": "1.5.3",
44
"description": "VanJS. A minimalist React-like UI library based on vanilla JavaScript and DOM.",
55
"files": [
66
"src/van.js",

‎public/van-1.5.2.debug.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import van from "./van-1.5.2.js"
1+
import van from "./van.js"
22

33
// If this variable is set to an Array, we will push the error message into the array instead of
44
// throwing an error. This is useful in testing, to capture the error occurred asynchronous to the initiating

‎public/van-latest.debug.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import van from "./van-latest.js"
1+
import van from "./van.js"
22

33
// If this variable is set to an Array, we will push the error message into the array instead of
44
// throwing an error. This is useful in testing, to capture the error occurred asynchronous to the initiating

‎public/van-latest.js

Lines changed: 18 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
// This file consistently uses `let` keyword instead of `const` for reducing the bundle size.
22

33
// Global variables - aliasing some builtin symbols to reduce the bundle size.
4-
let protoOf = Object.getPrototypeOf
4+
let object = Object, protoOf = object.getPrototypeOf
55
let changedStates, derivedStates, curDeps, curNewDerives, alwaysConnectedDom = {isConnected: 1}
66
let gcCycleInMs = 1000, statesToGc, propSetterCache = {}
7-
let objProto = protoOf(alwaysConnectedDom), funcProto = protoOf(protoOf), _undefined
7+
let objProto = protoOf(alwaysConnectedDom), funcProto = protoOf(protoOf), _undefined, remove = 'remove', evl = 'eventListener', st = Set, dc=document
88

99
let addAndScheduleOnFirst = (set, s, f, waitMs) =>
10-
(set ?? (setTimeout(f, waitMs), new Set)).add(s)
10+
(set ?? (setTimeout(f, waitMs), new st)).add(s)
1111

1212
let runAndCaptureDeps = (f, deps, arg) => {
1313
let prevDeps = curDeps
@@ -62,10 +62,10 @@ let state = initVal => ({
6262
})
6363

6464
let bind = (f, dom) => {
65-
let deps = {_getters: new Set, _setters: new Set}, binding = {f}, prevNewDerives = curNewDerives
65+
let deps = {_getters: new st, _setters: new st}, binding = {f}, prevNewDerives = curNewDerives
6666
curNewDerives = []
6767
let newDom = runAndCaptureDeps(f, deps, dom)
68-
newDom = (newDom ?? document).nodeType ? newDom : new Text(newDom)
68+
newDom = (newDom ?? dc).nodeType ? newDom : new Text(newDom)
6969
for (let d of deps._getters)
7070
deps._setters.has(d) || (addStatesToGc(d), d._bindings.push(binding))
7171
for (let l of curNewDerives) l._dom = newDom
@@ -74,7 +74,7 @@ let bind = (f, dom) => {
7474
}
7575

7676
let derive = (f, s = state(), dom) => {
77-
let deps = {_getters: new Set, _setters: new Set}, listener = {f, s}
77+
let deps = {_getters: new st, _setters: new st}, listener = {f, s}
7878
listener._dom = dom ?? curNewDerives?.push(listener) ?? alwaysConnectedDom
7979
s.val = runAndCaptureDeps(f, deps, s.rawVal)
8080
for (let d of deps._getters)
@@ -83,7 +83,7 @@ let derive = (f, s = state(), dom) => {
8383
}
8484

8585
let add = (dom, ...children) => {
86-
for (let c of children.flat(Infinity)) {
86+
for (let c of children.flat(1/0)) {
8787
let protoOfC = protoOf(c ?? 0)
8888
let child = protoOfC === stateProto ? bind(() => c.val) :
8989
protoOfC === funcProto ? bind(c) : c
@@ -94,41 +94,41 @@ let add = (dom, ...children) => {
9494

9595
let tag = (ns, name, ...args) => {
9696
let [props, ...children] = protoOf(args[0] ?? 0) === objProto ? args : [{}, ...args]
97-
let dom = ns ? document.createElementNS(ns, name) : document.createElement(name)
98-
for (let [k, v] of Object.entries(props)) {
97+
let dom = dc['createElement'+ns&&'NS'](ns||name,name)
98+
for (let [k, v] of object.entries(props)) {
9999
let getPropDescriptor = proto => proto ?
100-
Object.getOwnPropertyDescriptor(proto, k) ?? getPropDescriptor(protoOf(proto)) :
100+
object.getOwnPropertyDescriptor(proto, k) ?? getPropDescriptor(protoOf(proto)) :
101101
_undefined
102102
let cacheKey = name + "," + k
103103
let propSetter = propSetterCache[cacheKey] ??= getPropDescriptor(protoOf(dom))?.set ?? 0
104-
let setter = k.startsWith("on") ?
104+
let on = k.startsWith("on"), setter = on ?
105105
(v, oldV) => {
106106
let event = k.slice(2)
107-
dom.removeEventListener(event, oldV)
108-
dom.addEventListener(event, v)
107+
dom[remove+evl](event, oldV)
108+
dom['add'+evl](event, v)
109109
} :
110110
propSetter ? propSetter.bind(dom) : dom.setAttribute.bind(dom, k)
111111
let protoOfV = protoOf(v ?? 0)
112-
k.startsWith("on") || protoOfV === funcProto && (v = derive(v), protoOfV = stateProto)
112+
on || protoOfV === funcProto && (v = derive(v), protoOfV = stateProto)
113113
protoOfV === stateProto ? bind(() => (setter(v.val, v._oldVal), dom)) : setter(v)
114114
}
115115
return add(dom, children)
116116
}
117117

118118
let handler = ns => ({get: (_, name) => tag.bind(_undefined, ns, name)})
119119

120-
let update = (dom, newDom) => newDom ? newDom !== dom && dom.replaceWith(newDom) : dom.remove()
120+
let update = (dom, newDom) => newDom === dom || dom[newDom?'replaceWith':remove](newDom)
121121

122122
let updateDoms = () => {
123123
let iter = 0, derivedStatesArray = [...changedStates].filter(s => s.rawVal !== s._oldVal)
124124
do {
125-
derivedStates = new Set
126-
for (let l of new Set(derivedStatesArray.flatMap(s => s._listeners = keepConnected(s._listeners))))
125+
derivedStates = new st
126+
for (let l of new st(derivedStatesArray.flatMap(s => s._listeners = keepConnected(s._listeners))))
127127
derive(l.f, l.s, l._dom), l._dom = _undefined
128128
} while (++iter < 100 && (derivedStatesArray = [...derivedStates]).length)
129129
let changedStatesArray = [...changedStates].filter(s => s.rawVal !== s._oldVal)
130130
changedStates = _undefined
131-
for (let b of new Set(changedStatesArray.flatMap(s => s._bindings = keepConnected(s._bindings))))
131+
for (let b of new st(changedStatesArray.flatMap(s => s._bindings = keepConnected(s._bindings))))
132132
update(b._dom, bind(b.f, b._dom)), b._dom = _undefined
133133
for (let s of changedStatesArray) s._oldVal = s.rawVal
134134
}

‎public/van-latest.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎public/van-latest.nomodule.debug.js

Lines changed: 22 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
(() => {
22
// van.js
3-
var protoOf = Object.getPrototypeOf;
3+
var object = Object;
4+
var protoOf = object.getPrototypeOf;
45
var changedStates;
56
var derivedStates;
67
var curDeps;
@@ -12,7 +13,11 @@
1213
var objProto = protoOf(alwaysConnectedDom);
1314
var funcProto = protoOf(protoOf);
1415
var _undefined;
15-
var addAndScheduleOnFirst = (set, s, f, waitMs) => (set ?? (setTimeout(f, waitMs), /* @__PURE__ */ new Set())).add(s);
16+
var remove = "remove";
17+
var evl = "eventListener";
18+
var st = Set;
19+
var dc = document;
20+
var addAndScheduleOnFirst = (set, s, f, waitMs) => (set ?? (setTimeout(f, waitMs), new st())).add(s);
1621
var runAndCaptureDeps = (f, deps, arg) => {
1722
let prevDeps = curDeps;
1823
curDeps = deps;
@@ -56,10 +61,10 @@
5661
_listeners: []
5762
});
5863
var bind = (f, dom) => {
59-
let deps = { _getters: /* @__PURE__ */ new Set(), _setters: /* @__PURE__ */ new Set() }, binding = { f }, prevNewDerives = curNewDerives;
64+
let deps = { _getters: new st(), _setters: new st() }, binding = { f }, prevNewDerives = curNewDerives;
6065
curNewDerives = [];
6166
let newDom = runAndCaptureDeps(f, deps, dom);
62-
newDom = (newDom ?? document).nodeType ? newDom : new Text(newDom);
67+
newDom = (newDom ?? dc).nodeType ? newDom : new Text(newDom);
6368
for (let d of deps._getters)
6469
deps._setters.has(d) || (addStatesToGc(d), d._bindings.push(binding));
6570
for (let l of curNewDerives)
@@ -68,15 +73,15 @@
6873
return binding._dom = newDom;
6974
};
7075
var derive = (f, s = state(), dom) => {
71-
let deps = { _getters: /* @__PURE__ */ new Set(), _setters: /* @__PURE__ */ new Set() }, listener = { f, s };
76+
let deps = { _getters: new st(), _setters: new st() }, listener = { f, s };
7277
listener._dom = dom ?? curNewDerives?.push(listener) ?? alwaysConnectedDom;
7378
s.val = runAndCaptureDeps(f, deps, s.rawVal);
7479
for (let d of deps._getters)
7580
deps._setters.has(d) || (addStatesToGc(d), d._listeners.push(listener));
7681
return s;
7782
};
7883
var add = (dom, ...children) => {
79-
for (let c of children.flat(Infinity)) {
84+
for (let c of children.flat(1 / 0)) {
8085
let protoOfC = protoOf(c ?? 0);
8186
let child = protoOfC === stateProto ? bind(() => c.val) : protoOfC === funcProto ? bind(c) : c;
8287
child != _undefined && dom.append(child);
@@ -85,34 +90,34 @@
8590
};
8691
var tag = (ns, name, ...args) => {
8792
let [props, ...children] = protoOf(args[0] ?? 0) === objProto ? args : [{}, ...args];
88-
let dom = ns ? document.createElementNS(ns, name) : document.createElement(name);
89-
for (let [k, v] of Object.entries(props)) {
90-
let getPropDescriptor = (proto) => proto ? Object.getOwnPropertyDescriptor(proto, k) ?? getPropDescriptor(protoOf(proto)) : _undefined;
93+
let dom = dc["createElement" + ns && "NS"](ns || name, name);
94+
for (let [k, v] of object.entries(props)) {
95+
let getPropDescriptor = (proto) => proto ? object.getOwnPropertyDescriptor(proto, k) ?? getPropDescriptor(protoOf(proto)) : _undefined;
9196
let cacheKey = name + "," + k;
9297
let propSetter = propSetterCache[cacheKey] ??= getPropDescriptor(protoOf(dom))?.set ?? 0;
93-
let setter = k.startsWith("on") ? (v2, oldV) => {
98+
let on = k.startsWith("on"), setter = on ? (v2, oldV) => {
9499
let event = k.slice(2);
95-
dom.removeEventListener(event, oldV);
96-
dom.addEventListener(event, v2);
100+
dom[remove + evl](event, oldV);
101+
dom["add" + evl](event, v2);
97102
} : propSetter ? propSetter.bind(dom) : dom.setAttribute.bind(dom, k);
98103
let protoOfV = protoOf(v ?? 0);
99-
k.startsWith("on") || protoOfV === funcProto && (v = derive(v), protoOfV = stateProto);
104+
on || protoOfV === funcProto && (v = derive(v), protoOfV = stateProto);
100105
protoOfV === stateProto ? bind(() => (setter(v.val, v._oldVal), dom)) : setter(v);
101106
}
102107
return add(dom, children);
103108
};
104109
var handler = (ns) => ({ get: (_, name) => tag.bind(_undefined, ns, name) });
105-
var update = (dom, newDom) => newDom ? newDom !== dom && dom.replaceWith(newDom) : dom.remove();
110+
var update = (dom, newDom) => newDom === dom || dom[newDom ? "replaceWith" : remove](newDom);
106111
var updateDoms = () => {
107112
let iter = 0, derivedStatesArray = [...changedStates].filter((s) => s.rawVal !== s._oldVal);
108113
do {
109-
derivedStates = /* @__PURE__ */ new Set();
110-
for (let l of new Set(derivedStatesArray.flatMap((s) => s._listeners = keepConnected(s._listeners))))
114+
derivedStates = new st();
115+
for (let l of new st(derivedStatesArray.flatMap((s) => s._listeners = keepConnected(s._listeners))))
111116
derive(l.f, l.s, l._dom), l._dom = _undefined;
112117
} while (++iter < 100 && (derivedStatesArray = [...derivedStates]).length);
113118
let changedStatesArray = [...changedStates].filter((s) => s.rawVal !== s._oldVal);
114119
changedStates = _undefined;
115-
for (let b of new Set(changedStatesArray.flatMap((s) => s._bindings = keepConnected(s._bindings))))
120+
for (let b of new st(changedStatesArray.flatMap((s) => s._bindings = keepConnected(s._bindings))))
116121
update(b._dom, bind(b.f, b._dom)), b._dom = _undefined;
117122
for (let s of changedStatesArray)
118123
s._oldVal = s.rawVal;

‎public/van-latest.nomodule.js

Lines changed: 22 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
(() => {
22
// van.js
3-
var protoOf = Object.getPrototypeOf;
3+
var object = Object;
4+
var protoOf = object.getPrototypeOf;
45
var changedStates;
56
var derivedStates;
67
var curDeps;
@@ -12,7 +13,11 @@
1213
var objProto = protoOf(alwaysConnectedDom);
1314
var funcProto = protoOf(protoOf);
1415
var _undefined;
15-
var addAndScheduleOnFirst = (set, s, f, waitMs) => (set ?? (setTimeout(f, waitMs), /* @__PURE__ */ new Set())).add(s);
16+
var remove = "remove";
17+
var evl = "eventListener";
18+
var st = Set;
19+
var dc = document;
20+
var addAndScheduleOnFirst = (set, s, f, waitMs) => (set ?? (setTimeout(f, waitMs), new st())).add(s);
1621
var runAndCaptureDeps = (f, deps, arg) => {
1722
let prevDeps = curDeps;
1823
curDeps = deps;
@@ -56,10 +61,10 @@
5661
_listeners: []
5762
});
5863
var bind = (f, dom) => {
59-
let deps = { _getters: /* @__PURE__ */ new Set(), _setters: /* @__PURE__ */ new Set() }, binding = { f }, prevNewDerives = curNewDerives;
64+
let deps = { _getters: new st(), _setters: new st() }, binding = { f }, prevNewDerives = curNewDerives;
6065
curNewDerives = [];
6166
let newDom = runAndCaptureDeps(f, deps, dom);
62-
newDom = (newDom ?? document).nodeType ? newDom : new Text(newDom);
67+
newDom = (newDom ?? dc).nodeType ? newDom : new Text(newDom);
6368
for (let d of deps._getters)
6469
deps._setters.has(d) || (addStatesToGc(d), d._bindings.push(binding));
6570
for (let l of curNewDerives)
@@ -68,15 +73,15 @@
6873
return binding._dom = newDom;
6974
};
7075
var derive = (f, s = state(), dom) => {
71-
let deps = { _getters: /* @__PURE__ */ new Set(), _setters: /* @__PURE__ */ new Set() }, listener = { f, s };
76+
let deps = { _getters: new st(), _setters: new st() }, listener = { f, s };
7277
listener._dom = dom ?? curNewDerives?.push(listener) ?? alwaysConnectedDom;
7378
s.val = runAndCaptureDeps(f, deps, s.rawVal);
7479
for (let d of deps._getters)
7580
deps._setters.has(d) || (addStatesToGc(d), d._listeners.push(listener));
7681
return s;
7782
};
7883
var add = (dom, ...children) => {
79-
for (let c of children.flat(Infinity)) {
84+
for (let c of children.flat(1 / 0)) {
8085
let protoOfC = protoOf(c ?? 0);
8186
let child = protoOfC === stateProto ? bind(() => c.val) : protoOfC === funcProto ? bind(c) : c;
8287
child != _undefined && dom.append(child);
@@ -85,34 +90,34 @@
8590
};
8691
var tag = (ns, name, ...args) => {
8792
let [props, ...children] = protoOf(args[0] ?? 0) === objProto ? args : [{}, ...args];
88-
let dom = ns ? document.createElementNS(ns, name) : document.createElement(name);
89-
for (let [k, v] of Object.entries(props)) {
90-
let getPropDescriptor = (proto) => proto ? Object.getOwnPropertyDescriptor(proto, k) ?? getPropDescriptor(protoOf(proto)) : _undefined;
93+
let dom = dc["createElement" + ns && "NS"](ns || name, name);
94+
for (let [k, v] of object.entries(props)) {
95+
let getPropDescriptor = (proto) => proto ? object.getOwnPropertyDescriptor(proto, k) ?? getPropDescriptor(protoOf(proto)) : _undefined;
9196
let cacheKey = name + "," + k;
9297
let propSetter = propSetterCache[cacheKey] ??= getPropDescriptor(protoOf(dom))?.set ?? 0;
93-
let setter = k.startsWith("on") ? (v2, oldV) => {
98+
let on = k.startsWith("on"), setter = on ? (v2, oldV) => {
9499
let event = k.slice(2);
95-
dom.removeEventListener(event, oldV);
96-
dom.addEventListener(event, v2);
100+
dom[remove + evl](event, oldV);
101+
dom["add" + evl](event, v2);
97102
} : propSetter ? propSetter.bind(dom) : dom.setAttribute.bind(dom, k);
98103
let protoOfV = protoOf(v ?? 0);
99-
k.startsWith("on") || protoOfV === funcProto && (v = derive(v), protoOfV = stateProto);
104+
on || protoOfV === funcProto && (v = derive(v), protoOfV = stateProto);
100105
protoOfV === stateProto ? bind(() => (setter(v.val, v._oldVal), dom)) : setter(v);
101106
}
102107
return add(dom, children);
103108
};
104109
var handler = (ns) => ({ get: (_, name) => tag.bind(_undefined, ns, name) });
105-
var update = (dom, newDom) => newDom ? newDom !== dom && dom.replaceWith(newDom) : dom.remove();
110+
var update = (dom, newDom) => newDom === dom || dom[newDom ? "replaceWith" : remove](newDom);
106111
var updateDoms = () => {
107112
let iter = 0, derivedStatesArray = [...changedStates].filter((s) => s.rawVal !== s._oldVal);
108113
do {
109-
derivedStates = /* @__PURE__ */ new Set();
110-
for (let l of new Set(derivedStatesArray.flatMap((s) => s._listeners = keepConnected(s._listeners))))
114+
derivedStates = new st();
115+
for (let l of new st(derivedStatesArray.flatMap((s) => s._listeners = keepConnected(s._listeners))))
111116
derive(l.f, l.s, l._dom), l._dom = _undefined;
112117
} while (++iter < 100 && (derivedStatesArray = [...derivedStates]).length);
113118
let changedStatesArray = [...changedStates].filter((s) => s.rawVal !== s._oldVal);
114119
changedStates = _undefined;
115-
for (let b of new Set(changedStatesArray.flatMap((s) => s._bindings = keepConnected(s._bindings))))
120+
for (let b of new st(changedStatesArray.flatMap((s) => s._bindings = keepConnected(s._bindings))))
116121
update(b._dom, bind(b.f, b._dom)), b._dom = _undefined;
117122
for (let s of changedStatesArray)
118123
s._oldVal = s.rawVal;

0 commit comments

Comments
 (0)