Simon Koelsch coding software, using gadgets

9Nov/09Off

Google JavaScript Bibliothek Closure Library

Google realisiert in seinen Webanwendungen das Interface durch intensiven Gebrauch von Javascript. Man denke dabei an Google Mail, Google Maps oder Google Wave. Ein Teil der Werkzeuge die dabei benutzt werden sind jetzt als Closure Tools veröffentlicht worden.

Closure Tools besteht aus den folgenden Teilprojekten:

Der Closure Compiler übersetzt JavaScript Code in eine kompaktere Form. Dadurch werden die Scripte kleiner und damit auch schneller. Es wird toter Code entfernt und nach üblichen Fehler gesucht. Eine Erweiterung für Firebug ist auch verfügbar.

Mit Closure Templates gibt es eine einfache Möglichkeit dynamisch HTML zu generieren. Die Templates sind fertig kompiliert als Java und JavaScript.

In diesem Posting geht es um den dritten Teil des Closure Projekts: Closure Library. Die veröffentlichte Bibliothek enthält eine breite Sammlung von Funktionen und ist kompatibel zu den gängigen Browsern.
Außerdem bringt sie noch ein paar andere nette Konzepte mit.

Abhängigkeiten

Closure Library besitzt ein simples Abhängigkeits-Konzept. Mit goog.provide() wird ein eigener Namensraum für eine Funktion geschaffen. Mit goog.require() ist es dann möglich auf die vorher definierten Funktionen zuzugreifen.
Dabei sind goog.provide() und goog.require() nicht nur als vereinfachte Include Funktionen zu sehen. Mit der Bibliothek kommt ein Python Script welches eine JavaScript Datei analysiert und mit den benötigten Abhängigkeiten ein grosses Script erstellt.
Dieses Script kann bei Bedarf dann mit dem Closure Compiler weiter optimiert werden.

Events

JavaScript sendet bei einer Benutzerinteraktion mit einem DOM-Element ein Event an dieses Element. Zum Beispiel bei einem Klick oder einem Kontakt mit dem Mauszeiger. Auf diese Events lässt sich dann im Programmcode reagieren. Leider sind Events bei jedem Browser ein wenig anderst implementiert. Auf diese Unterschiede müsste man eigentlich bei der Entwicklung achten. Closure umgeht dieses Problem mit einem eigenen Eventmodell. Dieses Modell funktioniert dann mit allen gängigen Browsern gleich.
Es ist auch möglich eigene Eventtypen zu erstellen und zu benutzen.
Die Demo goog.events.MouseWheelHandler zeigt zum Beispiel eine Reaktion auf Events des Mausrads.

Vererbung

Ein rudimentäres Vererbungskonzept wird mit goog.inerhits(child, parent) ermöglicht. Soll eine Klasse von einer anderen abgeleitet werden, muss goog.inerhits(child, parent) eine Refernz auf beide Klassen übergeben werden. Danach sind die vererbeten Funktionen sichtbar. Den Konstruktor der Vaterklasse muss man allerdings noch selbst aufrufen.

Ein Beispielcode aus der Dokumentation:

goog.ui.MenuButton = function(content, opt_menu, opt_renderer, opt_domHelper)
{
  goog.ui.Button.call(this, content, opt_renderer ||
      goog.ui.MenuButtonRenderer.getInstance(), opt_domHelper);
 
  // Menu buttons support the OPENED state.
  this.setSupportedState(goog.ui.Component.State.OPENED, true);
 
  if (opt_menu) {
    this.setMenu(opt_menu);
  }
  this.timer_ = new goog.Timer(500);  // 0.5 sec
};
goog.inherits(goog.ui.MenuButton, goog.ui.Button);

Hier erbt die Komponente MenuButton von Button. Zeile 3 zeigt den Aufruf des Konstruktor der Vaterklasse mit call().

Funktionen

Closure besitzt Funktionen für sehr viele Anwendungsfälle. Allein goog.ui enthält 138 verschiedene Komponenten. Dabei sind einfache Elemente wie ein Benutzerdialog genauso enthalten, wie eine Komponente zur Rechtschreibkorrektur, einer Baumstruktur oder einem kompletten WYSIWYG-Editor.
Es sind Datumsfunktionen vorhanden, einfache Iteratoren, komplexere Datentypen wie Maps und Sets, i18n-Funktionen zur Lokalisierung und einfache Effekte.

Wer sich selbst mit den Möglichkeiten vertraut machen will, dem Empfehle ich die API und die darin enthaltenen Demos.

Die komplette Bibliothek ist über Subversion verfügbar:

svn checkout http://closure-library.googlecode.com/svn/trunk/ closure-library-read-only

Achtung: Es sind hier auch alle Beispiele und Tests enthalten. Aus diesem Grund werden 156 MB heruntergeladen.

Closure Library ist verfügbar unter der Apache License 2.0.

Kommentare (0) Trackbacks (0)

Die Kommentarfunktion ist hier derzeit deaktiviert.

Trackbacks are disabled.