User Experience Analysis of top-level object names in the Javascript class library

Source: Internet
Author: User

Because top-level objects use almost all functions of the class library, they are frequently entered in encoding. Therefore, when designing class libraries, the simplicity of top-level Object Name input is also very important.

Here, we will compare the length of the Object Name and the key order of the input object name among the three class libraries, and strive to take care of some special points, this gives a comprehensive evaluation result.

Name Length
JQuery consists of six characters in length. It is the longest of the three class libraries and contains an uppercase letter Q. a shift key is required during the input process, therefore, the length value is set to 7.

Ext consists of three characters, which is the most advantageous in length. Because the first letter is an uppercase letter E, SHIFT is required during the input process, so the length value is set to 4.

KISSY consists of five characters, all of which are uppercase letters. The length is close to that of jQuery, and a SHIFT key is required for a long press. Therefore, the given length value is 6.

In terms of Name Length comparison, the most popular jQuery is defeated by a weak disadvantage, but jQuery has made some improvements in this regard using other methods, which will be mentioned later.

Key order
The analysis of key order is complex. The principles involved here mainly include the following:

Use the left and right hands Hands to enter each character as much as possible.
Avoid continuous use of the same finger as much as possible.
Minimize the time required to press a button.
The index and middle finger are more flexible, so try to avoid using the small finger and ring finger.
Two relatively close fingers are prone to association, that is, when the finger moves, the ring finger will also be reflected and moved slightly, which may affect the next button, therefore, try to avoid parallel finger movement.
During the evaluation, the numbers from the left-hand finger to the right-hand finger are numbered 0-9 in sequence. Looking at the numbers, we will find some interesting phenomena.

The order of keys for jQuery is 606236 in sequence. During the input process

A less flexible left-hand finger was used at one time.
On the basis of the previous article, in fact, when pressing Q, you need to press the SHIFT key with the left-hand finger. Therefore, Q is actually handed over to the left-hand ring finger that is not originally responsible For the Q key.
When the upper-case Q is input, the left-hand finger and the ring finger are connected, not sequentially, but simultaneously.
E and r are continuously struck by the left middle finger and index finger, which may be affected by parallel finger movement. However, in the actual input process, I found that the influence between the index finger and the middle finger not only has no effect on efficiency, but also promotes speed and reflects on this process, I found that hitting the desktop consecutively by the middle finger and forefoot fingers is a kind of action that I often do when thinking, so I formed an extremely efficient and skillful reflection movement ......
The key order of Ext is 213 in sequence. The following problems are found during the input process:

All buttons come from the left hand and the right hand is completely idle, which cannot reach the theoretical maximum input speed. However, in the input of Ext, the right hand can be positioned at the same time. This button does not have a great impact on the input of the entire line of statements.
When you enter an ecapital, you need to hold down the SHIFT key for the left-hand finger. Then, when you enter x, you need to release the SHIFT key for the moment before the left-hand ring finger is pressed, these two fingers are easily reflected in association, which has a great impact on the accuracy of left-hand positioning by pressing the x key.
The key order of KISSY is 77116, which is probably the worst key order of several class libraries.

The right middle finger and the left ring finger are pressed consecutively. the right middle finger even needs to be moved when two key bits are pressed, seriously affecting the input speed.
During the speed input process, the left-hand finger requires a long SHIFT key, which is the least powerful among all fingers. Long-clicking a non-letter remote key will cause great pressure on the finger, after a long period of input, the finger joints become stiff, which can be raised to the healthy height of developers ......
In the SHIFT Process, there are two consecutive left-hand ring finger input, the original ring finger and the small finger are prone to linkage reflection, so the ring finger is constantly on the same point (S key) in the process of force adding and unloading, the finger will strengthen and weaken with the ring finger. The worst case will cause the SHIFT key to be released. The sudden enhancement of this force and the weakening of the opponent's fingers and joints can also be ignored. Therefore, when we input the KISSY characters, our left-hand finger is great, he withstood thousands of pressure and finally finished the task with honor!
By using the alias $, jQuery converts a complex object name into a simple character, and does not forget to provide the noConflict function locally to release the $ variable, I think about this very well.

Ext because of Object Organization, more paths are usually required to call a function. For example, jQuery (selector) will change to Ext in Ext. element. query (selector). At this point, Ext has pushed some common functions to the Ext object, such as Ext. element. fly to Ext. fly, Ext. domQuery. select to Ext. query, but in terms of the total amount of code, it is inferior to jQuery.

KISSY combines the modular structure of Ext and introduces the problem that the function access path of Ext is too long, because the with statement in Javascript has such a problem, using aliases to replace objects with deeper layers also has such problems, so such problems are not easy to avoid.

Why not analyze YUI? Because I used to use Ext, jQuery was much used in the later stages, and KISSY had a lot of attention since I entered the front-end field. It was a big pity for me to have no contact with YUI from start to end, at the same time, the author lost the right to evaluate the framework in this article.

We will use the following method to score each class library

The length score is 10-The length value.
The maximum value of keys is 10. One point is deducted for each problem, and two points are deducted for a serious problem.
The final result is shown in the table below.

Name Length key order remarks
JQuery 3 6
Ext 6 7 excessive function access path: 1 point deducted
KISSY 4 3 serious issues + 4 points

Last statement: I absolutely have no meaning for kiskissy. On the contrary, I am deeply interested in KISSY's design, module separation, and implementation, this article only evaluates the input experience of top-level object names. At this point, KISSY selects a bad name.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.