modules/benchmarks/src/tree/ng2_static/tree.ts - main - githubmirror/angular

modules/benchmarks/src/tree/ng2_static/tree.ts

79 строк2 KB

Matthieu Riegler

feat(core): Set default Component changeDetection strategy to OnPush

25 мар 2026, 02:25

25 мар 2026, 02:25eae8f7e

/**
 * @license
 * Copyright Google LLC All Rights Reserved.
 *
 * Use of this source code is governed by an MIT-style license that can be
 * found in the LICENSE file at https://angular.dev/license
 */

import {
  ChangeDetectionStrategy,
  Component,
  Input,
  NgModule,
  provideZoneChangeDetection,
} from '@angular/core';
import {BrowserModule, DomSanitizer, SafeStyle} from '@angular/platform-browser';

import {emptyTree, getMaxDepth, TreeNode} from '../util';

let trustedEmptyColor: SafeStyle;
let trustedGreyColor: SafeStyle;

function createTreeComponent(level: number, isLeaf: boolean) {
  const nextTreeEl = `tree${level + 1}`;
  let template = `<span [style.backgroundColor]="bgColor"> {{data.value}} </span>`;
  if (!isLeaf) {
    template += `<${nextTreeEl} [data]='data.right'></${nextTreeEl}><${nextTreeEl} [data]='data.left'></${nextTreeEl}>`;
  }

  @Component({
    selector: `tree${level}`,
    template: template,
    standalone: false,
    jit: true,
    changeDetection: ChangeDetectionStrategy.Eager,
  })
  class TreeComponent {
    @Input() data!: TreeNode;
    get bgColor() {
      return this.data.depth % 2 ? trustedEmptyColor : trustedGreyColor;
    }
  }

  return TreeComponent;
}

@Component({
  selector: 'tree',
  template: `<tree0 *ngIf="data.left != null" [data]="data"></tree0>`,
  standalone: false,
  jit: true,
  changeDetection: ChangeDetectionStrategy.Eager,
})
export class RootTreeComponent {
  @Input() data: TreeNode = emptyTree;
}

export function createAppModule(): any {
  const components: any[] = [RootTreeComponent];
  for (let i = 0; i <= getMaxDepth(); i++) {
    components.push(createTreeComponent(i, i === getMaxDepth()));
  }

  @NgModule({
    imports: [BrowserModule],
    bootstrap: [RootTreeComponent],
    declarations: [components],
    providers: [provideZoneChangeDetection()],
    jit: true,
  })
  class AppModule {
    constructor(sanitizer: DomSanitizer) {
      trustedEmptyColor = sanitizer.bypassSecurityTrustStyle('');
      trustedGreyColor = sanitizer.bypassSecurityTrustStyle('grey');
    }
  }

  return AppModule;
}