Skip to content

Jam-Session: Professionelles Javascript

Micheal Probst Stuckmann stellt seine Diplomarbeit über den professionellen Einsatz von Javascript vor. Erste Feststellung: Firebug FTW! Zweitens: Spheregazer, eine App, die interaktive Sternkarten zeichnet. Im Background werkeln eine MySql-Datenbank und Java Servlets (JSP). Javascript-Codebase ist 2,5 MB groß - puh. Ein Problem beim Erstellen der "Sternenkugel" als SVG war der Zugriff aufs DOM der SVG und deren Manipulation. Das Killer-Javascript-IDE fehlt noch, aber Aptana funktioniert oft schon sehr gut. Eingesetzte Libs: Prototype, Scriptaculous, Dojo für GUI-Elemente. Mangelhaft ist allerdings oft die Dokumentation der Libraries, und die Entwicklergemeinde ist überschaubar.

Der Code hinter Spheregazer ist weitgehend objektorientiert und nach MVC-Logik aufgebaut und daher gut erweiterbar und übersichtlich. Model und View kommunizieren manchmal aber direkt ohne Umweg über den Controller. Daten werden über JSON übertragen. Ein weiteres Problem ist Memory-Management, das keiner der modernen Browser wirklich von Haus aus unterstützt (außer FF3 jetzt); Speicher von Objekten, die dereferenziert werden, wird in der Regel nämlich nicht mehr freigegeben. Und DOM-Knoten sind sehr speicherintensiv. Frage: Geschäftslogik ins Javascript verlagern? Antwort: Ja, ist prinzipiell gut und schnell; nur ob man das will, d.h. ob man die Prozesse öffentlich machen möchte, muss entschieden werden. Dokumentiert wurde mithilfe von JSDOC, und das Projekt soll auch in Zukunft fortgeführt werden.

jQuery, mootools, Prototype in Serendipity

I've fallen deeply in love with JavaScript libraries like jQuery in the past months. There's so much cool stuff you can do by simply including one ore more .js files to your web site. Be it form validation, GUI-like elements, or just toggling the visibility of block elements. Image overlay effects like Lightbox or Thickbox are based on these libraries, too.

So I decided it was about time we had those libs in Serendipity. We need them to create a more intuitive user experience both in the frontend and the backend. Especially in the backend, where other blog tools like Movable Type 4 look much slicker to me. Anyway, I sat down and hacked together a new plugin for S9y that lets you include jQuery and some of its plugins, mootools (including many extensions in one file), and Prototype in your web site. You can choose between frontend and backend display and select single plugins for jQuery (my favorite lib right now). I would really appreciate it if some S9y users/developers would download and install the plugin and give me feedback on it (forum seems to be down, but there's already a thread on this).

To give you an idea of what could be done with it, I edited the default admin templates, got rid of all the tables and exchanged them for divs. Then I added some tabs to the "edit entry" area with the help of the tabs plugin for jQuery. You can see the result if you open the s9y_tabs.ogg of the desktop session I recorded with Istanbul (in Ogg Theora format, no sound).

"jQuery, mootools, Prototype in Serendipity" vollständig lesen

hCard-GoogleMaps-Mashup

Microformats gain momentum, slowly (maybe more slowly than expected) but steadily. Now Christian Heilmann created a mashup of hCard and Google Maps aptly called hcard2gmap. The javascript parses a web page for hCards with geo information and relays these data to Google Maps where the contacts are being displayed by markers. Great stuff, more applications like this, please! Check out the demo here.