jQuery-Logo

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:

1 | Melzmann schrieb am 03.12.2008 um 23:39
Gravatar dieses Kommentators

Wenn du als Kompressionsmethode “Packed” nimmst, kommst du immerhin auf 27.71 Kb

Grüße,
Melzmann

2 | macx schrieb am 04.12.2008 um 09:07
Gravatar dieses Kommentators

Bei der UI kannst du doch die einzelnen Pakete und Effekte auswählen, die du haben möchtest. Ist das inzwischen anders?

3 | Ingo schrieb am 04.12.2008 um 10:22
Gravatar dieses Kommentators

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.

4 | hike schrieb am 04.12.2008 um 11:36
Gravatar dieses Kommentators

hast du mal nyromodal probiert? gut anpassbar. nutze ich und hat gepacked knapp 15kb.
http://nyromodal.nyrodev.com/

5 | Way schrieb am 10.03.2009 um 00:08
Gravatar dieses Kommentators

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 ;)

6 | Alex schrieb am 04.05.2009 um 11:00
Gravatar dieses Kommentators

Manche Programme sind halt von anfang an zum scheitern verurteilt.

7 | Sebastian Starke schrieb am 20.08.2009 um 12:08
Gravatar dieses Kommentators

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.

8 | SMut schrieb am 14.02.2010 um 22:44
Gravatar dieses Kommentators

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?

9 | Steffen schrieb am 11.04.2010 um 20:36
Gravatar dieses Kommentators

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.

10 | Marcus schrieb am 20.09.2010 um 19:46
Gravatar dieses Kommentators

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 .

11 | Erik schrieb am 21.09.2010 um 20:33
Gravatar dieses Kommentators

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.



Blogsuche

RSS-Feeds

Plaste & Plastik

plasteundplastik.de - Das Geocaching-Weblog

Die Kategorien


Netz-Fundstücke


Meta / Propaganda