When ZK Client Engine initializes a component view, it first check if the z.type attribute is defined. If not specified, it means no JavaScript codes required and it ends the initialization of this component.

If z.type is specified, say, widget.SuperButton, ZK Client Engine first loads the JavaScript file, /web/js/widget.js, and then check if any method called zkSuperButton.init. Invoke it if found. We call this method as the init callback.

A component view usually registered event listeners in this method. For example,

zkSuperButton = {} //declare zkSuperButton to hold init, cleanup and other methods

zkSuperButton.init = function (cmp) {
zk.listen(cmp, "focus", zkau.onfocus);
zk.listen(cmp, "blur", zkau.onblur);
};

The initialization order is starting from the child, then to the parent, to the parent's parent, and so on.

After init is called, it invokes zkSuperButton.beforeSize and zkSuperButton.onSize, if any, to initialize the size of the view. Components rarely need to provide these two methods, unless they are providing the layout, such as Hbox and Borderlayout. We will talk more about them in the ZK Callbacks section.

When a component is about to be removed, ZK will check if the cleanup callback exists (i.e., zkSuperButton.cleanup in the above example). Invoke it if found.

The order of cleanups is starting from the topmost component, then to its child, to its child's child and so on.

Tip: You don't need to unregister the event listeners you registered in the init callback. ZK Client Engine will unregister them automatically.