… as i got a call from a major provider lately: im gonna refactorize it. This whole thing is so freaking complicated, it takes a day of thinking to get a step done cross-browser. I´ll be back. BTW: there is a cross-browser general solution on the horizon…

I am still working on this (current task: google compliance & complete refactorizing & twobirds conform now), so if ads don´t appear here I am probably using my blog as a testbed for this function! Right now it seems that all ad code CAN be supported, but so far the domWrite() function must be taylored for the specific ad code. So if you really bad need a solution, get in contact with me: (click here)

Often there is advertising code to be implemented in a page, and there are 2 problems one may face:

(1) the website hangs due to a lag on the code delivering server
(2) you normally cannot lazy load the script since document.write() is used inside the foreign code which only works during rendering of the page.

This is a snippet that allows the asynchronous loading and delayed execution of JS code that contains document.write() statements in the context of a chosen DIV element.

Read the rest of this entry »

Now this article is closing in on twoBirds priciples… as some people know it is an asynchronous on-demand loader. Since there is no sense in showing you how to write asynchronous JS programs, without the knowledge of how to debug them, I´ll start with that. This article, like the others, expects you to have Firefox and the Firebug extension installed.

Read the rest of this entry »

Unexpectedly, there is a forth part of the “Module Pattern” article. The more I dig into it, the more ideas seem to surface… I found a way of having invisible properties and methods inside classes. These private methods and properties are only available from outside via prototype wrapper methods!

To mention it at the beginning: it also comes at the cost of memory usage. The benefit is, that you don´t have to manage the memory of private variables yourself - a simple “delete myInstance;” is sufficient to clean the memory. Also surprisingly it is easy to handle, if you know how to code a module pattern:

Module Pattern: explained in detail in “The Module Pattern Vol. I - Singletons”

- will allow for private properties and methods in singleton objects.

var mySingleton = (function(){
  // private properties
  // private methods
  return innerSingleton;
 })();

Module Class Pattern: explained in detail in “The Module Pattern Vol. II - Classes”

- will allow for (static) private prototype properties and private methods in classes.

MyClass=(function(){
 // private methods
 // inner class
 // inner class prototype
 return innerClass;
 })();

Modular Class Function Pattern: explained here.

- will allow for private properties and methods in classes.

myModularClassFunction=function( pParm ) {
 var ThatClass = (function(){
  // private properties
  // private methods
  // inner class
  // inner class prototype
  return innerClass;
  })();
 return (new ThatClass( pParm ) );
 }

…or the latter max compressed:

myModularClassFunction=function( pParm ) { return new ((function(){
  // private properties
  // private methods
  // inner class
  // inner class prototype
  return innerClass;
  })())( pParm ); }

Read the rest of this entry »

Ajaxian, Ajaxian… this site keeps pointing me to interesting things and persons I have never heard of.

This time it was an article about Zed Shaw, a Ruby and RoR expert that recently stirred up the community in a very harsh rant about his experiences. I read this article, and some of his experiences especially regarding the industry pretty much match mine. But this is not the issue here. I cared to explore his blog a little more, and found his essay on programming. There is so much truth in it, that I used it to check my own intentions in exploring JS patterns, especially the “Module Pattern”.

Read the rest of this entry »

So, here is the second part of the “Module Pattern” article.
It includes information on standard JS classes, the scope of “this”, prototyping, hidden prototype functions, options to code invisible class variables or invisible classes.
(Please note that the last pattern of this document is not really recommended for production use. See Vol. IV for a better solution.)
Read the rest of this entry »

This is not meant to be a beginners guide to Javascript, let alone a full blown JS manual – if you need basic information I´d point you to the next bookstore. This is the first part of the upcoming twoBirds documentation, which will in fact be pretty big and probably turn out to be a JS pattern book with a little twoBirds info to spice it. Since I am constantly asked to explain some techniques and patterns, I decided to put the most prominent ones online to save some time…

In order to efficiently code tB JS applications, it is required that you understand some JS specialities that you probably don´t find in the book you just purchased. These techniques and patterns are described here in general.

In order to test the code snippets presented here, I advise you to install Firefox and the Firebug extension. As of now it is virtually impossible to write a full AJAX application without using Firebug.

If you already know some of the information thats included below, just skip it. I advise to read all of it though, since the following parts build on each other. If you are more into the details of the JS engine than I, please forgive me for discussing the following issues in a non-precise way – it is meant for better understanding. If you find an error however please give me a hint. Read the rest of this entry »

Hint: you should have read and understood twoBirds principles as described here and here, to fully profit from this. In short twoBirds is an on-demand-everything asynchronous web object loader and a coding pattern that comes with it.
For: all “Birdies” and those interested in JS coding patterns.
Download: twoBirds (latest stable)

Hi everybody!

I´m happy to announce twoBirds V 2.4.0 is ready for download at the link above. This version is a complete overhaul of the lib, the core has been rewritten completely. It was tested with the three big applications I could lay my hands on, and it worked in all of them. The performance increase was in the range of 100% - but the lib is only a fraction of the overall code so the rest of the code accounted for more than 90% of the JS execution time.

In the core, the estimated performance increase is factor 5-10, since the timer, interval and wait singletons have been completely rewritten, not only optimized. Today the core is 98% final, with some work left perhaps on the tb.request … but this is a side issue.

I was asked to put this out very early, since the improvements especially in simulating JS multitasking are so significant. So this still lacks proper documentation, which will be my next task. So far one hint: better use arrays, not strings that contain an array, where applicable. Same applies to functions and booleans, e.g. all non-integer arguments to timer, interval and wait should be functions now. Instead of tb.element.require use tb.require.add (same parameters), and instead of tb.misc.wait use tb.wait.add (there is a compatibility wrapper though).

All of this is work in progress…

Here is Johns Resigs method overloading scheme from his Ajaxian post:

// addMethod - By John Resig (MIT Licensed)
function addMethod(object, name, fn){
    var old = object[ name ];
    object[ name ] = function(){
    if ( fn.length == arguments.length )
       return fn.apply( this, arguments );
    else if ( typeof old == 'function' )
       return old.apply( this, arguments );
   };
}

// Now setup the methods
function Users(){
  addMethod(this, "find", function(){
    // Find all users...
  });
  addMethod(this, "find", function(name){
    // Find a user by name
  });
  addMethod(this, "find", function(first, last){
    // Find a user by first and last name
  });
}

// Now use the methods
var users = new Users();
users.find(); // Finds all
users.find("John"); // Finds users by name
users.find("John", "Resig"); // Finds users by first and last name
users.find("John", "E", "Resig"); // Does nothing

In his comment he said it doesnt work with type checking, it only distinguishes by the number of arguments. Well, here is the missing part:
Read the rest of this entry »

Hi everybody,

I was on the “ajaxinaction” web conference as a speaker, and I have to say I enjoyed it a lot. I met a couple of really well known people, among them Arne Blankert from nonfood and Bill Scott, the former lead UI Designer at YAHOO who now works for netflix.

I will write more about this soon, as a teaser let me say I developed an AJAX web presentation program to display my presentations - that was one single 24 h coding session. In a second step I will make this a service that allows you to define your presentation in the browser and store the presentation with all the content in a single html file.

As a second consequence I am thinking about something completely new, something I won´t disclose until its done basically. My head is buzzing from it, and it is very very basic JS stuff.

I will continue this article soon, right now a big pile of work fell on me when I came back. Please check back soon, there is more to come …