Warum trennen Sie CSS und JS von Lieferanten von benutzerdefinierten CSS & JS in einem Workflow?

8

Ich habe versucht, die Gründe dafür zu finden, was scheinbar zur Standardübung in Front-End-Workflows der Trennung von JS & amp; CSS von benutzerdefinierten JS & amp; CSS. Ich bin nicht sicher, was die Vorteile über den Nachteil einer zusätzlichen HTTP-Anfrage sind, es scheint sauberer zu sein, nur eine einzige CSS & amp; JS-Datei statt vendor.css, main.css & amp; vendor.js, main.js.

Kann jemand etwas Licht auf dieses Thema werfen?

    
sjm 02.09.2015, 23:33
quelle

4 Antworten

9

Der Anbietercode ändert sich in der Regel weniger häufig als der Code Ihrer Anwendung. Wenn Sie Ihre Anwendung aktualisieren, kann der Herstellercode daher unverändert bleiben und im Browser Ihres Benutzers zwischengespeichert werden.

In dem Szenario, in dem der Herstellercode mit dem Anwendungscode gebündelt ist, muss der Benutzer bei jeder Aktualisierung der Anwendung den gesamten Herstellercode herunterladen.

Die zusätzliche HTTP-Anforderung aus dem separaten Anbieterpaket wird durch die Tatsache gemildert, dass der Benutzer bei jedem Anwendungsupdate weniger Code herunterladen wird.

    
Sunil D. 07.09.2015, 16:14
quelle
4

Ich kann mir zwei Gründe vorstellen.

  1. Hosten Sie den Anbietercode separat von Ihrem Code (z. B. Google Hosted Libraries )
  2. Trennung von Bedenken: Der Anbietercode ist möglicherweise groß und wird unabhängig von Ihrem benutzerdefinierten Code aktualisiert. Die Pflege Ihres Codes in einer separaten Datei vermeidet die Notwendigkeit, Herstellercode in Ihre Quellcodeverwaltung zu integrieren, erleichtert die Navigation in Ihrem Code und erleichtert das Upgrade auf neuen Anbietercode, da Sie sicher sind, dass der Anbietercode nicht optimiert wurde.

Vor allem, weil Sie die Frage mit grunt getaggt haben, sieht der Endbenutzer diese Änderung möglicherweise nie, da Sie während des Builds Hersteller- und Benutzerstile / Skripts zusammenführen können.

Wenn jedoch der Code des Anbieters groß ist und sich selten ändert, erzielen Sie einen Caching-Vorteil, da eine Datei mit selten wechselnden, großen Anbietern von einer kleinen, sich schnell ändernden benutzerdefinierten Codedatei begleitet wird. Bei großen Websites, die kein CDN verwenden (hoffentlich nicht von Ihnen), kann die Auswirkung auffallen.

    
MaxVT 12.09.2015 19:12
quelle
2

Abhängig von Ihrer Situation können Sie damit Ihre Bearbeitungen in der Kaskade reduzieren, sodass Sie die Stile und Verhaltensweisen von Anbietern überschreiben können, ohne ihren Code zu verlieren. Dies ist hilfreich, damit Sie immer eine funktionierende Version (Herstellercode) haben, zu der Sie zurückkehren können. In Situationen wie der Arbeit mit Wordpress ermöglicht das Entwickeln eines untergeordneten Designs, dass das übergeordnete Thema aktualisiert wird, ohne dass Ihre Anpassungen verloren gehen.

    
nowdomiciliary 02.09.2015 23:39
quelle
1

Verschiedene Antworten haben das bereits angesprochen, aber ich werde es sehr spezifisch machen:

  1. Der Anbietercode ändert sich möglicherweise mehr oder weniger häufig als Ihr Code. Ob Verkäufercode ändert sich häufiger, z. für Bugfixes würdest du Ich möchte die neueren Versionen verwenden und eine bessere allgemeine Website haben. Wenn der Herstellercode weniger häufig als Ihr Code ändert, möchten Sie vielleicht um deinen Code zu ändern, ohne Arbeitsmaterial zu berühren.

  2. Der Anbietercode wird häufig auf CDNs gehostet, z. B. Ссылка oder Ссылка Diese sind SCHNELL Wird geladen. Sie ändern sich auch nicht, so dass der Benutzer sich auf Cached verlassen kann Dateien und damit Ihre Website wird schneller geladen.

  3. Im Allgemeinen ist es besser, iterative Änderungen am Code vorzunehmen. Es ist auch einfacher, Code zu verwalten, insbesondere mit Quellcodeverwaltung Dinge verändern sich. Keine Notwendigkeit, große Dateien auszutauschen, wenn dies nicht der Fall ist geändert. Dinge getrennt zu halten macht es einfacher zu machen inkrementelle Änderungen, vor allem dann, wenn sich die beiden Dinge ändern Geschwindigkeiten.

CoderOfTheNight 13.09.2015 20:03
quelle

Tags und Links