Es gibt verschiedene JavaScript-Frameworks wie jQuery, Dojo, mooTools, Google Web Toolkit(GWT), YUI, etc. Welches davon ist für leistungsstarke Websites geeignet?
Antworten
Zu viele Anzeigen?(Vollständiger Haftungsausschluss: Ich bin ein Dojo-Entwickler und dies ist meine inoffizielle Perspektive).
Alle wichtigen Bibliotheken können in Szenarien mit hoher Last verwendet werden. Dabei gibt es mehrere Dinge zu beachten:
Anfängliche Belastung
Die anfängliche Belastung wirkt sich auf die Reaktionszeit aus: vom Anfordern einer Webseite bis zur Reaktionsfähigkeit und dem Arbeitsmodus. Triviale Dinge zu tun sind:
- mehrere JavaScript-Dateien zusammenfügen (funktioniert auch für CSS-Dateien)
- minimieren und/oder komprimieren Sie Ihr JavaScript
Die Idee ist, weniger zu senden - gut für den Server und gut für den Kunden.
Die weniger triviale Sache, die zu tun ist:
- Ihr Programm so zu strukturieren, dass es auch ohne alle geladenen Module funktioniert
Beispiel für Letzteres: Unterteilen Sie Ihre Module in essentielle (z. B. die Kernlogik) und nicht essentielle (z. B. Helfer: Tooltips, Hinweise, Verifizierer, Hilfseinrichtungen, verschiedene "graduelle Verstärker" usw.). Die Idee ist, dass es häufig Dinge gibt, die für häufige Benutzer nicht wichtig, aber für Gelegenheitsbenutzer nett sind ⇒ sie können verzögert werden.
Wir können wichtige Module zuerst laden und den Rest asynchron laden. Beispiel: Wenn der Benutzer ein Objekt bearbeiten möchte, müssen wir es zuerst anzeigen, danach haben wir mehrere hundert Millisekunden Zeit, um den Rest zu laden: Nachschlagetabellen, Hinweise usw.
Es ist natürlich hilfreich, wenn asynchrones Laden von Modulen von dem von Ihnen verwendeten Framework unterstützt wird. Dojo hat diese Möglichkeit eingebaut.
Verteilen von Dateien
Jeder weiß, dass es aufgrund von Browser-Beschränkungen für die Anzahl der parallelen Downloads von derselben Website vorteilhaft ist, Ressourcen (Bilder, CSS, JavaScript) von verschiedenen Domains zu laden:
- wir können mehr parallel herunterladen, wenn die Leitung des Nutzers genügend Bandbreite hat - heutzutage ist das fast immer der Fall
- wir können Webserver einrichten, die für die Bereitstellung statischer Dateien optimiert sind: großer Festplatten-Cache, kleine Worker, Keep-alive, asynchrones Serving usw.
- Wir können alle unnötigen Funktionen entfernen, die wir nicht brauchen, wenn wir statische Dateien bereitstellen: Sitzungen, Cookies und so weiter.
Eine häufig übersehene Optimierung in JavaScript-Anwendungen ist die Verwendung von CDN :
- Ihre Website kann von der geografischen Verteilung des CDN profitieren (die Dateien können vom nächstgelegenen/schnellsten Server bereitgestellt werden)
- der Benutzer hat möglicherweise benötigte Dateien in seinem Cache, wenn sie von einer anderen Anwendung verwendet wurden
- Zwischen-/Firmen-Caches erhöhen die Wahrscheinlichkeit, dass benötigte Dateien bereits im Cache sind
- Und zu guter Letzt: Es handelt sich um Dateien, die Sie nicht bedienen - denken Sie darüber nach
Auch Dojo unterstützt CDNs seit langem und wird öffentlich von AOL CDN y Google CDN . Letztere führt praktisch alle gängigen JavaScript-Toolkits mit sich. Natürlich können Sie Ihr eigenes CDN und Ihren eigenen CDN- und app-spezifischen Dojo-Build erstellen, wenn Sie das Gefühl haben, dass Sie es brauchen - es ist trivial und gut dokumentiert.
Bandbreite der Kommunikation
Inwiefern kann das für verschiedene Toolkits unterschiedlich sein? XHR ist XHR.
Sie müssen die Last auf Ihren Servern so weit wie möglich reduzieren. Analysieren Sie tous Verkehr und überlegen Sie, wie viel statisches/unveränderliches Material über die Leitung gesendet wird. In der Regel ist zum Beispiel eine Menge HTML über mehrere Seiten hinweg redundant: eine Kopfzeile, eine Fußzeile, ein Menü und so weiter. Müssen Sie wirklich alle diese Elemente jedes Mal übermitteln?
Eine offensichtliche Lösung besteht darin, von statischem HTML + "schrittweisen Erweiterungen" mit JavaScript zu echten "einseitigen" JavaScript-Anwendungen überzugehen. Auch dies ist eine häufig übersehene, aber höchst lohnende Optimierung.
Die Idee klingt einfach, aber in Wirklichkeit ist es nicht so einfach, wie es scheint. Sobald wir von Einzeilern zu Anwendungen übergehen, stellt sich eine Fülle von Fragen, und die größte davon ist die Verpackung: was sind Ihre Komponenten, welche Komponenten werden vom Toolkit bereitgestellt, und wie werden sie verpackt und bereitgestellt.
Dojo bietet Module, gute OOP für allgemeine Klassen, Widgets (eine Kombination aus optionalem HTML und zugehörigem Verhalten) und viele Möglichkeiten, mit ihnen zu arbeiten. Sie können:
- Module bei Bedarf und nicht im Kopf laden
- Module asynchron laden
- alle Abhängigkeiten zwischen den Modulen automatisch zu finden und einen "Build" zu erstellen - eine Datei in einfachen Fällen, oder mehrere, wenn Ihre Anwendung groß ist und mehrere Schichten erfordert
- während des "Builds" kann es alle HTML-Schnipsel für Ihre Widgets einbinden, CSS optimieren und JavaScript minifizieren/komprimieren
- Dojo kann automatisch Widgets in HTML finden und instanziieren und spart so eine Menge an Boilerplate Code
- und vieles, vieles mehr
All diese Funktionen sind bei der Erstellung von Anwendungen auf der Client-Seite sehr hilfreich. Deshalb mag ich Dojo .
Natürlich gibt es noch mehr Möglichkeiten zur Optimierung von Websites mit hoher Last, aber meiner Erfahrung nach sind dies die spezifischsten für JavaScript-Frameworks.
Das ist ganz einfach: alle von ihnen .
Alle Frameworks wurden mit dem Ziel entwickelt, die schnellstmögliche Leistung zu erzielen und den Entwicklern nützliche Funktionen und Werkzeuge zur Verfügung zu stellen. Ihre Wahl sollte sich an Ihren Anforderungen orientieren .
JavaScript wird auf der Client-Seite ausgeführt, so dass die Serverleistung nicht beeinträchtigt wird. Der einzige Unterschied auf der Serverseite ist die Bandbreite, die für die Übertragung der .js
Dateien an den Client.
Ich persönlich mag sehr gerne MooTools weil es meine Anforderungen erfüllt und auch meinen Programmieridealen entspricht. Eine Menge Leute haben jQuery (Ich persönlich mag es nicht, was nicht heißt, dass es nicht toll ist). Die anderen habe ich nicht benutzt.
Aber keiner ist besser als der andere, alles eine Frage des Bedarfs und der persönlichen Vorlieben .
Ich glaube nicht, dass das wirklich einen Unterschied macht. Die Großen scheinen eine Mischung aus Jquery & Prototyp und anderen zu verwenden.
Offen gesagt macht es keinen Unterschied, was Sie für stark besuchte Websites verwenden, da es sich um Client-Technologien handelt. Nachdem die Datei geladen ist, gibt es keinen wirklichen Mehraufwand. Wenn Sie also nur eine einfache Sache machen wollen und mehrere Frameworks dies unterstützen, verwenden Sie dasjenige, das die geringere Dateigröße hat (wenn es wirklich schlecht funktioniert, verwenden Sie natürlich ein anderes!)
Allerdings hostet Google einen Großteil der Frameworks, so dass auch dies kein Problem darstellt. Ich benutze Jquery gehostet von Google und bin sehr zufrieden.
http://code.google.com/apis/ajaxlibs/
Backend und was der Server verwenden sollte, ist eine ganz andere Frage, auf die Sie tausend verschiedene Antworten erhalten werden!
Ich würde Ihnen empfehlen, sich Dojo anzusehen.
Dojo 1.6 ist auch die erste (und einzige) populäre JavaScript-Bibliothek, die erfolgreich mit dem erweiterten Modus des Closure-Compilers verwendet werden kann, mit den massiven Größen-, Leistungs- und Verschleierungsvorteilen, die damit verbunden sind - abgesehen von Googles eigener Closure-Bibliothek.
Mit anderen Worten, ein Programm, das Dojo verwendet, kann zu 100% verschleiert werden - sogar die Bibliothek selbst.
Der kompilierte Code verhält sich genauso wie der Klartextcode, nur dass er viel kleiner ist (im Schnitt 25 % kleiner als Minifier), viel schneller läuft (vor allem auf mobilen Geräten) und sich kaum zurückentwickeln lässt, selbst wenn er einen Beautifier durchlaufen hat, da die gesamte Codebasis (einschließlich der Bibliothek) verschleiert ist.
Code, der nur "minified" ist (z.B. YUI compressor, Uglify), kann nach dem Durchlauf durch einen "beautifier" leicht "reverse-engineered" werden.
Nun - als ein Beispiel Stackoverflow stützt sich auf jQuery (und verwendet die Google Apis Link) - es ist eine der schnellsten und beliebtesten Bibliotheken und nicht nur das, aber ich würde sagen, es ist die einfachste zu bedienen. Welche Art von Verhalten werden Sie auf der Website haben? Es hängt wirklich alles davon ab Ihr Bedürfnisse.
- See previous answers
- Weitere Antworten anzeigen