The Magic weapon is concurrent.thread this guy, is actually a JS library, you can download source code from the website. How to use it?
Very simple
Concurrent.Thread.create (f, A1, A2, ...) F for the function you want to call, A1,A2 as the parameter of the function, this creates a thread, you can create multiple at the same time, they will execute at the same time, this library provides a lot of methods, Similar to Thread usage in other languages, such as Concurrent.Thread.stop (); Specific to the website to understand.
Copy Code code as follows:
<body>
<script type= "Text/javascript" src= "Concurrent.Thread.Compiler.js" ></script>
<script type= "Text/javascript" >
function Hello () {
Document.body.innerHTML + + "H";
Document.body.innerHTML + + "E";
Document.body.innerHTML + + "L";
Document.body.innerHTML + + "L";
Document.body.innerHTML + = "O";
Document.body.innerHTML + = ",";
Document.body.innerHTML + = "";
Document.body.innerHTML + = "W";
Document.body.innerHTML + = "O";
Document.body.innerHTML + = "R";
Document.body.innerHTML + + "L";
Document.body.innerHTML + + "D";
Document.body.innerHTML + = "!";
}
Concurrent.Thread.create (hello);
</script>
</body>
Author Daisuke Maki translator Zhang Kai
While more and more Web sites are being developed using AJAX technology, building a complex AJAX application is still a challenge. What is the main cause of these difficulties? is an asynchronous communication problem with the server? Or GUI programming problems? Usually these two jobs are done by a desktop program, so why is it so hard to develop an AJAX application that implements the same functionality?
Challenges in AJAX development
Let's use a simple example to understand the problem. Suppose you want to build a tree structure bulletin board System (BBS), it can be based on user requests and server interaction, dynamic loading of each article information, rather than a one-time load from the server all article information. Each article has four related attributes: The ID, the name of the sender, the content of the article, and the array information that contains all of its child article IDs that can be uniquely identified in the system. First, assume that a function named Getarticle () can load an article message. The parameter that the function receives is the ID of the article to be loaded, through which the article information can be obtained from the server. The object it returns contains four attributes related to the article: Id,name,content and children. The routines are as follows:
function (ID) {
var a = getarticle (ID);
Document.writeln (A.name + "
"+ a.content);
}
You may notice, however, that repeatedly calling this function with the same article ID requires repetitive and unhelpful communication with the server. To solve this problem, consider using the function Getarticlewithcache (), which is equivalent to a getarticle () with caching capabilities. In this example, the data returned by Getarticle () is only saved as a global variable:
var cache = {};
function Getarticlewithcache (ID) {
if (!cache[id]) {
Cache[id] = getarticle (ID);
}
return Cache[id];
}
Now that the read article has been cached, let's consider the function backgroundload (), which applies the caching mechanism we mentioned above to load all the article information. The purpose is to preload all of its articles from the background when the reader reads an article. Because the article data is tree-like structure, it is easy to write a recursive algorithm to traverse the tree and load all the articles:
function Backgroundload (IDS) {
for (Var i=0 i < ids.length; i++) {
var a = Getarticlewithcache (Ids[i]);
Backgroundload (A.children);
}
}
The Backgroundload () function receives an array of IDs as arguments, and then invokes the previously defined Getarticldwithcache () method with each ID, which caches the article that corresponds to each ID. The Backgroundload () method is then recursively called by the child article ID array of the loaded article, so the entire story tree is cached.
So far, everything seems to be perfect. However, as long as you have the experience of developing AJAX applications, you should know that this naïve implementation will not succeed at all, this example is based on the default getarticle () with synchronous communication. However, as a basic principle, JavaScript requires asynchronous communication when interacting with the server because it is single-threaded. In terms of simplicity, it is a good program model to put everything, including GUI events and rendering, into one thread, because there is no need to consider the complexities of thread synchronization. On the other hand, he exposes a serious problem in application development, where a single-threaded environment appears to respond quickly to user requests, but when threads are busy with other things (such as calling Getarticle ()), they cannot respond to the user's mouse clicks and keyboard actions.
What happens if you synchronize communication in this single-threaded environment? Synchronous communication interrupts the execution of the browser until the communication results are obtained. In the process of waiting for the result of the communication, the thread stops responding to the user and remains locked until the call returns because the server's call has not been completed. For this reason, the browser does not respond to user behavior when it waits for a response from the server, so it looks like it is frozen. When executing Getarticlewithcache () and Backgroundload () have the same problem, because they are all based on the getarticle () function. Since downloading all the articles can take a considerable amount of time, for the Backgroundload () function, the browser's freezing over time is a serious problem-now that the browser is frozen, it is not possible to perform background preload data when the user is reading the article. If you do this, you won't be able to read the current article.
As mentioned above, since synchronous communication can cause such a serious problem in use, JavaScript uses asynchronous communication as a basic principle. Therefore, we can rewrite the above program based on asynchronous communication. JavaScript requires an event-driven programming approach to write asynchronous communication programs. On many occasions, you must specify a callback program that will be invoked once the communication response is received. For example, the Getarticlewithcache () defined above can be written like this:
var cache = {};
function Getarticlewithcache (ID, callback) {
if (!cache[id]) {
Callback (Cache[id]);
} else {
Getarticle (ID, function (a) {
Cache[id] = A;
Callback (a);
});
}
}
Current 1/2 page
12 Next read the full text
