archive-gh-me/marko
1
0
Fork 0
mirror of https://github.com/marko-js/marko.git synced 2026-02-01 16:07:13 +00:00
Code Issues Projects Releases Wiki Activity

perf: optimize resume visit runtime for bundle size

Browse Source
This commit is contained in:
dpiercey 2025-11-12 09:20:16 -07:00 committed by Dylan Piercey
parent fbdf6a77fc
commit f79163dc0e
9 changed files with 147 additions and 137 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
.changeset/curly-colts-worry.md Normal file
View File

@ -0,0 +1,5 @@
---
"@marko/runtime-tags": patch
---
Optimize resume visitor code for bundle size.

36
.sizes.json
View File

@ -7,68 +7,68 @@
{
"name": "*",
"total": {
"min": 19684,
"brotli": 7547
"min": 19635,
"brotli": 7527
}
},
{
"name": "counter",
"user": {
"min": 174,
"brotli": 145
"brotli": 140
},
"runtime": {
"min": 4050,
"brotli": 1825
"min": 4043,
"brotli": 1822
},
"total": {
"min": 4224,
"brotli": 1970
"min": 4217,
"brotli": 1962
}
},
{
"name": "counter 💧",
"user": {
"min": 96,
"brotli": 92
"brotli": 89
},
"runtime": {
"min": 2134,
"brotli": 1115
"brotli": 1119
},
"total": {
"min": 2230,
"brotli": 1207
"brotli": 1208
}
},
{
"name": "comments",
"user": {
"min": 743,
"brotli": 417
"brotli": 404
},
"runtime": {
"min": 7114,
"brotli": 3108
"min": 7099,
"brotli": 3103
},
"total": {
"min": 7857,
"brotli": 3525
"min": 7842,
"brotli": 3507
}
},
{
"name": "comments 💧",
"user": {
"min": 130,
"brotli": 112
"brotli": 116
},
"runtime": {
"min": 2286,
"brotli": 1161
"brotli": 1162
},
"total": {
"min": 2416,
"brotli": 1273
"brotli": 1278
}
}
]

2
.sizes/comments.csr/entry.js
View File

@ -1,4 +1,4 @@
// size: 743 (min) 417 (brotli)
// size: 743 (min) 404 (brotli)
const $if_content__setup = ($scope) => {
($scope.a,
$if_content__comment_comments._($scope),

2
.sizes/comments.ssr/entry.js
View File

@ -1,4 +1,4 @@
// size: 130 (min) 112 (brotli)
// size: 130 (min) 116 (brotli)
const $for_content__open__script = _script("a0", ($scope) =>
_on($scope.c, "click", function () {
$for_content__open($scope, !$scope.m);

2
.sizes/counter.csr/entry.js
View File

@ -1,4 +1,4 @@
// size: 174 (min) 145 (brotli)
// size: 174 (min) 140 (brotli)
const $clickCount__script = _script("a0", ($scope) =>
_on($scope.a, "click", function () {
$clickCount($scope, $scope.c + 1);

2
.sizes/counter.ssr/entry.js
View File

@ -1,4 +1,4 @@
// size: 96 (min) 92 (brotli)
// size: 96 (min) 89 (brotli)
const $clickCount__script = _script("a0", ($scope) =>
_on($scope.a, "click", function () {
$clickCount($scope, $scope.c + 1);

155
.sizes/dom.js
View File

@ -1,4 +1,4 @@
// size: 19684 (min) 7547 (brotli)
// size: 19635 (min) 7527 (brotli)
var empty = [],
rest = Symbol();
function attrTag(attrs) {
@ -230,85 +230,90 @@ function init(runtimeId = "M") {
serializeContext = { _: registeredValues },
visitBranches =
branchesEnabled &&
(() => {
let curBranchScopes,
(
(
branchScopesStack = [],
branchStarts = [],
orphanBranches = [],
endBranch = (accessor, singleNode) => {
let branchId,
branch,
childBranch,
endedBranches,
parent = visit.parentNode,
startVisit = visit,
i = orphanBranches.length;
for (; (branchId = +lastToken); ) {
if (
((endedBranches ||= []).push(
(branch = scopeLookup[branchId] ||= { L: branchId }),
),
(branch.F = branch),
singleNode)
) {
for (
;
startVisit.previousSibling &&
~visits.indexOf(
(startVisit = startVisit.previousSibling),
);
curBranchScopes,
) =>
(
branchId,
branch,
childBranch,
endedBranches,
accessor,
singleNode,
parent = visit.parentNode,
startVisit = visit,
i = orphanBranches.length,
) => {
for (
"[" !== visitType &&
((visitScope["J" + nextToken()] = (
(node) => () =>
node
)(
(visitScope[lastToken] =
")" === visitType || "}" === visitType
? parent
: visit),
)),
(accessor = "A" + lastToken),
(singleNode = "]" !== visitType && ")" !== visitType),
nextToken());
(branchId = +lastToken);
) {
if (
((endedBranches ||= []).push(
(branch = scopeLookup[branchId] ||= { L: branchId }),
),
(branch.F = branch),
singleNode)
) {
for (
;
startVisit.previousSibling &&
~visits.indexOf(
(startVisit = startVisit.previousSibling),
);
((branch.K = branch.S = startVisit),
"'" === visitType && (branch.a = startVisit));
} else
((curBranchScopes = push(curBranchScopes, branch)),
accessor &&
((visitScope[accessor] = curBranchScopes),
(curBranchScopes = branchScopesStack.pop())),
(startVisit = branchStarts.pop()),
parent !== startVisit.parentNode &&
parent.prepend(startVisit),
(branch.S = startVisit),
(branch.K =
visit.previousSibling === startVisit
? startVisit
: parent.insertBefore(new Text(), visit)));
for (; i && orphanBranches[--i].L > branchId; )
(((childBranch = orphanBranches.pop()).N = branch),
(branch.D ||= new Set()).add(childBranch));
nextToken();
}
endedBranches &&
(orphanBranches.push(...endedBranches),
singleNode &&
(visitScope[accessor] =
endedBranches.length > 1
? endedBranches.reverse()
: endedBranches[0]));
};
return () => {
"[" === visitType
? (lastToken
? endBranch()
: (branchScopesStack.push(curBranchScopes),
(curBranchScopes = void 0)),
branchStarts.push(visit))
: ((visitScope["J" + nextToken()] = (
(node) => () =>
node
)(
(visitScope[lastToken] =
")" === visitType || "}" === visitType
? visit.parentNode
: visit),
)),
endBranch(
"A" + lastToken,
(nextToken(), "]" !== visitType && ")" !== visitType),
));
};
})(),
);
((branch.K = branch.S = startVisit),
"'" === visitType && (branch.a = startVisit));
} else
((curBranchScopes = push(curBranchScopes, branch)),
accessor &&
((visitScope[accessor] = curBranchScopes),
(curBranchScopes = branchScopesStack.pop())),
parent !==
(startVisit = branchStarts.pop()).parentNode &&
parent.prepend(startVisit),
(branch.S = startVisit),
(branch.K =
visit.previousSibling === startVisit
? startVisit
: parent.insertBefore(new Text(), visit)));
for (; i && orphanBranches[--i].L > branchId; )
(((childBranch = orphanBranches.pop()).N = branch),
(branch.D ||= new Set()).add(childBranch));
nextToken();
}
(endedBranches &&
(orphanBranches.push(...endedBranches),
singleNode &&
(visitScope[accessor] =
endedBranches.length > 1
? endedBranches.reverse()
: endedBranches[0])),
"[" === visitType &&
(endedBranches ||
(branchScopesStack.push(curBranchScopes),
(curBranchScopes = void 0)),
branchStarts.push(visit)));
}
)(),
lastScopeId = 0,
nextToken = () =>
(lastToken = visitText.slice(

2
.sizes/name-cache.json
View File

@ -1 +1 @@
{"vars":{"props":{"$empty":"e","$rest":"t","$attrTag":"n","$attrTags":"r","$attrTagIterator":"o","$_assert_hoist":"l","$forIn":"i","$forOf":"u","$forTo":"f","$forUntil":"a","$stringifyClassObject":"c","$stringifyStyleObject":"s","$toDelimitedString":"d","$isEventHandler":"h","$getEventHandlerName":"g","$normalizeDynamicRenderer":"p","$defaultDelegator":"v","$_on":"b","$createDelegator":"m","$handleDelegated":"y","$stripSpacesAndPunctuation":"k","$nextScopeId":"C","$createScope":"_","$skipScope":"w","$findBranchWithKey":"N","$destroyBranch":"A","$destroyNestedBranches":"S","$removeAndDestroyBranch":"x","$insertBranchBefore":"M","$tempDetachBranch":"j","$walker":"I","$walk":"$","$walkInternal":"E","$branchesEnabled":"T","$isResuming":"L","$registeredValues":"R","$enableBranches":"q","$init":"B","$_resume":"O","$_var_resume":"D","$_el":"V","$_attr_input_checked":"F","$_attr_input_checked_script":"U","$_attr_input_checkedValue":"W","$_attr_input_checkedValue_script":"G","$_attr_input_value":"P","$_attr_input_value_script":"z","$_attr_select_value":"H","$_attr_select_value_script":"J","$setSelectOptions":"K","$_attr_details_or_dialog_open":"X","$_attr_details_or_dialog_open_script":"Z","$inputType":"Q","$setValueAndUpdateSelection":"Y","$setCheckboxValue":"ee","$controllableDelegate":"te","$syncControllable":"ne","$handleChange":"re","$handleFormReset":"oe","$hasValueChanged":"le","$hasCheckboxChanged":"ie","$hasSelectChanged":"ue","$hasFormElementChanged":"fe","$normalizeStrProp":"ae","$normalizeBoolProp":"ce","$toValueProp":"se","$isScheduled":"de","$channel":"he","$parsers":"ge","$parseHTML":"pe","$schedule":"ve","$flushAndWaitFrame":"be","$triggerMacroTask":"me","$_let":"ye","$_const":"ke","$_or":"Ce","$_for_closure":"_e","$_if_closure":"we","$subscribeToScopeSet":"Ne","$_closure":"Ae","$_closure_get":"Se","$closure":"xe","$_child_setup":"Me","$_var":"je","$_return":"Ie","$_return_change":"$e","$_var_change":"Ee","$tagIdsByGlobal":"Te","$_id":"Le","$_script":"Re","$_el_read":"qe","$traverseAllHoisted":"Be","$_hoist":"Oe","$createBranch":"De","$createAndSetupBranch":"Ve","$setupBranch":"Fe","$_content":"Ue","$_content_resume":"We","$_content_closures":"Ge","$_content_branch":"Pe","$cloneCache":"ze","$_attr":"He","$setAttribute":"Je","$_attr_class":"Ke","$_attr_class_items":"Xe","$_attr_class_item":"Ze","$_attr_style":"Qe","$_attr_style_items":"Ye","$_attr_style_item":"et","$_text":"tt","$_text_content":"nt","$_attrs":"rt","$_attrs_content":"ot","$hasAttrAlias":"lt","$_attrs_partial":"it","$_attrs_partial_content":"ut","$attrsInternal":"ft","$_attr_content":"at","$_attrs_script":"ct","$_html":"st","$normalizeAttrValue":"dt","$normalizeString":"ht","$_lifecycle":"gt","$removeChildNodes":"pt","$insertChildNodes":"vt","$toInsertNode":"bt","$_await":"mt","$_try":"yt","$renderCatch":"kt","$_if":"Ct","$_dynamic_tag":"_t","$setConditionalRenderer":"wt","$_for_of":"Nt","$_for_in":"At","$_for_to":"St","$_for_until":"xt","$loop":"Mt","$createBranchWithTagNameOrRenderer":"jt","$bySecondArg":"It","$byFirstArg":"$t","$rendering":"Et","$pendingRenders":"Tt","$pendingRendersLookup":"Lt","$caughtError":"Rt","$placeholderShown":"qt","$pendingEffects":"Bt","$pendingScopes":"Ot","$scopeKeyOffset":"Dt","$queueRender":"Vt","$queueEffect":"Ft","$run":"Ut","$prepareEffects":"Wt","$runEffects":"Gt","$runRenders":"Pt","$runRender":"zt","$_enable_catch":"Ht","$$signalReset":"Jt","$$signal":"Kt","$abort":"Xt","$classIdToBranch":"Zt","$compat":"Qt","$_template":"Yt","$mount":"en","$$clickCount__script":"tn","$$clickCount":"nn","$$setup":"an","$$if_content__setup":"ss","$$if_content__comment_comments":"as","$$if_content__id":"ts","$$if_content":"ns","$$for_content__id":"ls","$$for_content__input_path__OR__i":"os","$$for_content__input_path":"cs","$$for_content__i":"is","$$for_content__open__script":"us","$$for_content__open":"ms","$$for_content__setup":"bs","$$for_content__comment_text":"es","$$for_content__if":"ps","$$for_content__comment_comments":"_s","$$for_content__$params":"ds","$$for_content__comment":"fs","$$for":"hs","$$input_comments":"rs","$$input_path":"js","$_call":"rn","$_resume_dynamic_tag":"on","$dynamicTagScript":"ln","$decodeAccessor":"un","$toArray":"fn","$push":"cn","$forEach":"sn"}}}
{"vars":{"props":{"$empty":"e","$rest":"t","$attrTag":"n","$attrTags":"r","$attrTagIterator":"o","$_assert_hoist":"i","$forIn":"l","$forOf":"u","$forTo":"f","$forUntil":"a","$_call":"c","$stringifyClassObject":"s","$stringifyStyleObject":"d","$toDelimitedString":"h","$isEventHandler":"p","$getEventHandlerName":"g","$normalizeDynamicRenderer":"v","$decodeAccessor":"b","$toArray":"m","$push":"S","$defaultDelegator":"y","$_on":"A","$createDelegator":"k","$handleDelegated":"C","$stripSpacesAndPunctuation":"N","$nextScopeId":"_","$createScope":"w","$skipScope":"E","$findBranchWithKey":"I","$destroyBranch":"M","$destroyNestedBranches":"x","$removeAndDestroyBranch":"F","$insertBranchBefore":"L","$tempDetachBranch":"T","$walker":"$","$walk":"O","$walkInternal":"D","$branchesEnabled":"K","$isResuming":"G","$registeredValues":"R","$enableBranches":"B","$init":"H","$_resume":"U","$_var_resume":"V","$_el":"P","$_attr_input_checked":"W","$_attr_input_checked_script":"j","$_attr_input_checkedValue":"q","$_attr_input_checkedValue_script":"J","$_attr_input_value":"Q","$_attr_input_value_script":"X","$_attr_select_value":"Z","$_attr_select_value_script":"z","$setSelectOptions":"Y","$_attr_details_or_dialog_open":"ee","$_attr_details_or_dialog_open_script":"te","$inputType":"ne","$setValueAndUpdateSelection":"re","$setCheckboxValue":"oe","$controllableDelegate":"ie","$syncControllable":"le","$handleChange":"ue","$handleFormReset":"fe","$hasValueChanged":"ae","$hasCheckboxChanged":"ce","$hasSelectChanged":"se","$hasFormElementChanged":"de","$normalizeStrProp":"he","$normalizeBoolProp":"pe","$toValueProp":"ge","$isScheduled":"ve","$channel":"be","$parsers":"me","$parseHTML":"Se","$schedule":"ye","$flushAndWaitFrame":"Ae","$triggerMacroTask":"ke","$_let":"Ce","$_const":"Ne","$_or":"_e","$_for_closure":"we","$_if_closure":"Ee","$subscribeToScopeSet":"Ie","$_closure":"Me","$_closure_get":"xe","$_child_setup":"Fe","$_var":"Le","$_return":"Te","$_return_change":"$e","$_var_change":"Oe","$tagIdsByGlobal":"De","$_id":"Ke","$_script":"Ge","$_el_read":"Re","$traverseAllHoisted":"Be","$_hoist":"He","$createBranch":"Ue","$createAndSetupBranch":"Ve","$setupBranch":"Pe","$_content":"We","$_content_resume":"je","$_content_closures":"qe","$cloneCache":"Je","$_attr":"Qe","$setAttribute":"Xe","$_attr_class":"Ze","$_attr_class_items":"ze","$_attr_class_item":"Ye","$_attr_style":"et","$_attr_style_items":"tt","$_attr_style_item":"nt","$_text":"rt","$_text_content":"ot","$_attrs":"it","$_attrs_content":"lt","$hasAttrAlias":"ut","$_attrs_partial":"ft","$_attrs_partial_content":"at","$attrsInternal":"ct","$_attr_content":"st","$_attrs_script":"dt","$_html":"ht","$normalizeAttrValue":"pt","$normalizeString":"gt","$_lifecycle":"vt","$removeChildNodes":"bt","$insertChildNodes":"mt","$toInsertNode":"St","$_await":"yt","$_try":"At","$renderCatch":"kt","$_if":"Ct","$_dynamic_tag":"Nt","$_resume_dynamic_tag":"_t","$dynamicTagScript":"wt","$setConditionalRenderer":"Et","$_for_of":"It","$_for_in":"Mt","$_for_to":"xt","$_for_until":"Ft","$loop":"Lt","$createBranchWithTagNameOrRenderer":"Tt","$bySecondArg":"$t","$byFirstArg":"Ot","$rendering":"Dt","$pendingRenders":"Kt","$pendingRendersLookup":"Gt","$caughtError":"Rt","$placeholderShown":"Bt","$pendingEffects":"Ht","$pendingScopes":"Ut","$scopeKeyOffset":"Vt","$queueRender":"Pt","$queueEffect":"Wt","$run":"jt","$prepareEffects":"qt","$runEffects":"Jt","$runRenders":"Qt","$runRender":"Xt","$_enable_catch":"Zt","$$signalReset":"zt","$$signal":"Yt","$abort":"en","$classIdToBranch":"tn","$compat":"nn","$_template":"rn","$mount":"on","$$clickCount__script":"ta","$$clickCount":"aa","$$setup":"na","$forEach":"ln","$$if_content__setup":"sa","$$if_content__comment_comments":"ca","$$if_content__id":"ia","$$for_content__id":"la","$$for_content__input_path__OR__i":"ma","$$for_content__input_path":"oa","$$for_content__i":"ua","$$for_content__open__script":"ba","$$for_content__open":"ea","$$for_content__setup":"_a","$$for_content__comment_text":"da","$$for_content__if":"fa","$$for_content__comment_comments":"ha","$$for_content__$params":"ja","$$for_content__comment":"pa","$$for":"ga","$$input_comments":"ka","$$input_path":"ra"}}}

78
packages/runtime-tags/src/dom/resume.ts
View File

@ -64,19 +64,43 @@ export function init(runtimeId = DEFAULT_RUNTIME_ID) {
};
const visitBranches =
branchesEnabled &&
(() => {
let curBranchScopes: Opt<BranchScope>;
const branchScopesStack: Opt<BranchScope>[] = [];
const branchStarts: Comment[] = [];
const orphanBranches: BranchScope[] = [];
const endBranch = (accessor?: string, singleNode?: boolean) => {
const parent = visit.parentNode!;
let startVisit: ChildNode = visit;
let i = orphanBranches.length;
let branchId: number;
let branch: BranchScope;
let childBranch: BranchScope;
let endedBranches: BranchScope[] | undefined;
((
branchScopesStack: Opt<BranchScope>[] = [],
branchStarts: Comment[] = [],
orphanBranches: BranchScope[] = [],
curBranchScopes?: Opt<BranchScope>,
) => {
return (
branchId?: number,
branch?: BranchScope,
childBranch?: BranchScope,
endedBranches?: BranchScope[],
accessor?: string,
singleNode?: boolean,
parent = visit.parentNode!,
startVisit: ChildNode = visit,
i = orphanBranches.length,
) => {
if (visitType !== ResumeSymbol.BranchStart) {
visitScope[
AccessorPrefix.Getter + nextToken(/* read accessor */)
] = (
(node) => () =>
node
)(
(visitScope[lastToken] =
visitType === ResumeSymbol.BranchEndOnlyChildInParent ||
visitType ===
ResumeSymbol.BranchEndSingleNodeOnlyChildInParent
? parent
: visit),
);
accessor = AccessorPrefix.BranchScopes + lastToken;
singleNode =
visitType !== ResumeSymbol.BranchEnd &&
visitType !== ResumeSymbol.BranchEndOnlyChildInParent;
nextToken(/* read optional first branchId */);
}
while ((branchId = +lastToken)) {
(endedBranches ||= []).push(
@ -138,42 +162,17 @@ export function init(runtimeId = DEFAULT_RUNTIME_ID) {
: endedBranches[0];
}
}
};
return () => {
if (visitType === ResumeSymbol.BranchStart) {
if (lastToken) {
endBranch();
} else {
if (!endedBranches) {
branchScopesStack.push(curBranchScopes);
curBranchScopes = undefined;
}
branchStarts.push(visit);
} else {
visitScope[
AccessorPrefix.Getter + nextToken(/* read accessor */)
] = (
(node) => () =>
node
)(
(visitScope[lastToken] =
visitType === ResumeSymbol.BranchEndOnlyChildInParent ||
visitType ===
ResumeSymbol.BranchEndSingleNodeOnlyChildInParent
? visit.parentNode
: visit),
);
endBranch(
AccessorPrefix.BranchScopes + lastToken,
(nextToken(/* read optional first branchId */),
visitType !== ResumeSymbol.BranchEnd &&
visitType !== ResumeSymbol.BranchEndOnlyChildInParent),
);
}
};
})();
let $global: Scope[AccessorProp.Global] | undefined;
let lastScopeId = 0;
let lastEffect: string | undefined;
let visits: RenderData["v"];
let resumes: NonNullable<RenderData["r"]>;
@ -183,6 +182,7 @@ export function init(runtimeId = DEFAULT_RUNTIME_ID) {
let visitScope: Scope;
let lastToken: string | 0;
let lastTokenIndex: number;
let lastScopeId = 0;
const nextToken = () =>
(lastToken = visitText.slice(
lastTokenIndex,