2010-11-24 3 views
0

Ich habe eine. NET 3.5 C# -Web-Anwendung entwickelt und möchte einige Leistungsverbesserungen zu machen. Die App hat eine große Anzahl von Javascript-Dateien und CSS-Dateien.Beratung über die Integration von Perf-Optimierung in Web-Anwendung

Im Folgenden sind einige Techniken, die ich bin auf der Suche Umsetzung:

  • Kombination Javascript-Dateien
  • Kombination CSS-Dateien
  • Minimieren Dateien
  • Ändern Sie alle Bilder in den CSS-Dateien zu werden Base64-codierte Strings oder Sprites

Die obigen sind einige Beispiele dafür Ich möchte erreichen, aber meine Fragen sind um, wie ich so etwas tun kann.

Ich habe versucht, eine MSBuild-Aufgabe erstellen, um dies zu tun. Aber die Komplikation, die ich habe, ist wie folgt.

Ich habe eine große Anzahl von Seiten, die eine Reihe von Javascript-Dateien enthalten. Was ich möchte ist, wenn die Anwendung im Debug-Modus ist, verwenden Sie die einzelnen Dateien, wenn im Freigabe-Modus, verwenden Sie die kombinierten Dateien. Der erste Teil der Komplexität wird also die Laufzeitentscheidung sein.

Das nächste Problem ist für die Build-Aufgabe zu wissen, welche Dateien zu kombinieren. Gibt es trotzdem, dass eine Build-Aufgabe das auf jeder Seite verwendete Javascript betrachten und die darauf basierenden Dateien zur Laufzeit kombinieren kann?

Ich habe JavaScript als Beispiel verwendet, aber das gleiche gilt für CSS.

Das andere Problem, das ich habe, ist, dass einige Benutzersteuerelemente auch Javascript haben, so würden sie auch berücksichtigt werden. Ich bin nicht allzu besorgt, wenn das nicht erreicht werden kann.

Endgültiger Schritt wäre zur Laufzeit, um die Build-Nummer oder eine eindeutige Nummer mit den Javascript/CSS-Dateien als Parameter zu geben, um den Cache in neuen Releases ungültig zu machen.

Ich bin mir bewusst, dass meine Frage skizzenhaft ist, aber nur nach einem Rat zu suchen, wenn möglich.

Danke.

Antwort

0

Ich rate von der separaten (debug) vs kombiniert (release); dies schafft zusätzliche Variablen zu kämpfen und Sie werden schließlich von diesem gebissen bekommen - aber nur in der Produktion. Verglichen mit Original ist weniger klar, aber wir haben gesehen Gelegenheiten, wenn die js-Vereinheitlichung es einfach falsch macht; Die Minifier-Version verhält sich anders. Genauso werden einige CSS-Minifier versagen (normalerweise wird ein leeres CSS ausgegeben), wenn es die Eingabe nicht mag (selbst wenn das gleiche CSS in Ihrem Browser funktioniert). Aus diesen Gründen würde ich sagen, dass Sie sich auf die verkleinerte Version konzentrieren sollten, um dies früher zu erkennen.

Andere Gedanken:

  • sicherzustellen, dass Sie gzip Unterstützung/abzulassen
  • sicherzustellen, dass Sie Ablauf Header
  • Bild spriting
  • ein CDN oder ähnliches für statische Inhalte (keine Cookies unterstützen; Ablauf-Header aktiviert; Webserver im statischen Dateimodus - kein CPU-Overhead

(und ja, Sie wollen das w kombinieren mit einem Cachebrecher)

Verwandte Themen