From 0e60a8ce9c47b426535f2d3b05ff000a39535ebf Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Sat, 8 Dec 2018 19:19:08 -0500 Subject: [PATCH] use dynamic_dependencies instead of dependencies where possible --- src/compile/nodes/Attribute.ts | 4 ++-- src/compile/render-dom/wrappers/AwaitBlock.ts | 2 +- src/compile/render-dom/wrappers/DebugTag.ts | 2 +- src/compile/render-dom/wrappers/EachBlock.ts | 4 ++-- .../render-dom/wrappers/Element/Binding.ts | 10 +++++----- .../wrappers/Element/StyleAttribute.ts | 6 ++---- .../render-dom/wrappers/Element/index.ts | 4 ++-- src/compile/render-dom/wrappers/IfBlock.ts | 2 +- .../wrappers/InlineComponent/index.ts | 8 ++++---- src/compile/render-dom/wrappers/Title.ts | 3 +-- src/compile/render-dom/wrappers/shared/Tag.ts | 4 ++-- .../expected.js | 20 ++++++++++--------- .../input.html | 7 +++---- 13 files changed, 37 insertions(+), 39 deletions(-) diff --git a/src/compile/nodes/Attribute.ts b/src/compile/nodes/Attribute.ts index ec5743b08a..32e1d6da3a 100644 --- a/src/compile/nodes/Attribute.ts +++ b/src/compile/nodes/Attribute.ts @@ -33,7 +33,7 @@ export default class Attribute extends Node { this.isSynthetic = false; this.expression = new Expression(component, this, scope, info.expression); - this.dependencies = this.expression.dependencies; + this.dependencies = this.expression.dynamic_dependencies; this.chunks = null; this.isDynamic = true; // TODO not necessarily @@ -54,7 +54,7 @@ export default class Attribute extends Node { const expression = new Expression(component, this, scope, node.expression); - addToSet(this.dependencies, expression.dependencies); + addToSet(this.dependencies, expression.dynamic_dependencies); return expression; }); diff --git a/src/compile/render-dom/wrappers/AwaitBlock.ts b/src/compile/render-dom/wrappers/AwaitBlock.ts index e55d640242..4ddecfc771 100644 --- a/src/compile/render-dom/wrappers/AwaitBlock.ts +++ b/src/compile/render-dom/wrappers/AwaitBlock.ts @@ -67,7 +67,7 @@ export default class AwaitBlockWrapper extends Wrapper { this.cannotUseInnerHTML(); - block.addDependencies(this.node.expression.dependencies); + block.addDependencies(this.node.expression.dynamic_dependencies); let isDynamic = false; let hasIntros = false; diff --git a/src/compile/render-dom/wrappers/DebugTag.ts b/src/compile/render-dom/wrappers/DebugTag.ts index 294276a4ea..cec40baaf7 100644 --- a/src/compile/render-dom/wrappers/DebugTag.ts +++ b/src/compile/render-dom/wrappers/DebugTag.ts @@ -45,7 +45,7 @@ export default class DebugTagWrapper extends Wrapper { const dependencies = new Set(); this.node.expressions.forEach(expression => { - addToSet(dependencies, expression.dependencies); + addToSet(dependencies, expression.dynamic_dependencies); }); const condition = [...dependencies].map(d => `changed.${d}`).join(' || '); diff --git a/src/compile/render-dom/wrappers/EachBlock.ts b/src/compile/render-dom/wrappers/EachBlock.ts index 88e4a542f0..439f99fd09 100644 --- a/src/compile/render-dom/wrappers/EachBlock.ts +++ b/src/compile/render-dom/wrappers/EachBlock.ts @@ -80,8 +80,8 @@ export default class EachBlockWrapper extends Wrapper { super(renderer, block, parent, node); this.cannotUseInnerHTML(); - const { dependencies } = node.expression; - block.addDependencies(dependencies); + const { dynamic_dependencies } = node.expression; + block.addDependencies(dynamic_dependencies); this.block = block.child({ comment: createDebuggingComment(this.node, this.renderer.component), diff --git a/src/compile/render-dom/wrappers/Element/Binding.ts b/src/compile/render-dom/wrappers/Element/Binding.ts index b7adb6488e..318bf8ffe6 100644 --- a/src/compile/render-dom/wrappers/Element/Binding.ts +++ b/src/compile/render-dom/wrappers/Element/Binding.ts @@ -31,14 +31,14 @@ export default class BindingWrapper { this.node = node; this.parent = parent; - const { dependencies } = this.node.expression; + const { dynamic_dependencies } = this.node.expression; - block.addDependencies(dependencies); + block.addDependencies(dynamic_dependencies); // TODO does this also apply to e.g. ``? if (parent.node.name === 'select') { - parent.selectBindingDependencies = dependencies; - dependencies.forEach((prop: string) => { + parent.selectBindingDependencies = dynamic_dependencies; + dynamic_dependencies.forEach((prop: string) => { parent.renderer.component.indirectDependencies.set(prop, new Set()); }); } @@ -140,7 +140,7 @@ export default class BindingWrapper { updateDom = null; } - const dependencyArray = [...this.node.expression.dependencies] + const dependencyArray = [...this.node.expression.dynamic_dependencies] if (dependencyArray.length === 1) { updateConditions.push(`changed.${dependencyArray[0]}`) diff --git a/src/compile/render-dom/wrappers/Element/StyleAttribute.ts b/src/compile/render-dom/wrappers/Element/StyleAttribute.ts index 1488639106..7af2a8dc79 100644 --- a/src/compile/render-dom/wrappers/Element/StyleAttribute.ts +++ b/src/compile/render-dom/wrappers/Element/StyleAttribute.ts @@ -4,6 +4,7 @@ import AttributeWrapper from './Attribute'; import Node from '../../../nodes/shared/Node'; import ElementWrapper from '.'; import { stringify } from '../../../../utils/stringify'; +import addToSet from '../../../../utils/addToSet'; export interface StyleProp { key: string; @@ -32,12 +33,9 @@ export default class StyleAttributeWrapper extends AttributeWrapper { if (chunk.type === 'Text') { return stringify(chunk.data); } else { - const { dependencies } = chunk; const snippet = chunk.render(); - dependencies.forEach(d => { - propDependencies.add(d); - }); + addToSet(propDependencies, chunk.dynamic_dependencies); return chunk.getPrecedence() <= 13 ? `(${snippet})` : snippet; } diff --git a/src/compile/render-dom/wrappers/Element/index.ts b/src/compile/render-dom/wrappers/Element/index.ts index f45f83977c..0f6e8fbe9e 100644 --- a/src/compile/render-dom/wrappers/Element/index.ts +++ b/src/compile/render-dom/wrappers/Element/index.ts @@ -168,13 +168,13 @@ export default class ElementWrapper extends Wrapper { // add directive and handler dependencies [node.animation, node.outro, ...node.actions, ...node.classes].forEach(directive => { if (directive && directive.expression) { - block.addDependencies(directive.expression.dependencies); + block.addDependencies(directive.expression.dynamic_dependencies); } }); node.handlers.forEach(handler => { if (handler.expression) { - block.addDependencies(handler.expression.dependencies); + block.addDependencies(handler.expression.dynamic_dependencies); } }); diff --git a/src/compile/render-dom/wrappers/IfBlock.ts b/src/compile/render-dom/wrappers/IfBlock.ts index 0c26d8b238..4e4d3265b3 100644 --- a/src/compile/render-dom/wrappers/IfBlock.ts +++ b/src/compile/render-dom/wrappers/IfBlock.ts @@ -87,7 +87,7 @@ export default class IfBlockWrapper extends Wrapper { this.branches.push(branch); blocks.push(branch.block); - block.addDependencies(node.expression.dependencies); + block.addDependencies(node.expression.dynamic_dependencies); if (branch.block.dependencies.size > 0) { isDynamic = true; diff --git a/src/compile/render-dom/wrappers/InlineComponent/index.ts b/src/compile/render-dom/wrappers/InlineComponent/index.ts index 049ae06e44..54905f815a 100644 --- a/src/compile/render-dom/wrappers/InlineComponent/index.ts +++ b/src/compile/render-dom/wrappers/InlineComponent/index.ts @@ -31,7 +31,7 @@ export default class InlineComponentWrapper extends Wrapper { this.cannotUseInnerHTML(); if (this.node.expression) { - block.addDependencies(this.node.expression.dependencies); + block.addDependencies(this.node.expression.dynamic_dependencies); } this.node.attributes.forEach(attr => { @@ -48,12 +48,12 @@ export default class InlineComponentWrapper extends Wrapper { eachBlock.hasBinding = true; } - block.addDependencies(binding.expression.dependencies); + block.addDependencies(binding.expression.dynamic_dependencies); }); this.node.handlers.forEach(handler => { if (handler.expression) { - block.addDependencies(handler.expression.dependencies); + block.addDependencies(handler.expression.dynamic_dependencies); } }); @@ -214,7 +214,7 @@ export default class InlineComponentWrapper extends Wrapper { ); updates.push(deindent` - if (!${updating} && ${[...binding.expression.dependencies].map((dependency: string) => `changed.${dependency}`).join(' || ')}) { + if (!${updating} && ${[...binding.expression.dynamic_dependencies].map((dependency: string) => `changed.${dependency}`).join(' || ')}) { ${name_changes}${quotePropIfNecessary(binding.name)} = ${snippet}; } `); diff --git a/src/compile/render-dom/wrappers/Title.ts b/src/compile/render-dom/wrappers/Title.ts index c07a8fbd54..7baa98073f 100644 --- a/src/compile/render-dom/wrappers/Title.ts +++ b/src/compile/render-dom/wrappers/Title.ts @@ -47,10 +47,9 @@ export default class TitleWrapper extends Wrapper { if (chunk.type === 'Text') { return stringify(chunk.data); } else { - const { dependencies } = chunk.expression; const snippet = chunk.expression.render(); - dependencies.forEach(d => { + chunk.expression.dynamic_dependencies.forEach(d => { allDependencies.add(d); }); diff --git a/src/compile/render-dom/wrappers/shared/Tag.ts b/src/compile/render-dom/wrappers/shared/Tag.ts index bb5a006fdb..8f00e1d9a9 100644 --- a/src/compile/render-dom/wrappers/shared/Tag.ts +++ b/src/compile/render-dom/wrappers/shared/Tag.ts @@ -11,14 +11,14 @@ export default class Tag extends Wrapper { super(renderer, block, parent, node); this.cannotUseInnerHTML(); - block.addDependencies(node.expression.dependencies); + block.addDependencies(node.expression.dynamic_dependencies); } renameThisMethod( block: Block, update: ((value: string) => string) ) { - const { dependencies } = this.node.expression; + const dependencies = this.node.expression.dynamic_dependencies; const snippet = this.node.expression.render(); const value = this.node.shouldCache && block.getUniqueName(`${this.var}_value`); diff --git a/test/js/samples/dev-warning-missing-data-computed/expected.js b/test/js/samples/dev-warning-missing-data-computed/expected.js index 2afbeadbf0..d7c22a1711 100644 --- a/test/js/samples/dev-warning-missing-data-computed/expected.js +++ b/test/js/samples/dev-warning-missing-data-computed/expected.js @@ -4,15 +4,15 @@ import { SvelteComponentDev, addLoc, append, createElement, createText, detachNo const file = undefined; function create_fragment(component, ctx) { - var p, text0_value = Math.max(0, ctx.foo), text0, text1, text2_value = ctx.bar(), text2, current; + var p, text0_value = Math.max(0, ctx.foo), text0, text1, text2, current; return { c: function create() { p = createElement("p"); text0 = createText(text0_value); text1 = createText("\n\t"); - text2 = createText(text2_value); - addLoc(p, file, 8, 0, 77); + text2 = createText(ctx.bar); + addLoc(p, file, 7, 0, 67); }, l: function claim(nodes) { @@ -32,8 +32,8 @@ function create_fragment(component, ctx) { setData(text0, text0_value); } - if ((changed.bar) && text2_value !== (text2_value = ctx.bar())) { - setData(text2, text2_value); + if (changed.bar) { + setData(text2, ctx.bar); } }, @@ -52,18 +52,20 @@ function create_fragment(component, ctx) { }; } -function define($$self, $$props) { +function define($$self, $$props, $$make_dirty) { let { foo } = $$props; - function bar() { - return foo * 2; - } + let bar; $$self.$$.get = () => ({ foo, bar }); $$self.$$.set = $$props => { if ('foo' in $$props) foo = $$props.foo; }; + + $$self.$$.update = ($$dirty = { foo: 1 }) => { + if ($$dirty.foo) { bar = foo * 2; $$make_dirty('bar'); } + }; } class SvelteComponent extends SvelteComponentDev { diff --git a/test/js/samples/dev-warning-missing-data-computed/input.html b/test/js/samples/dev-warning-missing-data-computed/input.html index 5d1e9836ea..fc510caba8 100644 --- a/test/js/samples/dev-warning-missing-data-computed/input.html +++ b/test/js/samples/dev-warning-missing-data-computed/input.html @@ -1,12 +1,11 @@

{Math.max(0, foo)} - {bar()} + {bar}

\ No newline at end of file