Skip to content

Commit 210d997

Browse files
dead-claudiadead-claudia
committed
Improve bundle size, move to type masks to boost performance
- `function foo(...) {...}` to `var foo = (...) => {...}` saved a fair bit of space. I also replaced other ES5 `function` functions with arrow functions where possible. - I inlined several functions. Turns out Terser wasn't inlining them properly (they were getting nonsensically inlined as IIFEs), and it was causing performance to suffer. - I dropped the `contenteditable` code, since that was only needed to handle the since-dropped `m.trust`. - I switched from tag names to type masks. This enabled several optimizations. - Size: I switched from a `switch` to function tables for create and update. Now, it just hinges on how well the CPU predicts it, and modern desktop CPUs very much can chase such multi-level indirect branches. - Size: I could blend single-key diffs with element and component tag name diffs, for better performance. - Performance: By using an expando bit, I've avoided needing to read the current namespace in some pretty hot loops, including in `setAttr`. - Performance: In `setAttr` and other places, I've merged as many as 4 tag comparisons to a single bit comparison. - I truncated the vnode properties to single letters. This resulted in a moderate savings. - I moved `redraw` to a return value of `m.mount` and also passed it via a context value to components so they can deal with non-global redraws. - I re-split `m.layout`. I also swapped out the benchmark library for something I rolled myself, and used that to set up the benchmarks. Benchmark.js isn't maintained anymore, its built-in output wasn't all that great, and it was forcing me to use globals where I otherwise didn't really need to, so I decided to roll some statistics stuff myself and make something simple. And while I was at it, I simplified the benchmark code by a lot. I also ripped out the select/option Chrome bug workaround - it doesn't seem to replicate anymore. Removing that brought a slight boost to attribute setting performance and enabled me to factor that code out to something a lot simpler. Try this page for example: ```html <!doctype html> <select> <option value="foo">Foo</option> <option value="bar">Bar</option> <option value="baz">Baz</option> </select> <script> var select = document.querySelector("select") console.log("s", select.selectedIndex, select.value) select.onchange = select.onclick = select.onblur = () => { console.log("c", select.selectedIndex, select.value) } var second = select.children[1] setInterval(() => { console.log("i", select.selectedIndex, select.value) second.value = "bar" console.log("i", select.selectedIndex, select.value) }, 5000) </script> ```
1 parent c0821cb commit 210d997

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

71 files changed

+5973
-7690
lines changed

‎.eslintrc.json

+30-5
Original file line numberDiff line numberDiff line change
@@ -16,15 +16,40 @@
1616
}
1717
},
1818
{
19-
"files": "tests/**",
19+
"files": ["tests/**", "test-utils/**"],
2020
"env": {
2121
"node": true
2222
},
2323
"parserOptions": {
2424
"ecmaVersion": 2020
2525
},
2626
"rules": {
27-
"no-process-env": "off"
27+
"no-process-env": "off",
28+
"no-restricted-syntax": ["error",
29+
{"selector": "Literal[bigint]", "message": "BigInts are not supported in ES2018"},
30+
{"selector": "ChainExpression", "message": "Optional chaining is not supported in ES2018"},
31+
{"selector": "BinaryExpression[operator='??']", "message": "Nullish coalescing is not supported in ES2018"},
32+
{"selector": "MetaProperty[meta.name='import'][property.name='meta']", "message": "`import.meta` is not supported in ES2018"},
33+
{"selector": "ExportAllDeclaration[exported!=null]", "message": "`export * as foo from ...` is not supported in ES2018"},
34+
{"selector": "CatchClause[param=null]", "message": "Omitted `catch` bindings are not supported in ES2018"},
35+
{"selector": "ForOfStatement[await=true]", "message": "Async/await is not supported in ES2018"},
36+
{"selector": "ObjectExpression > SpreadElement", "message": "Object rest/spread is not supported in ES2018"},
37+
{"selector": "ObjectPattern > SpreadElement", "message": "Object rest/spread is not supported in ES2018"},
38+
{"selector": "Function[async=true][generator=true]", "message": "Async generators are not supported in ES2018"},
39+
{"selector": "Literal[regex.flags=/s/]", "message": "`/.../s` is not supported in ES2018"},
40+
{"selector": "Literal[regex.pattern=/\\(<=|\\(<!/]", "message": "Lookbehind assertions are not supported in ES2018"},
41+
{"selector": "Literal[regex.pattern=/\\(?<[\\w$]+>|\\\\k<[\\w$]+>/]", "message": "Named capture groups are not supported in ES2018"},
42+
{"selector": "Literal[regex.flags=/u/][regex.pattern=/\\\\p/i]", "message": "`\\p{...}` in regexps are not supported in ES2018"},
43+
{"selector": "Literal[regex.flags=/v/]", "message": "`/.../v` is not supported in ES2018"},
44+
{
45+
"selector": "TaggedTemplateExpression TemplateElement[value.raw=/\\\\(?![0'\"\\\\nrvtbf\\n\\r\\u2028\\u2029]|x[0-9a-fA-F]{2}|u[0-9a-fA-F]{4}|u\\{([0-9a-fA-F]{1,5}|10[0-9a-fA-F]{0,4})\\})/]",
46+
"message": "Tagged template strings in ES2018 have the same lexical grammar as non-tagged template strings"
47+
},
48+
49+
{"selector": "MemberExpression[property.name='matchAll']", "message": "`string.matchAll` is not supported in ES2018"},
50+
{"selector": "MemberExpression[property.name='trimStart']", "message": "`string.trimStart` is not supported in ES2018"},
51+
{"selector": "MemberExpression[property.name='finally']", "message": "`promise.finally` is not supported in ES2018"}
52+
]
2853
}
2954
}
3055
],
@@ -37,8 +62,6 @@
3762
"URL": true,
3863
"URLSearchParams": true,
3964
"AbortController": true,
40-
"setTimeout": true,
41-
"clearTimeout": true,
4265
"console": true
4366
},
4467
"parserOptions": {
@@ -70,7 +93,9 @@
7093

7194
{"selector": "MemberExpression[property.name='matchAll']", "message": "`string.matchAll` is not supported in ES2018"},
7295
{"selector": "MemberExpression[property.name='trimStart']", "message": "`string.trimStart` is not supported in ES2018"},
73-
{"selector": "MemberExpression[property.name='finally']", "message": "`promise.finally` is not supported in ES2018"}
96+
{"selector": "MemberExpression[property.name='finally']", "message": "`promise.finally` is not supported in ES2018"},
97+
98+
{"selector": "VariableDeclaration[kind!='var']", "message": "Keep to `var` in `src/` to ensure the module compresses better"}
7499
],
75100
"no-restricted-properties": ["error",
76101
{"object": "Promise", "property": "allSettled", "message": "`Promise.allSettled` is not supported in ES2018"},

0 commit comments

Comments
 (0)