msb-public
/
svelte
mirror of https://github.com/sveltejs/svelte
1
0
Code Issues Projects Releases Wiki Activity

Merge pull request #751 from sveltejs/hoist-if-block-selectors

Browse Source 
Hoist if block selectors
pull/754/head
Rich Harris 7 years ago committed by GitHub
parent 4be380744f fef2367c11
commit f3f85841a5
6 changed files with 58 additions and 60 deletions
Show Stats Download Patch File Download Diff File

2
src/generators/dom/Block.ts
Unescape View File

@ -184,7 +184,7 @@ export default class Block {
}
}
render() {
toString() {
let introing;
const hasIntros = !this.builders.intro.isEmpty();
if (hasIntros) {

4
src/generators/dom/index.ts
Unescape View File

@ -15,7 +15,7 @@ import Block from './Block';
import { Parsed, CompileOptions, Node } from '../../interfaces';
export class DomGenerator extends Generator {
blocks: Block[];
blocks: (Block|string)[];
readonly: Set<string>;
metaBindings: string[];
@ -160,7 +160,7 @@ export default function dom(
}
generator.blocks.forEach(block => {
builder.addBlock(block.render());
builder.addBlock(block.toString());
});
const sharedPath = options.shared === true

6
src/generators/dom/visitors/Element/EventHandler.ts
Unescape View File

@ -94,11 +94,7 @@ export default function visitEventHandler(
`;
if (shouldHoist) {
generator.blocks.push(
<Block>{
render: () => handler,
}
);
generator.blocks.push(handler);
} else {
block.builders.init.addBlock(handler);
}

70
src/generators/dom/visitors/IfBlock.ts
Unescape View File

@ -226,21 +226,23 @@ function compound(
dynamic,
{ name, anchor, params, hasElse, if_name }
) {
const get_block = block.getUniqueName(`get_block`);
const current_block = block.getUniqueName(`current_block`);
const current_block_and = hasElse ? '' : `${current_block} && `;
const select_block_type = generator.getUniqueName(`select_block_type`);
const current_block_type = block.getUniqueName(`current_block_type`);
const current_block_type_and = hasElse ? '' : `${current_block_type} && `;
block.builders.init.addBlock(deindent`
function ${get_block} ( ${params} ) {
generator.blocks.push(deindent`
function ${select_block_type} ( ${params} ) {
${branches
.map(({ condition, block }) => {
return `${condition ? `if ( ${condition} ) ` : ''}return ${block};`;
})
.join('\n')}
}
`);
var ${current_block} = ${get_block}( ${params} );
var ${name} = ${current_block_and}${current_block}( ${params}, #component );
block.builders.init.addBlock(deindent`
var ${current_block_type} = ${select_block_type}( ${params} );
var ${name} = ${current_block_type_and}${current_block_type}( ${params}, #component );
`);
const isTopLevel = !state.parentNode;
@ -265,14 +267,14 @@ function compound(
${name}.unmount();
${name}.destroy();
}`}
${name} = ${current_block_and}${current_block}( ${params}, #component );
${name} = ${current_block_type_and}${current_block_type}( ${params}, #component );
${if_name}${name}.create();
${if_name}${name}.${mountOrIntro}( ${parentNode}, ${anchor} );
`;
if (dynamic) {
block.builders.update.addBlock(deindent`
if ( ${current_block} === ( ${current_block} = ${get_block}( ${params} ) ) && ${name} ) {
if ( ${current_block_type} === ( ${current_block_type} = ${select_block_type}( ${params} ) ) && ${name} ) {
${name}.update( changed, ${params} );
} else {
${changeBlock}
@ -280,7 +282,7 @@ function compound(
`);
} else {
block.builders.update.addBlock(deindent`
if ( ${current_block} !== ( ${current_block} = ${get_block}( ${params} ) ) ) {
if ( ${current_block_type} !== ( ${current_block_type} = ${select_block_type}( ${params} ) ) ) {
${changeBlock}
}
`);
@ -302,17 +304,17 @@ function compoundWithOutros(
dynamic,
{ name, anchor, params, hasElse }
) {
const get_block = block.getUniqueName(`get_block`);
const current_block_index = block.getUniqueName(`current_block_index`);
const select_block_type = block.getUniqueName(`select_block_type`);
const current_block_type_index = block.getUniqueName(`current_block_type_index`);
const previous_block_index = block.getUniqueName(`previous_block_index`);
const if_block_creators = block.getUniqueName(`if_block_creators`);
const if_blocks = block.getUniqueName(`if_blocks`);
const if_current_block_index = hasElse
const if_current_block_type_index = hasElse
? ''
: `if ( ~${current_block_index} ) `;
: `if ( ~${current_block_type_index} ) `;
block.addVariable(current_block_index);
block.addVariable(current_block_type_index);
block.addVariable(name);
block.builders.init.addBlock(deindent`
@ -322,7 +324,7 @@ function compoundWithOutros(
var ${if_blocks} = [];
function ${get_block} ( ${params} ) {
function ${select_block_type} ( ${params} ) {
${branches
.map(({ condition, block }, i) => {
return `${condition ? `if ( ${condition} ) ` : ''}return ${block
@ -335,13 +337,13 @@ function compoundWithOutros(
if (hasElse) {
block.builders.init.addBlock(deindent`
${current_block_index} = ${get_block}( ${params} );
${name} = ${if_blocks}[ ${current_block_index} ] = ${if_block_creators}[ ${current_block_index} ]( ${params}, #component );
${current_block_type_index} = ${select_block_type}( ${params} );
${name} = ${if_blocks}[ ${current_block_type_index} ] = ${if_block_creators}[ ${current_block_type_index} ]( ${params}, #component );
`);
} else {
block.builders.init.addBlock(deindent`
if ( ~( ${current_block_index} = ${get_block}( ${params} ) ) ) {
${name} = ${if_blocks}[ ${current_block_index} ] = ${if_block_creators}[ ${current_block_index} ]( ${params}, #component );
if ( ~( ${current_block_type_index} = ${select_block_type}( ${params} ) ) ) {
${name} = ${if_blocks}[ ${current_block_type_index} ] = ${if_block_creators}[ ${current_block_type_index} ]( ${params}, #component );
}
`);
}
@ -352,7 +354,7 @@ function compoundWithOutros(
const anchorNode = state.parentNode ? 'null' : 'anchor';
block.builders.mount.addLine(
`${if_current_block_index}${if_blocks}[ ${current_block_index} ].${mountOrIntro}( ${targetNode}, ${anchorNode} );`
`${if_current_block_type_index}${if_blocks}[ ${current_block_type_index} ].${mountOrIntro}( ${targetNode}, ${anchorNode} );`
);
const parentNode = state.parentNode || `${anchor}.parentNode`;
@ -366,9 +368,9 @@ function compoundWithOutros(
`;
const createNewBlock = deindent`
${name} = ${if_blocks}[ ${current_block_index} ];
${name} = ${if_blocks}[ ${current_block_type_index} ];
if ( !${name} ) {
${name} = ${if_blocks}[ ${current_block_index} ] = ${if_block_creators}[ ${current_block_index} ]( ${params}, #component );
${name} = ${if_blocks}[ ${current_block_type_index} ] = ${if_block_creators}[ ${current_block_type_index} ]( ${params}, #component );
${name}.create();
}
${name}.${mountOrIntro}( ${parentNode}, ${anchor} );
@ -385,7 +387,7 @@ function compoundWithOutros(
${destroyOldBlock}
}
if ( ~${current_block_index} ) {
if ( ~${current_block_type_index} ) {
${createNewBlock}
} else {
${name} = null;
@ -394,28 +396,28 @@ function compoundWithOutros(
if (dynamic) {
block.builders.update.addBlock(deindent`
var ${previous_block_index} = ${current_block_index};
${current_block_index} = ${get_block}( ${params} );
if ( ${current_block_index} === ${previous_block_index} ) {
${if_current_block_index}${if_blocks}[ ${current_block_index} ].update( changed, ${params} );
var ${previous_block_index} = ${current_block_type_index};
${current_block_type_index} = ${select_block_type}( ${params} );
if ( ${current_block_type_index} === ${previous_block_index} ) {
${if_current_block_type_index}${if_blocks}[ ${current_block_type_index} ].update( changed, ${params} );
} else {
${changeBlock}
}
`);
} else {
block.builders.update.addBlock(deindent`
var ${previous_block_index} = ${current_block_index};
${current_block_index} = ${get_block}( ${params} );
if ( ${current_block_index} !== ${previous_block_index} ) {
var ${previous_block_index} = ${current_block_type_index};
${current_block_type_index} = ${select_block_type}( ${params} );
if ( ${current_block_type_index} !== ${previous_block_index} ) {
${changeBlock}
}
`);
}
block.builders.destroy.addLine(deindent`
${if_current_block_index}{
${if_blocks}[ ${current_block_index} ].unmount();
${if_blocks}[ ${current_block_index} ].destroy();
${if_current_block_type_index}{
${if_blocks}[ ${current_block_type_index} ].unmount();
${if_blocks}[ ${current_block_type_index} ].destroy();
}
`);
}

18
test/js/samples/if-block-no-update/expected-bundle.js
Unescape View File

@ -138,13 +138,8 @@ var proto = {
function create_main_fragment ( state, component ) {
var if_block_anchor;
function get_block ( state ) {
if ( state.foo ) return create_if_block;
return create_if_block_1;
}
var current_block = get_block( state );
var if_block = current_block( state, component );
var current_block_type = select_block_type( state );
var if_block = current_block_type( state, component );
return {
create: function () {
@ -158,10 +153,10 @@ function create_main_fragment ( state, component ) {
},
update: function ( changed, state ) {
if ( current_block !== ( current_block = get_block( state ) ) ) {
if ( current_block_type !== ( current_block_type = select_block_type( state ) ) ) {
if_block.unmount();
if_block.destroy();
if_block = current_block( state, component );
if_block = current_block_type( state, component );
if_block.create();
if_block.mount( if_block_anchor.parentNode, if_block_anchor );
}
@ -222,6 +217,11 @@ function create_if_block_1 ( state, component ) {
};
}
function select_block_type ( state ) {
if ( state.foo ) return create_if_block;
return create_if_block_1;
}
function SvelteComponent ( options ) {
options = options || {};
this._state = options.data || {};

18
test/js/samples/if-block-no-update/expected.js
Unescape View File

@ -3,13 +3,8 @@ import { appendNode, assign, createComment, createElement, createText, detachNod
function create_main_fragment ( state, component ) {
var if_block_anchor;
function get_block ( state ) {
if ( state.foo ) return create_if_block;
return create_if_block_1;
}
var current_block = get_block( state );
var if_block = current_block( state, component );
var current_block_type = select_block_type( state );
var if_block = current_block_type( state, component );
return {
create: function () {
@ -23,10 +18,10 @@ function create_main_fragment ( state, component ) {
},
update: function ( changed, state ) {
if ( current_block !== ( current_block = get_block( state ) ) ) {
if ( current_block_type !== ( current_block_type = select_block_type( state ) ) ) {
if_block.unmount();
if_block.destroy();
if_block = current_block( state, component );
if_block = current_block_type( state, component );
if_block.create();
if_block.mount( if_block_anchor.parentNode, if_block_anchor );
}
@ -87,6 +82,11 @@ function create_if_block_1 ( state, component ) {
};
}
function select_block_type ( state ) {
if ( state.foo ) return create_if_block;
return create_if_block_1;
}
function SvelteComponent ( options ) {
options = options || {};
this._state = options.data || {};

Write Preview
Loading…
Cancel
Save