1

J2EEアプリケーション(Spring MVC)にAngular2を使用しています。私は遅延ロードを実装しましたが、最初に読み込むにはさらに時間がかかっていました(約2分!!!)。Angular2アプリケーション初期ロードの問題。 typescript.jsファイルは4.75MBです。

二つの大きなサイズのファイルがロードされてそこに持っている:
typescript.js:4.75メガバイト
compiler.umd.js:0.98メガバイト

そしてtypescript.jsファイルがキャッシュされていませんが。毎回ダウンロードを再ロードします。

マイsystemjs.config.jsファイルは次のとおりです。

System 
     .config({ 
      transpiler : 'ts', 
      typescriptOptions : { 
       "target" : "es5", 
       "module" : "commonjs", 
       "moduleResolution" : "node", 
       "sourceMap" : true, 
       "emitDecoratorMetadata" : true, 
       "experimentalDecorators" : true, 
       "lib" : [ "es2015", "dom" ], 
       "noImplicitAny" : true, 
       "suppressImplicitAnyIndexErrors" : true 
      }, 
      meta : { 
       'typescript' : { 
        "exports" : "ts" 
       } 
      }, 
      paths : { 
       'npm:' : 'uploads/node_modules/' 
      }, 
      map : { 
       'app' : 'app', 
       '@angular/animations' : 'npm:@angular/animations/bundles/animations.umd.js', 
       '@angular/animations/browser' : 'npm:@angular/animations/bundles/animations-browser.umd.js', 
       '@angular/core' : 'npm:@angular/core/bundles/core.umd.js', 
       '@angular/common' : 'npm:@angular/common/bundles/common.umd.js', 
       '@angular/compiler' : 'npm:@angular/compiler/bundles/compiler.umd.js', 
       '@angular/platform-browser' : 'npm:@angular/platform-browser/bundles/platform-browser.umd.js', 
       '@angular/platform-browser/animations' : 'npm:@angular/platform-browser/bundles/platform-browser-animations.umd.js', 
       '@angular/platform-browser-dynamic' : 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js', 
       '@angular/http' : 'npm:@angular/http/bundles/http.umd.js', 
       '@angular/router' : 'npm:@angular/router/bundles/router.umd.js', 
       '@angular/router/upgrade' : 'npm:@angular/router/bundles/router-upgrade.umd.js', 
       '@angular/forms' : 'npm:@angular/forms/bundles/forms.umd.js', 
       '@angular/upgrade' : 'npm:@angular/upgrade/bundles/upgrade.umd.js', 
       '@angular/upgrade/static' : 'npm:@angular/upgrade/bundles/upgrade-static.umd.js', 


       // other libraries using node_modules 
       'rxjs' : 'npm:rxjs', 
       'angular-in-memory-web-api' : 'npm:angular-in-memory-web-api/bundles/in-memory-web-api.umd.js', 
       'ts' : 'npm:plugin-typescript/lib/plugin.js', 
       'typescript' : 'npm:typescript/lib/typescript.js', 
       'angular2-datatable' : 'npm:angular2-datatable', 
       'lodash' : 'npm:lodash/lodash.js', 
       'angular2-datatable-pagination' : 'npm:angular2-datatable-pagination', 
       'jquery' : 'lib/jquery/jquery-3.2.0.min.js', 
       'ngx-pagination' : 'lib/ngxpagination/ngx-pagination.js', 

      }, 
      packages : { 
       app : { 
        defaultExtension : 'ts' 
       }, 
       rxjs : { 
        defaultExtension : 'js' 
       }, 
       'angular2-datatable' : { 
        main : 'index.js', 
        defaultExtension : 'js' 
       } 
      }, 
      "scripts" : [ "lib/jquery/jquery-3.2.0.min.js" ] 
     }); 

は、これらの2つのファイル(typescript.js、compiler.umd.js)のサイズを小さくする方法はありますか?

eコマースアプリケーションです。だから私はこの問題を解決すべきです。この問題の解決策を教えてください。

はあなたが

+0

...、あなたのコードをチェックし、すべての未使用のメソッドをきれいに、輸入する必要があり、:あなたがここに見つけることができるようしかし、いくつかの他のソリューションがあり、それは選択によるものですか?またはあなたのクライアントから尋ねられた何か?キャッシュすれば速くなるかもしれません。 – kazu

+0

お返事ありがとうございます! クライアントがこれを問題として報告しました。キャッシングは私の問題を解決しません。それは2分かけて読み込まれます。 typescript.jsファイルのサイズを減らす方法はありますか? –

答えて

2

私は強くあなたがアンギュラ4プロジェクトにあなたの角度2プロジェクトを更新することをお勧めしますありがとうございました。 Angular 4の特徴の1つは、最大60%小さくすることです。角度2と4は互換性がありますが、typeScriptやrxjsのように壊れてしまいます。この作業には約2〜3時間かかります。

また、Ahead Of Time Compilerを使用してコンパイルすると、速度も少し向上します。

Here is an article to update to angular 4 記事が言うように、次のコマンドを実行することができます。

角度/ compiler- @最新 @角度/コンパイラ@最新@共通/角度@(Windowsの場合)

NPMをインストール最新版 @角形/最新@角@ http //最新@ @角@プラットフォーム@ブラウザ@最新@ @角@プラットフォーム@ブラウザ@動的@最新 @角@プラットフォーム@サーバ@最新@角度/ルーター@最新角度/アニメーション@最新typescriptです@最新--save

(Linux)の

NPM角度/ {普通、コンパイラ、コンパイラ-CLI、コア、フォーム@インストールし、HTTP、プラットフォーム@ブラウザ、プラットフォームブラウザ、プラットフォーム、サーバ、ルータ、アニメーション} @latest typescript @ latest --save

すべてベスト!

+0

ありがとうKeaganFouche –

+0

よろしくお願いします! – KeaganFouche