1

スピードとパフォーマンス

Angular 2 は Angular 1 よりも大幅に高速化されており、サーバー側のプリレンダリングによる高速な初期ロード、高速な起動のためのオフライン コンパイル、スムーズな仮想スクロールと迅速なビュー遷移のための超高速の変更検出とビュー キャッシュがサポートされています。

機能は素晴らしいように見えますが、通常の要件は、 から に移動するときにListComponentをキャッシュしたままにし、 から に戻るときに を再ViewComponentレンダリングする必要がないことです (多くの場合、ページ 2、3 などから AJAX データを取得します。データをサービスに保持し、クリックして戻ったときに保存できることを知っていますが、データを再レンダリングします. キャッシュする方が良い方法だと本当に思います.ListComponentViewComponentListComponentListComponentscrollPosition

を実装CanReuseしましたが、機能しません。 の間を移動する場合にのみ機能しViewComponentsます。ですから、ListComponenttoViewComponentキャッシングがどのように機能するかを知りたいのです。

4

1 に答える 1

1

ProtoViewRefクラスを使用します。

ProtoView は、テンプレートのコンパイルの結果であるプロトタイプのビューであり、コンパイルされたテンプレートに基づいてこのビューのインスタンスを効率的に作成するために Angular によって使用されます。

ほとんどの ProtoView は Angular によって内部的に作成および使用されるため、低レベルの Compiler API を介して自分でコンポーネントをコンパイルする高度なユースケースを除いて、それらについて知る必要はありません。

例

このテンプレートを考えると：

Count: {{items.length}}
  <ul>
    <li *ngFor="var item of items">{{item}}</li>
  </ul>

Angular はテンプレートを desugar し、2 つの ProtoView にコンパイルします。

  • 外側の ProtoView:

    Count: {{items.length}}
<ul>
  <template ngFor var-item [ngForOf]="items"></template>
</ul>

  • 内側の ProtoView:

    <li>{{item}}</li>

元のテンプレートが 2 つの別個の ProtoView に分割されていることに注意してください。

参考文献

于 2016-01-14T06:45:04.517 に答える