Event-Handling in AngularJS und ein potentielles Memory Leak

Event-Handling in AngularJS In vielen Sprachen, Frameworks oder APIs gibt es Konstrukte, die dem Observer-Pattern (Beobachter) entsprechen. Ein Listener wird an einem Subjekt registriert und aufgerufen, sobald ein bestimmtes Event (Ereignis) auftritt. Damit das Subjekt den Listener aufrufen kann, muss dieser eine vorgegebene Schnittstelle implementieren. Abgesehen von dieser Schnittstelle besitzt das Subjekt keinerlei Wissen über den Listener, so dass eine recht lose Kopplung zwischen den Objekten besteht. Hierin liegt der Vorteil dieses Entwurfsmusters. In AngularJS wird dieses Konzept umgesetzt, in dem die Scopes die Funktion eines Event-Bus einnehmen. Listener können [...]

2017-01-28T13:52:41+00:00 01.03.2014|Tags: , , , |0 Kommentare

Bildverarbeitung mit der Javascript File API und Data-URLs - im Browser und ohne Server

Vor einiger Zeit habe ich mich mit den Möglichkeiten auseinandergesetzt, Bilddateien ohne Kommunikation mit dem Server mit Javascript zu verarbeiten. Herausgekommen ist ein kleiner Prototyp, den ich hier vorstellen möchte. Idee Der Prototyp stellt mehrere Tabs dar. Im ersten wählt man die Ursprungsbilddatei aus. In den weiteren Tabs wird das transformierte Bild sowie die Data-URL (dazu später mehr) dargestellt. Prototyp in Github und Livedemo Der Sourcecode ist verfügbar unter: https://github.com/bjoerne2/js-image-prototype/ Den Prototypen habe ich auf meinem Webspace deployt: https://www.bjoerne.com/development/js-image-prototype/ Verwendete Bibliotheken Der Prototyp ist mit AngularJS umgesetzt. Damit das ganze [...]

2017-01-28T14:23:26+00:00 25.12.2013|Tags: , , , |0 Kommentare

Wie performant ist jQuery.proxy()?

Immer wieder liest man im Netz, dass der Einsatz von jQuery.proxy() auf die Performance geht von Javascript-Anwendungen geht. Nachdem ich in meinem Artikel zu Javascript und Clean Code den exzessiven Einsatz von jQuery.proxy() quasi propagiert habe, wollte ich wissen, was an dieser Aussage wirklich dran ist. Ich habe ein bisschen mit JSFiddle herumgespielt und wollte mit einem Skript einen allgemeingültigen Vergleich von jQuery.proxy mit einer einfachen anonymen Javascript-Funktion durchführen. Das war mir allerdings nicht möglich. Denn es gibt zu viele Faktoren, die Einfluss nehmen: Anzahl erzeugter Proxies Anzahl von Proxy-Aufrufen [...]

2017-01-28T14:27:39+00:00 13.10.2013|Tags: , , , |0 Kommentare

AngularJS Patterns: Resolver als eigenständige Klasse

Als ich die ersten Schritte mit AngularJS gegangen bin, war ich total geflasht. Die Entwickler von AngularJS haben's einfach drauf, die Konzepte stimmen, alles läuft wie geschmiert. An einer Stelle bin ich aber ins Stocken geraten, teils weil dies nicht gut dokumentiert war und teils, weil das Konzept den Entwickler nicht gut unterstützt. Es geht um die den $routeProvider und die resolve-Eigenschaft. Den Nutzen von resolve stellt John Lindquist in einem Youtube-Video recht gut dar. Mit resolve lässt sich bewirken, dass ein Seitenwechsel in AngularJS erst dann stattfindet, wenn bestimmte [...]

Javascript und Clean Code

Für die Online-Tagebuchplattform monkkee habe ich viel Javascript geschrieben. Beruflich habe ich mehrere Jahre JavaEE-Anwendungen mitentwickelt. Während ich in der Java-Welt eine Begeisterung für Clean Code und das [amazon asin=0132350882&text=gleichnamige Buch von Robert C. Martin] entwickelt habe, war ich in der Javascript-Welt eher erschrocken, wie wenig Wert auf sauberen Code gelegt wird. Wie komme ich zu dieser Einschätzung? Anonyme Funktionen wohin man schaut Wenn ich mir Javascript-Codebeispiele ansehe, dann werden im großen Stil anonyme Funktionen (meistens als sogenannte Callbacks) eingesetzt. Das betrifft zum einen sehr einfache Beispiele, in denen dieses [...]

2017-01-28T14:28:41+00:00 26.09.2013|Tags: , , , , |2 Comments

Widget-Bereich zu Theme hinzufügen

Widgets in WordPress sind eine coole Sache, aber es kommt vor, dass man diese an Stellen verwenden möchte, die das verwendete Theme nicht vorsieht. Die Lösung besteht darin, das Theme anzupassen, damit es weitere Widget-Bereiche unterstützt. Ich habe so schon einen Link zu einer anderen Sprache rechts oben auf die Seite oder ein Werbebanner oberhalb des Contents gepackt. In diesem Artikel zeige ich wie man einen Widget-Bereich unten auf die Seite bekommt, um dort den Code für Google Analytics unterzubringen. So kann man den Code auf der livegeschalteten Website einfügen, [...]