Skip to content

Commit

Permalink
[IMP] app: add fast path for when component has no prop
Browse files Browse the repository at this point in the history
  • Loading branch information
@ged-odoo @sdegueldre
ged-odoo authored and sdegueldre committed Jun 13, 2022
1 parent d046913 commit 55ac43c
Show file tree
Hide file tree
Showing 26 changed files with 548 additions and 541 deletions.
6 changes: 4 additions & 2 deletions src/compiler/code_generator.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1181,7 +1181,9 @@ export class CodeGenerator {
id,
expr: `app.createComponent(${
ast.isDynamic ? null : expr
}, ${!ast.isDynamic}, ${!!ast.slots}, ${!!ast.dynamicProps})`,
}, ${!ast.isDynamic}, ${!!ast.slots}, ${!!ast.dynamicProps}, ${
!ast.props && !ast.dynamicProps
})`,
});

let blockExpr = `${id}(${propString}, ${keyArg}, node, ctx, ${ast.isDynamic ? expr : null})`;
Expand Down Expand Up @@ -1278,7 +1280,7 @@ export class CodeGenerator {
let id = generateId("comp");
this.staticDefs.push({
id,
expr: `app.createComponent(null, false, true, false)`,
expr: `app.createComponent(null, false, true, false, false)`,
});

const target = compileExpr(ast.target);
Expand Down
9 changes: 7 additions & 2 deletions src/runtime/app.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -118,7 +118,8 @@ export class App<
name: string | null,
isStatic: boolean,
hasSlotsProp: boolean,
hasDynamicPropList: boolean
hasDynamicPropList: boolean,
hasNoProp: boolean
) {
const isDynamic = !isStatic;
function _arePropsDifferent(props1: Props, props2: Props): boolean {
Expand All @@ -129,7 +130,11 @@ export class App<
}
return hasDynamicPropList && Object.keys(props1).length !== Object.keys(props2).length;
}
const arePropsDifferent = hasSlotsProp ? () => true : _arePropsDifferent;
const arePropsDifferent = hasSlotsProp
? (_1: any, _2: any) => true
: hasNoProp
? (_1: any, _2: any) => false
: _arePropsDifferent;
const updateAndRender = ComponentNode.prototype.updateAndRender;
const initiateRender = ComponentNode.prototype.initiateRender;

Expand Down
22 changes: 11 additions & 11 deletions tests/__snapshots__/reactivity.test.ts.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@ exports[`Reactivity: useState destroyed component before being mounted is inacti
"function anonymous(app, bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
const comp1 = app.createComponent(\`Child\`, true, false, false);
const comp1 = app.createComponent(\`Child\`, true, false, false, true);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
Expand Down Expand Up @@ -82,7 +82,7 @@ exports[`Reactivity: useState destroyed component is inactive 1`] = `
"function anonymous(app, bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
const comp1 = app.createComponent(\`Child\`, true, false, false);
const comp1 = app.createComponent(\`Child\`, true, false, false, true);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
Expand Down Expand Up @@ -129,7 +129,7 @@ exports[`Reactivity: useState parent and children subscribed to same context 1`]
"function anonymous(app, bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
const comp1 = app.createComponent(\`Child\`, true, false, false);
const comp1 = app.createComponent(\`Child\`, true, false, false, true);
let block1 = createBlock(\`<div><block-child-0/><block-text-0/></div>\`);
Expand Down Expand Up @@ -222,8 +222,8 @@ exports[`Reactivity: useState two components are updated in parallel 1`] = `
"function anonymous(app, bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
const comp1 = app.createComponent(\`Child\`, true, false, false);
const comp2 = app.createComponent(\`Child\`, true, false, false);
const comp1 = app.createComponent(\`Child\`, true, false, false, true);
const comp2 = app.createComponent(\`Child\`, true, false, false, true);
let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
Expand Down Expand Up @@ -253,8 +253,8 @@ exports[`Reactivity: useState two components can subscribe to same context 1`] =
"function anonymous(app, bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
const comp1 = app.createComponent(\`Child\`, true, false, false);
const comp2 = app.createComponent(\`Child\`, true, false, false);
const comp1 = app.createComponent(\`Child\`, true, false, false, true);
const comp2 = app.createComponent(\`Child\`, true, false, false, true);
let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
Expand Down Expand Up @@ -284,8 +284,8 @@ exports[`Reactivity: useState two independent components on different levels are
"function anonymous(app, bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
const comp1 = app.createComponent(\`Child\`, true, false, false);
const comp2 = app.createComponent(\`Parent\`, true, false, false);
const comp1 = app.createComponent(\`Child\`, true, false, false, true);
const comp2 = app.createComponent(\`Parent\`, true, false, false, true);
let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
Expand Down Expand Up @@ -315,7 +315,7 @@ exports[`Reactivity: useState two independent components on different levels are
"function anonymous(app, bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
const comp1 = app.createComponent(\`Child\`, true, false, false);
const comp1 = app.createComponent(\`Child\`, true, false, false, true);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
Expand Down Expand Up @@ -345,7 +345,7 @@ exports[`Reactivity: useState useless atoms should be deleted 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
let { prepareList, withKey } = helpers;
const comp1 = app.createComponent(\`Quantity\`, true, false, false);
const comp1 = app.createComponent(\`Quantity\`, true, false, false, false);
let block1 = createBlock(\`<div><block-child-0/> Total: <block-text-0/> Count: <block-text-1/></div>\`);
Expand Down
6 changes: 3 additions & 3 deletions tests/compiler/__snapshots__/misc.test.ts.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ exports[`misc complex template 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
let { prepareList, withKey } = helpers;
const comp1 = app.createComponent(\`SlotButton\`, true, false, false);
const comp1 = app.createComponent(\`SlotButton\`, true, false, false, false);
let block1 = createBlock(\`<div block-attribute-0=\\"class\\"><div block-attribute-1=\\"class\\"><div class=\\"batch_header\\"><a block-attribute-2=\\"href\\" block-attribute-3=\\"class\\" title=\\"View Batch\\"><block-text-4/><block-child-0/><i class=\\"arrow fa fa-window-maximize\\"/></a></div><block-child-1/><div class=\\"batch_slots\\"><block-child-2/><block-child-3/></div><div class=\\"batch_commits\\"><block-child-4/></div></div></div>\`);
let block2 = createBlock(\`<i class=\\"fa fa-exclamation-triangle\\"/>\`);
Expand Down Expand Up @@ -184,8 +184,8 @@ exports[`misc other complex template 1`] = `
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
let { prepareList, withKey } = helpers;
const callTemplate_1 = app.getTemplate(\`LOAD_INFOS_TEMPLATE\`);
const comp1 = app.createComponent(\`BundlesList\`, true, false, false);
const comp2 = app.createComponent(\`BundlesList\`, true, false, false);
const comp1 = app.createComponent(\`BundlesList\`, true, false, false, false);
const comp2 = app.createComponent(\`BundlesList\`, true, false, false, false);
let block1 = createBlock(\`<div><header><nav class=\\"navbar navbar-expand-md navbar-light bg-light\\"><a block-attribute-0=\\"href\\"><b style=\\"color:#777;\\"><block-text-1/></b></a><button type=\\"button\\" class=\\"navbar-toggler\\" data-toggle=\\"collapse\\" data-target=\\"#top_menu_collapse\\"><span class=\\"navbar-toggler-icon\\"/></button><div class=\\"collapse navbar-collapse\\" id=\\"top_menu_collapse\\" aria-expanded=\\"false\\"><ul class=\\"nav navbar-nav ml-auto text-right\\" id=\\"top_menu\\"><block-child-0/><li class=\\"nav-item divider\\"/><block-child-1/></ul><div><div class=\\"input-group input-group-sm\\"><div class=\\"input-group-prepend input-group-sm\\"><button class=\\"btn btn-default fa fa-cog\\" title=\\"Settings\\" block-handler-2=\\"click\\"/><button class=\\"btn btn-default\\" block-handler-3=\\"click\\"> More </button><block-child-2/></div><input class=\\"form-control\\" type=\\"text\\" placeholder=\\"Search\\" aria-label=\\"Search\\" name=\\"search\\" block-attribute-4=\\"value\\" block-handler-5=\\"keyup\\" block-handler-6=\\"change\\" block-ref=\\"7\\"/><div class=\\"input-group-append\\"><button class=\\"btn btn-default fa fa-eraser\\" block-handler-8=\\"click\\"/></div></div></div></div></nav></header><div class=\\"container-fluid\\" block-ref=\\"9\\"><div class=\\"row\\"><!--div class=\\"form-group col-md-6\\">
<h5>Search options</h5>
Expand Down
Loading

0 comments on commit 55ac43c

Please sign in to comment.