cargdev/angular
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(ivy): queries should not rely on LNode (#25415)

Browse Source 
PR Close #25415
This commit is contained in:
Kara Erickson
2018-08-09 10:00:07 -07:00
committed by Ben Lesh
parent 209cc7e1b0
commit 2b128a47b9
8 changed files with 384 additions and 202 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
packages/core/src/render3/di.ts
View File

@ -584,15 +584,10 @@ export function getOrCreateContainerRef(di: LInjector): viewEngine.ViewContainer
const hostParent = getParentLNode(vcRefHost) !;
const lContainer = createLContainer(hostParent, vcRefHost.view, true);
const comment = vcRefHost.view[RENDERER].createComment(ngDevMode ? 'container' : '');
const lContainerNode: LContainerNode = createLNodeObject(
TNodeType.Container, vcRefHost.view, hostParent, comment, lContainer, null);
const lContainerNode: LContainerNode =
createLNodeObject(TNodeType.Container, vcRefHost.view, hostParent, comment, lContainer);
appendChild(hostParent, comment, vcRefHost.view);
if (vcRefHost.queries) {
lContainerNode.queries = vcRefHost.queries.container();
}
const hostTNode = vcRefHost.tNode as TElementNode | TContainerNode;
if (!hostTNode.dynamicContainerNode) {
hostTNode.dynamicContainerNode =

58
packages/core/src/render3/instructions.ts
View File

@ -175,12 +175,18 @@ let currentQueries: LQueries|null;
* - when creating content queries (inb this previousOrParentNode points to a node on which we
* create content queries).
*/
export function getCurrentQueries(QueryType: {new (): LQueries}): LQueries {
// top level variables should not be exported for performance reasons (PERF_NOTES.md)
return currentQueries ||
(currentQueries =
(previousOrParentNode.queries && previousOrParentNode.queries.clone() ||
new QueryType()));
export function getOrCreateCurrentQueries(
QueryType: {new (parent: null, shallow: null, deep: null): LQueries}): LQueries {
const tNode = previousOrParentNode.tNode;
// if this is the first content query on a node, any existing LQueries needs to be cloned
// in subsequent template passes, the cloning occurs before directive instantiation.
if (previousOrParentNode.data !== viewData && !isContentQueryHost(tNode)) {
currentQueries && (currentQueries = currentQueries.clone());
tNode.flags |= TNodeFlags.hasContentQuery;
}
return currentQueries || (currentQueries = new QueryType(null, null, null));
}
/**
@ -392,14 +398,13 @@ export function createLViewData<T>(
*/
export function createLNodeObject(
type: TNodeType, currentView: LViewData, parent: LNode | null,
native: RText | RElement | RComment | null, state: any,
queries: LQueries | null): LElementNode&LTextNode&LViewNode&LContainerNode&LProjectionNode {
native: RText | RElement | RComment | null,
state: any): LElementNode&LTextNode&LViewNode&LContainerNode&LProjectionNode {
return {
native: native as any,
view: currentView,
nodeInjector: parent ? parent.nodeInjector : null,
data: state,
queries: queries,
tNode: null !,
dynamicLContainerNode: null
};
@ -442,12 +447,9 @@ export function createLNode(
// so it's only set if the view is the same.
const tParent =
parent && parent.view === viewData ? parent.tNode as TElementNode | TContainerNode : null;
let queries =
(isParent ? currentQueries : previousOrParentNode && previousOrParentNode.queries) ||
parent && parent.queries && parent.queries.child();
const isState = state != null;
const node =
createLNodeObject(type, viewData, parent, native, isState ? state as any : null, queries);
const node = createLNodeObject(type, viewData, parent, native, isState ? state as any : null);
if (index === -1 || type === TNodeType.View) {
// View nodes are not stored in data because they can be added / removed at runtime (which
@ -477,7 +479,6 @@ export function createLNode(
// Now link ourselves into the tree.
if (isParent) {
currentQueries = null;
if (previousOrParentNode.tNode.child == null && previousOrParentNode.view === viewData ||
previousOrParentNode.tNode.type === TNodeType.View) {
// We are in the same view, which means we are adding content node to the parent View.
@ -747,8 +748,9 @@ export function elementContainerEnd(): void {
}
ngDevMode && assertNodeType(previousOrParentNode, TNodeType.ElementContainer);
const queries = previousOrParentNode.queries;
queries && queries.addNode(previousOrParentNode);
currentQueries && (currentQueries = currentQueries.addNode(previousOrParentNode));
queueLifecycleHooks(previousOrParentNode.tNode.flags, tView);
}
@ -907,6 +909,10 @@ export function initChangeDetectorIfExisting(
}
}
export function isContentQueryHost(tNode: TNode): boolean {
return (tNode.flags & TNodeFlags.hasContentQuery) !== 0;
}
export function isComponent(tNode: TNode): boolean {
return (tNode.flags & TNodeFlags.isComponent) === TNodeFlags.isComponent;
}
@ -915,9 +921,16 @@ export function isComponent(tNode: TNode): boolean {
* This function instantiates the given directives.
*/
function instantiateDirectivesDirectly() {
ngDevMode && assertEqual(
firstTemplatePass, false,
`Directives should only be instantiated directly after first template pass`);
const tNode = previousOrParentNode.tNode;
const count = tNode.flags & TNodeFlags.DirectiveCountMask;
if (isContentQueryHost(tNode) && currentQueries) {
currentQueries = currentQueries.clone();
}
if (count > 0) {
const start = tNode.flags >> TNodeFlags.DirectiveStartingIndexShift;
const end = start + count;
@ -1233,8 +1246,7 @@ export function elementEnd(): void {
previousOrParentNode = getParentLNode(previousOrParentNode) as LElementNode;
}
ngDevMode && assertNodeType(previousOrParentNode, TNodeType.Element);
const queries = previousOrParentNode.queries;
queries && queries.addNode(previousOrParentNode);
currentQueries && (currentQueries = currentQueries.addNode(previousOrParentNode));
queueLifecycleHooks(previousOrParentNode.tNode.flags, tView);
currentElementNode = null;
}
@ -1853,17 +1865,17 @@ export function container(
// because views can be removed and re-inserted.
addToViewTree(viewData, index + HEADER_OFFSET, node.data);
const queries = node.queries;
if (queries) {
if (currentQueries) {
// prepare place for matching nodes from views inserted into a given container
lContainer[QUERIES] = queries.container();
lContainer[QUERIES] = currentQueries.container();
}
createDirectivesAndLocals(localRefs);
isParent = false;
ngDevMode && assertNodeType(previousOrParentNode, TNodeType.Container);
queries && queries.addNode(node); // check if a given container node matches
// check if a given container node matches
currentQueries && (currentQueries = currentQueries.addNode(node));
queueLifecycleHooks(node.tNode.flags, tView);
}

12
packages/core/src/render3/interfaces/node.ts
View File

@ -42,8 +42,11 @@ export const enum TNodeFlags {
/** This bit is set if the node has been projected */
isProjected = 0b00000000000000000010000000000000,
/** This bit is set if the node has any content queries */
hasContentQuery = 0b00000000000000000100000000000000,
/** The index of the first directive on this node is encoded on the most significant bits */
DirectiveStartingIndexShift = 14,
DirectiveStartingIndexShift = 15,
}
/**
@ -89,13 +92,6 @@ export interface LNode {
/** The injector associated with this node. Necessary for DI. */
nodeInjector: LInjector|null;
/**
* Optional set of queries that track query-related events for this node.
*
* If present the node creation/updates are reported to the `LQueries`.
*/
queries: LQueries|null;
/**
* Pointer to the corresponding TNode object, which stores static
* data about this node.

25
packages/core/src/render3/interfaces/query.ts
View File

@ -13,26 +13,27 @@ import {LNode} from './node';
/** Used for tracking queries (e.g. ViewChild, ContentChild). */
export interface LQueries {
/**
* Ask queries to prepare copy of itself. This assures that tracking new queries on child nodes
* The parent LQueries instance.
*
* When there is a content query, a new LQueries instance is created to avoid mutating any
* existing LQueries. After we are done searching content children, the parent property allows
* us to traverse back up to the original LQueries instance to continue to search for matches
* in the main view.
*/
parent: LQueries|null;
/**
* Ask queries to prepare copy of itself. This assures that tracking new queries on content nodes
* doesn't mutate list of queries tracked on a parent node. We will clone LQueries before
* constructing content queries.
*/
clone(): LQueries|null;
/**
* Used to ask queries if those should be cloned to the child element.
*
* For example in the case of deep queries the `child()` returns
* queries for the child node. In case of shallow queries it returns
* `null`.
*/
child(): LQueries|null;
clone(): LQueries;
/**
* Notify `LQueries` that a new `LNode` has been created and needs to be added to query results
* if matching query predicate.
*/
addNode(node: LNode): void;
addNode(node: LNode): LQueries|null;
/**
* Notify `LQueries` that a new LContainer was added to ivy data structures. As a result we need

188
packages/core/src/render3/query.ts
View File

@ -17,7 +17,7 @@ import {getSymbolIterator} from '../util';
import {assertDefined, assertEqual} from './assert';
import {ReadFromInjectorFn, getOrCreateNodeInjectorForNode} from './di';
import {assertPreviousIsParent, getCurrentQueries, store, storeCleanupWithContext} from './instructions';
import {assertPreviousIsParent, getOrCreateCurrentQueries, isContentQueryHost, store, storeCleanupWithContext} from './instructions';
import {DirectiveDefInternal, unusedValueExportToPlacateAjd as unused1} from './interfaces/definition';
import {LInjector, unusedValueExportToPlacateAjd as unused2} from './interfaces/injector';
import {LContainerNode, LElementNode, LNode, TNode, TNodeFlags, unusedValueExportToPlacateAjd as unused3} from './interfaces/node';
@ -86,10 +86,9 @@ export interface LQuery<T> {
}
export class LQueries_ implements LQueries {
shallow: LQuery<any>|null = null;
deep: LQuery<any>|null = null;
constructor(deep?: LQuery<any>) { this.deep = deep == null ? null : deep; }
constructor(
public parent: LQueries_|null, private shallow: LQuery<any>|null,
private deep: LQuery<any>|null) {}
track<T>(
queryList: viewEngine_QueryList<T>, predicate: Type<T>|string[], descend?: boolean,
@ -101,103 +100,124 @@ export class LQueries_ implements LQueries {
}
}
clone(): LQueries|null { return this.deep ? new LQueries_(this.deep) : null; }
child(): LQueries|null {
if (this.deep === null) {
// if we don't have any deep queries then no need to track anything more.
return null;
}
if (this.shallow === null) {
// DeepQuery: We can reuse the current state if the child state would be same as current
// state.
return this;
} else {
// We need to create new state
return new LQueries_(this.deep);
}
}
clone(): LQueries { return new LQueries_(this, null, this.deep); }
container(): LQueries|null {
let result: LQuery<any>|null = null;
let query = this.deep;
const shallowResults = copyQueriesToContainer(this.shallow);
const deepResults = copyQueriesToContainer(this.deep);
while (query) {
const containerValues: any[] = []; // prepare room for views
query.values.push(containerValues);
const clonedQuery: LQuery<any> = {
next: null,
list: query.list,
predicate: query.predicate,
values: containerValues,
containerValues: null
};
clonedQuery.next = result;
result = clonedQuery;
query = query.next;
}
return result ? new LQueries_(result) : null;
return shallowResults || deepResults ? new LQueries_(this, shallowResults, deepResults) : null;
}
createView(): LQueries|null {
let result: LQuery<any>|null = null;
let query = this.deep;
const shallowResults = copyQueriesToView(this.shallow);
const deepResults = copyQueriesToView(this.deep);
while (query) {
const clonedQuery: LQuery<any> = {
next: null,
list: query.list,
predicate: query.predicate,
values: [],
containerValues: query.values
};
clonedQuery.next = result;
result = clonedQuery;
query = query.next;
}
return result ? new LQueries_(result) : null;
return shallowResults || deepResults ? new LQueries_(this, shallowResults, deepResults) : null;
}
insertView(index: number): void {
let query = this.deep;
while (query) {
ngDevMode &&
assertDefined(
query.containerValues, 'View queries need to have a pointer to container values.');
query.containerValues !.splice(index, 0, query.values);
query = query.next;
}
insertView(index, this.shallow);
insertView(index, this.deep);
}
addNode(node: LNode): void {
add(this.shallow, node);
addNode(node: LNode): LQueries|null {
add(this.deep, node);
if (isContentQueryHost(node.tNode)) {
add(this.shallow, node);
if (node.tNode.parent && isContentQueryHost(node.tNode.parent)) {
// if node has a content query and parent also has a content query
// both queries need to check this node for shallow matches
add(this.parent !.shallow, node);
}
return this.parent;
}
isRootNodeOfQuery(node.tNode) && add(this.shallow, node);
return this;
}
removeView(): void {
let query = this.deep;
while (query) {
ngDevMode &&
assertDefined(
query.containerValues, 'View queries need to have a pointer to container values.');
const containerValues = query.containerValues !;
const viewValuesIdx = containerValues.indexOf(query.values);
const removed = containerValues.splice(viewValuesIdx, 1);
// mark a query as dirty only when removed view had matching modes
ngDevMode && assertEqual(removed.length, 1, 'removed.length');
if (removed[0].length) {
query.list.setDirty();
}
query = query.next;
}
removeView(this.shallow);
removeView(this.deep);
}
}
function isRootNodeOfQuery(tNode: TNode) {
return tNode.parent === null || isContentQueryHost(tNode.parent);
}
function copyQueriesToContainer(query: LQuery<any>| null): LQuery<any>|null {
let result: LQuery<any>|null = null;
while (query) {
const containerValues: any[] = []; // prepare room for views
query.values.push(containerValues);
const clonedQuery: LQuery<any> = {
next: result,
list: query.list,
predicate: query.predicate,
values: containerValues,
containerValues: null
};
result = clonedQuery;
query = query.next;
}
return result;
}
function copyQueriesToView(query: LQuery<any>| null): LQuery<any>|null {
let result: LQuery<any>|null = null;
while (query) {
const clonedQuery: LQuery<any> = {
next: result,
list: query.list,
predicate: query.predicate,
values: [],
containerValues: query.values
};
result = clonedQuery;
query = query.next;
}
return result;
}
function insertView(index: number, query: LQuery<any>| null) {
while (query) {
ngDevMode &&
assertDefined(
query.containerValues, 'View queries need to have a pointer to container values.');
query.containerValues !.splice(index, 0, query.values);
query = query.next;
}
}
function removeView(query: LQuery<any>| null) {
while (query) {
ngDevMode &&
assertDefined(
query.containerValues, 'View queries need to have a pointer to container values.');
const containerValues = query.containerValues !;
const viewValuesIdx = containerValues.indexOf(query.values);
const removed = containerValues.splice(viewValuesIdx, 1);
// mark a query as dirty only when removed view had matching modes
ngDevMode && assertEqual(removed.length, 1, 'removed.length');
if (removed[0].length) {
query.list.setDirty();
}
query = query.next;
}
}
/**
* Iterates over local names for a given node and returns directive index
* (or -1 if a local name points to an element).
@ -418,7 +438,7 @@ export function query<T>(
read?: QueryReadType<T>| Type<T>): QueryList<T> {
ngDevMode && assertPreviousIsParent();
const queryList = new QueryList<T>();
const queries = getCurrentQueries(LQueries_);
const queries = getOrCreateCurrentQueries(LQueries_);
queries.track(queryList, predicate, descend, read);
storeCleanupWithContext(null, queryList, queryList.destroy);
if (memoryIndex != null) {