Hallo zusammen, es ist knapp ein Jahr her das ich euch das MooTools Javascript Framework vorgestellt habe. Seitdem habe ich viel damit gearbeitet und konnte einen guten Eindruck gewinnen wie sich das Framework in der Praxis so macht…

Mehr Prototype als jQuery
Wie letztes Jahr schon kurz angedeutet orientiert sich MooTools definitiv eher an Prototype als an jQuery: Objekte stehen im Vordergrund anstatt der $ Gott-Funktion. Ich persönlich begrüße das sehr! Es ist sehr viel angenehmer zu benutzen, aber vielleicht spricht da auch nur der Entwickler in mir 😉

Klassen und Objekte
Wie gesagt liegen bei MooTools Objekte im Fokus – So ist es z.B. sehr einfach möglich über den „new Class({ /* ... */ })“ Konstruktor eigene Klassen anzulegen, welche mit Hilfe der „Implements“ und „Extends“ Attribute Methoden-Implementation und Vererbung mitbringen. Diese Optionen können einem einiges an arbeit abnehmen: (im Core) mitgeliefert werden derzeit die Helfer-Klassen „Chain“, „Events“ und „Options“.
Generell ist es sehr einfach eigene Klassen zu erstellen und die eigene Applikation mit neuen Features auszustatten!

Auch die Selektor-Funktionen erinnern mehr an Prototype: $ arbeitet wie document.getElementById(); wohingegen $$ mit CSS Selektoren arbeitet.

Events and More
Die Events sind im MooTools Core solide abgebildet und bringen eigentlich alles mit, was man benötigt. Wirklich interessant wird es mit dem More Zusatz: Hier finden wir nützliche „Pseudo“-Events wie z.B.:

// Fire the event after a 500ms pause between two "keydown" events.
$('searchfield').addEvent('keyup:pause(500)', function () {
   // Search action...
});

Oder auch …

// Fire the event, if we press the keys "Ctrl + A"
$('list').addEvent('keydown:keys(control+a)', function () {
   // Select all elements...
});

Es gibt auch ein Pseudo-Event für Element-Delegation (funktioniert ähnlich wie die frühere jQuery „live“ Methode):

// Fire the event, if the "close button" inside "#popup" was clicked.
$('popup').addEvent('click:relay(button.close)', function () {
   // Close the popup.
});

Wir ihr in den Beispielen seht wird in MooTools mit addEvent (und addEvents) anstelle von on gearbeitet. Hier muss man sich ggf. etwas umgewöhnen oder einfach einen kleinen Alias erstellen 😉

Neue Elemente erstellen
Auch hier gibt es die deutliche Ähnlichkeit zu Prototype, mit ein paar nützlichen Unterschieden:

// Prototype syntax:
var el = new Element('button', {
      className: 'btn btn-primary',
      id: 'my-button'
   })
   .update('My Button')
   .on('click', callback)
   .on('mouseover', callback2);

// MooTools syntax:
var el = new Element('button#my-button.btn.btn-primary', {
      text: 'My Button'
      events: {
         click: callback, 
         mouseover: callback2
   }});

Darüber hinaus kann man bei MooTools zum setzen und lesen der meisten Attribute die gleiche Methode verwenden:

// Setting and getting in MooTools:
el.set('html', '<span>My Span</span>');
el.set('class', 'active');

// Or with an object:
el.set({
   events: {click: callback},
   id: 'new-id'
   'data-demo': 'Demo data'
});

el.get('tag'); // "button" (from above)
el.get('id'); // "new-id"
el.get('data-demo'); // "Demo data"
input.get('value'); // The input's value

Plugins
Was die Plugins angeht wird es für die meisten Frameworks sehr schwierig in die Nähe eines jQuery zu kommen – MooTools ist da leider keine Ausnahme. Unter MooTools Forge findet man einige nützliche Plugins, jedoch bin ich selbst schon einige male nicht fündig geworden, sodass ich für meine Zwecke eigene Klassen schreiben musste.

Fazit
Auch wenn ich mich wiederhole: MooTools erinnert stark an Prototype. Und das ist gut, denn ich finde Prototype wirklich großartig! MooTools bringt allerdings ein paar Features mit die wirklich sehr komfortabel und an einigen Stellen auch schlicht besser sind… Außerdem scheint mir die Entwicklung etwas gleichmäßiger voranzuschreiten im Gegensatz zu Prototype (welches letzten Monat übrigens in der Version 1.7.2 veröffentlicht wurde).
Die fehlenden Plugins machen mir persönlich nicht viel aus, ich kann mir aber gut vorstellen das nicht jeder Entwickler lust hat sämtliche Features selbst nachzubilden…

Das Framework macht wirklich Freude und steht, laut dem github Issue Tracker, kurz vor dem nächsten Major Release (v 1.5).

Mit diesen Worten möchte ich mich für Heute von euch verabschieden und eine kreative und erfolgreiche Woche wünschen. Happy Coding!