webentwicklung-frage-antwort-db.com.de

ng build -prod vs. ng build --prod --build-optimizer = true

Mein Angular-Projekt ist @ Angular4.3.3 

ng Build -Prod

Es dauert 77 Sekunden, um einen Build zu erstellen

ng build --prod --build-optimizer = true

Es dauert 190 Sekunden, um einen Build zu erstellen. Kein Hersteller-Chunk, weniger in der Größe (jedoch nicht in der Größe).

Chunk-Unterschiede im Konsolenbild:  Difference between those two build

Ich lese Bundling & Tree-Shaking , bekomme aber immer noch nicht den klaren Unterschied zwischen Builds, die mit diesen Befehlen erstellt wurden. 

Warum gibt es diese zwei verschiedenen Möglichkeiten und was ist der Unterschied in der Leistung oder auf andere Weise?

javascriptangularbuildangular-cli
9
Lahar Shah
--build-optimizer and --vendor-chunk

"Wenn Sie Build Optimizer verwenden, wird der Herstellerblock standardmäßig deaktiviert. Sie können dies mit --vendor-chunk = true überschreiben.

Die Gesamtpaketgrößen mit Build Optimizer sind geringer, wenn es keinen separaten Herstellerblock gibt, da der Herstellercode in demselben Block wie der App-Code vorhanden ist, wodurch Uglify mehr nicht verwendeten Code entfernen kann. "

siehe: https://github.com/angular/angular-cli/wiki/build

2
suprandr

Vor allem, warum ist vendor chunk überhaupt nützlich?

vendor.js ist während der Entwicklung am nützlichsten, da Sie Ihren Code viel häufiger aktualisieren, als Sie ein neues Framework herunterladen oder npm-Pakete aktualisieren.

Daher die Kompilierungszeit ist während der Entwicklung bei aktiviertem Vendor Chunk schneller.

Warum ist --vendor-chunk sogar eine Option? Dies ist aus dem Kopf, aber:

  • Wenn Ihre App viele Benutzer in einer langsamen Verbindung hat und Sie sie häufig aktualisieren, kann es vorteilhaft sein, einen größeren Vendor-Chunk zu haben, der länger unverändert bleibt. Wenn Sie Ihre App aktualisieren, werden die Blöcke kleiner. Dadurch erhalten Sie keine vollständig optimierte (baumgeschüttelte) App, aber unter bestimmten Umständen kann dies hilfreich sein. [Dies setzt voraus, dass Sie Fingerabdrücke verwenden, bei denen der Dateiname buchstäblich eine Prüfsumme/ein Hash des Inhalts der Datei ist. Wenn er sich also nicht ändert, kann die Datei zwischengespeichert werden.]
  • In seltenen Fällen kann es in Ihrem Code zu subtilen Fehlern kommen, die nur sichtbar werden, wenn der Code auf bestimmte Weise minimiert wird. Dies kann darauf zurückzuführen sein, dass ein Methoden-/Klassenname verwendet wird, der "optimiert" wird. Daher müssen Sie möglicherweise Vendor Chunk in der Produktion aktivieren, wenn Sie einen solchen Fehler haben (während Sie ihn beheben).
  • Aktivieren Sie Vendor Chunk absichtlich, um das Laden Ihrer App zu verlangsamen - und teilen Sie Ihrem Chef dann mit, dass Sie spät dran sind, um sie zu optimieren - und deaktivieren Sie sie ;-)
  • Warum nicht? Die Leute spielen gerne!
1
Simon_Weaver