web-dev-qa-db-ja.com

angle2のモジュールが遅延ロードされていることを確認または証明するにはどうすればよいですか？

私がangular2アプリケーションのコードにアクセスでき、遅延ロードされていると思われるモジュールがある場合、コードの調査とは関係なく、そのモジュールをテストして遅延ロードされているかどうかを確認する方法はありますか。必要に応じて、他に方法がない場合は、可能であれば、問題のモジュールにコードを追加してテストすることができます。しかし、どのコードを追加しますか？

angularmodulelazy-loading
10
Reid

Networkタブのchrome開発ツール（ctrl + shift + i） Google Chromeブラウザ。

モジュールが遅延ロードされていない場合は、サイトが最初にロードされたときに[ネットワーク]タブにモジュールの行が表示されます。

遅延ロードが適切に行われている場合は、対応するルートに移動したときにのみ、モジュールの行が表示されます。

お役に立てれば。

4
Jim

背景の概念：まず、遅延読み込みについて明確にする必要があります。遅延読み込みを行うと、基本的に、ネットワークやサーバーからではなく、メモリ（RAM）にモジュールを遅延読み込みします。モジュール（jsスクリプト）は既にブラウザーキャッシュ（HD）に存在します-アプリの読み込み中にネットワークから取得しました。したがって、特定のモジュールを遅延ロードすることにより、ネットワークの最適化ではなく、メモリの最適化に役立ちます。

確認方法：モジュールクラス定義のコンストラクター関数にconsole.logを入れるだけです

import { NgModule } from '@angular/core';

import { LazyComponent } from './lazy.component';
import { LazyService } from './lazy.service';

@NgModule({
  imports: [ ],
  declarations: [ LazyComponent ],
  providers: [LazyService]
})

export class LazyModule {
  constructor() {
    console.log('Lazily Loaded : LazyModule');
  }
}
0
Md Kamrul Hasan Pulok

モジュールがレイジーまたは非レイジー方式でロードされているかどうかを確認できます。 Inspect element（ブラウザでマウスを右クリック）またはCtrl + Shift + Iを実行し、[network]タブに移動して、ネットワーク呼び出しでchunk.jsファイルが表示されることを確認します。はいの場合、モジュールは遅延してロードされています。

0
Harmandeep Singh Kalsi