jQuery UI - Gute Idee, mehr aber auch nicht
03.12.2008 - 21:48 Frameworks, JavaScript 11 Kommentar(e)
Heute erwischte ich mal wieder folgende Situation: Auf unserer Seite sollte beim Aufruf einer bestimmten URL eine Modalbox (Dialogbox ähnlich einer Lightbox) aufklappen in der der User einige Daten korrigieren sollte.
Mit jQuery sollte sowas eigentlich ganz einfach sein, also Core eingebunden und ein vernünftiges Plugin gesucht. Leider konnte keines der angebotenen Plugins genau das was ich wollte. BlockUI z.B. hatte extreme Probleme was die Darstellung in Browsern mit einem “Explorer” im Namen anging, und jqModal kannte meinen Event-Type nicht.
Eigentlich hatte ich ja noch aus früheren Zeiten ein anderes Plugin im Kopf, aber das schien seit geraumer Zeit in die jQuery UI integriert worden zu sein. Also schnell in die UI-Dokumentation geguckt, und da war meine Dialog-Funktion.
Doch beim Blick auf die Dateigröße blieb mir ein wenig die Luft weg. 52Kb wollte das Plugin für seine Dienste haben, zusätzlich zum normalem jQuery-Core.
Mal ehrlich: So schön solch eine Sammlung wie jQueryUI auch ist, so nervig kann sie auch sein wenn man nur einige kleine Funktionen aus ihr braucht. Klar, für fast alles gibt es auch andere Plugins, nur wurden die wirklich guten Plugins alle von jQueryUI importiert, was dafür sorgt das man diese nicht mehr als Plugins vorfindet und alle nur noch auf die UI verweisen.
Ich finde das Plugin-System von jQuery schon super flexibel und einfach einfach, warum mussten nun bei der UI so viele Abhängigkeiten eingegangen werden die dafür sorgen das man jedem Seitenbesucher gleich ein 100KB-Paket an JavaScript-Files zuwerfen muss?
Schön wäre zumindest gewesen, wenn die in die UI eingeflossenen Plugins auch weiterhin separat als Plugin weiterentwickelt worden wären.
Kommentare zum Thema jQuery UI - Gute Idee, mehr aber auch nicht:
Wenn man auf Draggable und Resizable verzichten kann (die werden in der Dialog-Doku ja auch als optional angezeigt), kommt man auf 25,76 KB bzw. 9 KB gepackt. Einfach beim Download-Builder abwählen.
Wie wärs wenn du einfach mal das custom-Paket komplett downloadest und dann im development-bundle -> ui einfach dir das Paket raussuchst, was du brauchst, in deinem Fall also ui.dialog.js. Das jagste dann noch durch nen packer und schwupps biste bei smarten 6,5 KB ;)
Manche Programme sind halt von anfang an zum scheitern verurteilt.
Javascript wird doch default-mäßig im Browser nach dem ersten Aufruf gecached oder nicht? Das wird doch nicht jedes Mal vom Server geladen (ebenso CSS-Dateien, etc.). Wenn ich mich irre, dann gerne Feedback.
Die Antworten der meisten Benutzer sind ja schon richtig, packen heißt das Zauberwort, bzw. im Builder gleich nur das Auswählen, was nötig ist. Wenn man nun noch einen gescheiten Webserver (Apache oder Lighttpd) benutzt kann man auch diesen benutzen um gepackte Seiten an den Browser auszuliefern.
Dann wäre da auch noch das Browsercaching, man könnte ja auch eine Startseite bauen, in der zunächst einmal der Content als simple HTML mit ein bisschen CSS angezeigt wird und das JavaScript schon einmal (für die weitere Benutzung der folgenden Seiten) geladen und gecached wird.
Schon sind die angeblich negativen Aspekte nicht mehr so schlimm.
Viel übler wird es z.B. wenn man Geotagging mit Google benutzt, die API ist schon viel umfangreicher – macht aber nichts, denn wer hat nicht schon einmal maps.google benutzt, hm?
Ich hatte ähnliche Probleme wie der Author des Artikels. Hinzu kommt meistens noch das die bisher angebotenen Plugin-Lösungen nur einen Teil von dem können was man braucht. Mittlerweile habe ich selbst ein PlugIn (http://code.google.com/p/jquery-modalbox-plugin) geschrieben was die meisten Anwendungsfälle (hidden content, ajax, bilder, direct call) abdeckt und vor allem vom Layout (IE6 wird auch unterstützt) her fast uneingeschränkt anpassbar ist. Das PlugIn unkomprimiert ist 30KB und die minified version 14KB klein.
Da ich selber auch oft und gerne jquery einsetze und ähnliche probleme mit der ui hatte, bin ich wieder zur classic version zurückgekehrt und lebe damit sehr gut, aber das modul von Steffen werde ich mir mal anschauen. grüße aus Berlin und viel erfolg beim weiteren webdesign .
Wer seine eigenen Themes später einmal weiter bearbeiten will, der kann jetzt auf http://jqueryuithemegallery.just-page.de (jQueryUI-ThemeGallery) sein Theme speichern und anderen zur Verfügung stellen. Weiterhin ist es möglich, ein Theme eines anderen Users auf die eigenen Designvorstellungen angepaßt und anschließend gespeichert und/oder heruntergeladen werden. Zukünftig soll es möglich sein, seine Themes auch zu verwalten (Sichtbarkeit für andere User, löschen etc.). Funktioniert derzeit nur im Firefox (weitere Informationen dazu findet man auf der Homepage von jqueryUI).
Kommentar-Feed für diesen Artikel
Kommentarfunktion für diesen Artikel geschlossen.
Textpattern in der aktuellen T3N Die 50 schönsten Iconsets des Jahres 2008
Wenn du als Kompressionsmethode “Packed” nimmst, kommst du immerhin auf 27.71 Kb
Grüße,
Melzmann