Angular2 CLI: Warum Bündelgröße von "--prod" kleiner als "--prod --aot"?

Question

Ich verwende den neuesten eckigen-Cli (Beta-18) für ein Projekt. Ich weiß, dass der CLI noch in sehr frühen Stadien ist, aber ich bin ratlos, warum meine endgültige Bündelgröße tatsächlich kleiner ist ohne AoT.

Als ich ng build --prod laufen, ist es 1,08 mb:

        Asset  Size Chunks    Chunk Names               
    main.53d637ff9422b65418e6.bundle.js 1.08 MB 0, 2 [emitted] main                
styles.01cffb95000fdb84402c.bundle.js  8.9 kB 1, 2 [emitted] styles                
          inline.js 1.45 kB  2 [emitted] inline                
    main.53d637ff9422b65418e6.bundle.map 7.24 MB 0, 2 [emitted] main                
styles.01cffb95000fdb84402c.bundle.map 40.3 kB 1, 2 [emitted] styles                
inline.d41d8cd98f00b204e980.bundle.map 13.5 kB  2 [emitted] inline                
main.53d637ff9422b65418e6.bundle.js.gz  236 kB   [emitted]                  
          index.html 907 bytes   [emitted]                  
        assets/.npmignore 0 bytes   [emitted]                  
          favicon.ico 5.43 kB   [emitted] 

Als ich ng build --prod --aot laufen, es ist 1,26 mb.

        Asset  Size Chunks    Chunk Names               
styles.01cffb95000fdb84402c.bundle.map 40.3 kB 1, 2 [emitted] styles                
    0.688d48f52a362bd543fc.bundle.map 2.94 kB   [emitted]                  
styles.01cffb95000fdb84402c.bundle.js  8.9 kB 1, 2 [emitted] styles                
          inline.js 1.45 kB  2 [emitted] inline                
    main.6490041404a193461c3c.bundle.map 6.81 MB 0, 2 [emitted] main                
    main.6490041404a193461c3c.bundle.js 1.26 MB 0, 2 [emitted] main                
inline.d41d8cd98f00b204e980.bundle.map 13.5 kB  2 [emitted] inline                
main.6490041404a193461c3c.bundle.js.gz  223 kB   [emitted]                  
          index.html 907 bytes   [emitted]                  
        assets/.npmignore 0 bytes   [emitted]                  
          favicon.ico 5.43 kB   [emitted] 

Für TSconfig wie folgt aussieht:

{ 
    "compilerOptions": { 
    "declaration": false, 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "lib": [ 
     "es6", 
     "dom" 
    ], 
    "mapRoot": "./", 
    "module": "es6", 
    "moduleResolution": "node", 
    "outDir": "../dist/out-tsc", 
    "sourceMap": true, 
    "target": "es5", 
    "typeRoots": [ 
     "../node_modules/@types" 
    ] 
    }, 
    "exclude": [ 
    "**/*.spec.ts" 
    ] 
} 

Answer 1

antwortete ich dies auf einem issue on our GitHub, aber hier ist meine Antwort als Referenz:

Wenn Sie bestimmte Bibliotheken verwenden, die (und Freigabe UMD Bundles) nicht AoT unterstützen dies passieren könnte. Der Grund ist, dass wir Komponenten, die reines JavaScript sind, nicht optimieren können. Dies können wir leider nicht auf unserer Seite beheben.

Diese Bibliotheken müssen ES2015-Module freigeben, deren Dekoratoren entfernt wurden und deren Komponenten/Module bereits AoT-kompiliert wurden. Wir arbeiten an Richtlinien für Bibliotheken, um sowohl die JIT- als auch die AoT-Kompilierung zu unterstützen.

Auch manchmal mit einigen Vorlagen die AoT-Größe könnte größer sein als die JIT. Die gezippten Versionen sollten andersherum sein, da die meisten AoT-Inhalte dieselben Aussagen sind, die immer und immer wieder wiederholt werden.

Obwohl das Paket größer ist, sollte die Bootstrap-Zeit deutlich schneller sein.

Answer 2

Die erzeugte Vorlage JavaScript viel größer als die Vorlage selbst ist. Es ist eine Dateigröße vs Ausführungszeit Kompromiss Situation.