Introduction to the open source javascript project Kissy_javascript skills

kissy profile

What is kISSY?

KISSY is an open source javascript project, its main body is a front-end UI development framework, namely KissyUI. The kissy mentioned in this article only refers to the language and framework design ideas in kissy.js of its core part. The open source website of the KISSY project is: http://kissyteam.github.com/

How to use kissy?

Although we have proposed some new concepts and framework models in the process of transforming KissyUI into kissy core, in fact, we have not changed any usage practices of KissyUI. From a code point of view, there are no changes in other modules after kissy.js and lang.js. Therefore, if you only use kissy as a UI system, you can refer to the open source website above, which contains the existing KissyUI documentation. It is completely effective, and KissyUI itself is also an excellent and convenient Web UI framework. However, the kissy system's capabilities in model-oriented merging and organization have been greatly enhanced.

After downloading the source code, you can see that the compressed kissy-min.js file size of the entire code is 42kb (jQuery-min is 71kb, dojo core is 88kb)

Looking at the official website documents, I found that the kissy project is divided into 9 parts

The core structure of kissy.js can be divided into

The base class is kissy and provides the following methods

(Here is a small suggestion for developers. When I first read this document, I always thought that to access the add method, I need a declaration method like kissy.kissy.add. Maybe I read too many ext/dojo documents. , seeing the documentation of kissy’s organization method, I can’t figure out how to use it at a glance, I hope it can be improved)

.

Understand the core API

Like all js frameworks, kissy provides the kissy.Config object to implement the configuration information for the initial loading of the kissy framework,

and a DocumentReady event, kissy.ready(fn) method,

(The developer did not write here. The execution order of multiple events registered by ready. By looking at the source code, you can know that the events registered by ready are placed in a list. When executed, they are executed according to the first-in, first-out principle. )

There is also a method available

that is executed when the monitoring element is available.

However, I always feel that there is ambiguity in the immediate execution here. The principle is generally a timer, delayed scanning, and cannot be counted as immediate

Encapsulates simple debug output, implements a log and error method, and uses the browser's console

For component management, methods such as namespace (namespace), object inheritance (extend), object member copy (mix/merge), prototype copy (argument), and object declaration (app) are implemented,