Seite Leistung in IE7 mit einer großen Seite

Question

Ok, also schreibe ich eine Failry-Komplex ASP.NET-Seite, die ziemlich viel Javascript im Zusammenhang mit ihm hat. Das Problem ist, die Seite hat viel damit zu tun, aber der Browser verhält sich einfach nicht mehr viel Zeit und Verzögerungen, während das Javascript scheint gut zu funktionieren.

Auf dieser Seite sende ich eine Array-Liste der verfügbaren Elemente für den Benutzer zur Auswahl. Nun, wenn diese Liste zu mehr als 1000 Elementen in der Liste wächst, saugt die Seite nur für das Fehlen von besseren Wörtern. Wenn ich nicht habe, dass viele Elemente von der Seite auszuwählen, gut funktioniert. Ich meine, die Javascript-Leistung ist in Ordnung, aber die Seite ist einfach zu spät. Die Bildlaufleisten auf der Seite sind nur spärlich, es fühlt sich einfach schrecklich an. Natürlich passiert das alles nicht in Chrome oder Firefox.

Um Ihnen ein wenig mehr Perspektive auf das Problem zu geben, hat die Website etwa 150.000 unmi nifizierte Css-Stile für diese Seite, etwa 10.000 Zeilen Code für js einschließlich Frameworks, Steuerelemente und Geschäftsregeln für die Seite, und der Array-Objekttext, der in einem Textdokument gespeichert wird, ist ungefähr 200 KB.

Jede Hilfe in dieser Angelegenheit stark appeciated würde, da dies über meinen fünften Monat Stich ist dies schneller ... auf immer

Answer 1

Natürlich nichts davon geschieht in Chrome oder Firefox.

Der Fluch meiner kleinen Web-App-Entwickler Existenz einmal Dinge werden genial. Es gibt normalerweise keine andere Antwort, als die Seite zu vereinfachen.

Die Konzepte für die Paginierung gelten auch für andere Anwendungsbereiche. Active Directory wird nicht jeden Datensatz in einer einzelnen Liste anzeigen, sobald es groß ist - und es ist eine Desktop-App.

Schneiden Sie es zurück und dann verwenden Sie die Schnittstelle, um Dinge schrittweise zu bekommen (in der Regel durch JSON-Anfragen für mich).

Answer 2

Einer der Yahoo performance rules ist "Reduzieren Sie die Anzahl der DOM-Elemente". Sie sagen das aus einem Grund.

Wenn Sie beginnen, in den Bereich von "Tausenden" von DOM-Elementen zu gelangen, geht IE ziemlich schnell nach unten. Jede Interaktion mit der Seite wird langsam. Die einzige "Lösung" besteht darin, weniger DOM-Elemente zu verwenden.

Zum Beispiel habe ich kürzlich eine Web-App erstellt, die 4 Raster mit 100 Zeilen mit jeweils etwa 10 Spalten enthält, die alle gleichzeitig sichtbar sind. Diese 4000 Zellen machten IE wirklich langsam. Ich löste das, indem ich ein gepuffertes Ansichtsraster verwendete, das nur die sichtbaren Zeilen rendert und die Zeilen außerhalb des sichtbaren Bildlaufbereichs aus dem DOM löscht (mit dem ExtJS-Raster, wenn es Sie interessiert).