Hauptmenü

Untermenü

Gedanken - JavaScript Frameworks

1. Wer, wie, was?

Nun, über eine genaue Definition streiten sich selbst die Informatiker immer noch. Im Großen und Ganzen handelt es sich um vorgegebene Bausteine, mit denen man dann etwas bauen kann. Zum Beispiel eine Anwendung. Bei JavaScript geht es dabei primär um die DOM-Manipulation, gepaart mit entsprechenden Animationen. Darüber hinaus existieren noch reine "Effekt"-Frameworks, die wiederum auf andere aufbauen. Und mit einigen kann man sogar "richtig" objektorientiert programmieren, so wie man es aus vernünftigen Sprachen gewöhnt ist. Die bekanntesten unter ihnen sind.

2. Wieso, weshalb, warum?

Solche Frameworks erleichtern dem geplagten JavaScript-Entwickler die Arbeit ganz gewaltig. So werden in (fast) allen Fällen Browserinkompatibilitäten vorab schon abgefangen und man muss sich keine Gedanken mehr darüber machen, ob nun Browser XY (ratet mal wer) damit klar kommt.

Auch die (meistens) integrierten Effekte sparen uns eine Menge Programmieraufwand und viel Nerven. Wer so was mal händisch erledigt hat, weiß wovon ich rede. Alles in allem sind JavaScript-Frameworks eine gaaaaanz tolle Sache, wenn es da nicht ein Problem gäbe. Den Entwickler!

3. Wann, wenn wann, wann dann?

So, was ich jetzt sage, basiert auf leidvollen Erfahrungen aus meinem Lieblingsforum. Denn meiner Meinung nach haben etwa 70 - 80% der Nutzer von JavaScript-Frameworks keine Ahnung vom Tuten und Blasen. Die benutzen diese Frameworks, weil sie entweder keine Lust haben, sich mit JavaScript auseinander zu setzen oder weil das alles so einfach geht, ohne dass man programmieren kann.

Worst-case

Durch mein Tracking-Programm wurde ich auf ein Forum aufmerksam gemacht, wo es (leider) einen Extremfall in Punkto JavaScript-Frameworks gab. Da hatte jemand für einen Kunden etwas gebastelt und der war wohl ziemlich angetan. Leider wünschte der sich noch einen Spezialeffekt für eine bestimmte Funktionalität.

Leider gab es in diesem Framework (war jQuery, so weit ich mich erinnern kann) den besagten Effekt nicht. Also wurde noch schwuppdiwupp Script.aculo.us eingebaut, weil es den da gab. Aber!. Böse Überraschung! Denn jQuery und Prototype sind bei normaler Verwendung zueinander inkompatibel! Warum Prototype? Ganz einfach, weil Script.aculo.us darauf basiert.

Was hat also dieser Vollhonk gemacht? Anstatt sich mal vernünftig mit JavaScript auseinander zu setzen, hat der sich doch tatsächlich einen Wolf nach einen weiteren(!) Framework gesucht, um beide unter einen Hut zu bringen. Und wohl auch was gefunden. Mit dem Ergebnis, dass der drei Frameworks im Einsatz hatte, die zusammen grottenlahm waren, und das für einen pisseligen Effekt, den ich in knapp zwei Stunden nachprogrammiert hatte. Er hat dafür wohl zwei Tage gebraucht.

Darum

Benutzt diese Frameworks wirklich erst dann, wenn ihr zumindest ziemlich gut in JavaScript seid. Denn über eines müsst ihr euch im Klaren sein. Gerade was Effekte angeht, so decken sie nicht alle Möglichkeiten ab. Und dann muss man notfalls auch mal selber Hand anlegen, vulgo das selber programmieren.

4. Eins und eins sind

So, und damit ihr nach meinen Tiraden auch noch ein klein wenig lernt, zeige ich euch mal, wie man Prototype und jQuery parallel nutzen kann. Sonst wäre dieses Elaborat ein wenig überflüssig. Zunächst mal gibt es bei beiden Frameworks diese $-Notation.


// Prototype
document.observe ('dom:loaded', function () 
{
  $('meineKlasse').each ( 
    function(bla) {
      ...
  });    
});
// jQuery
$("#element").click
(
  function(event)
  {
    $("form").slideDown();
  }
);

Leider

... würde es an dieser Stelle fürchterlich knallen, da sich beide Frameworks wegen der gleichen Notation in die Quere kommen. Allerdings gibt es bei jQuery die Möglichkeit, das Framework in einen eigenen "Namespace" zu legen. Dazu gibt es mehrere Möglichkeiten, von denen ich mal zwei vorstelle.


var $j jQuery.noConflict();
$j("#element").click
(
  function(event)
  {
    $j("form").slideDown();
  }
);
// Oder
jQuery.noConflict();
jQuery("#element").click
(
  function(event)
  {
    $("form").slideDown();
  }
);

Das soll übrigens auch mit MooTools funktionieren, aber getestet habe ich das noch nicht. Was die anderen Frameworks angeht, probiert es mal aus. Aber vorher lernt ihr vernünftig JavaScript!

weiter zum nächsten Abschnitt