Comparison of three modes for Script Security to import (load)

What is server load?
Script programs are generally executed after downloading. When the script library is very large, it takes a lot of time to download it at once. The traditional solution is to write the script in different files according to the function module, manually add the script tag to the page to load the specified content. However, this has some disadvantages. the user of the class library needs to know the relationship between no scripts and the sequence requirements, it is impossible to make every class library user very familiar with it, and there is a high possibility of errors. As a result, many frameworks began to support import commands, and all they wanted to do was to use an import function. Instead of having to pile up script files, they didn't have to pay close attention to their dependencies.

Security load dilemma:
Early installation on demand (instant synchronization and On-Demand Loading) has a fatal weakness and browser blocking problem. When you load some class libraries as needed, you can use XMLHttpRequest to load script files synchronously. In this case, the browser stops responding to user events and page re-painting before the resources are downloaded. If the network speed is very slow, this time will be very annoying, just like a crash.

In the past, the solution was to directly package common class library resources into the framework file, and on-demand import became a form of publicity, without much practical value.

The following three modes can be installed:


L instant synchronization on-demand loading (blocking, JSI, JSVM, and dojo ).

The simplest implementation of on-demand loading is achieved by synchronously loading script files through XMLHttpRequest. The problem is that when the browser uses this method to synchronously obtain resources, the browser will be blocked: stop responding to user events and stop page re-painting. Therefore, although programming is the simplest, the user experience is the worst.



2 asynchronous On-Demand Loading (no blocking, JSI2.0 + ).

Asynchronous import does not have to be explained. The user experience is good, but it is troublesome to process it because of its asynchronous features.



3. Delayed synchronization is loaded on demand (no blocking, JSI2.0 + ).

JSI uses the dynamic pre-loading function to synchronously obtain resources. Although it is also synchronous, there is no blocking. It can take into account both ease of use and user experience. The disadvantage may be delayed. The current script tag is unavailable.





Usage (JSI example)
Take a code syntax coloring program as an example:

Class Library location: org/xidea/example/code. js

Page location: example/xxx.html



Instant synchronization On-Demand Loading

Import ("org. xidea. example. code. Code ");

Var code1 = new Code ();

Code1.id = "libCode ";

Code1.decorate ();




Asynchronous On-Demand Loading

$ Import ("org. xidea. example. code. Code", function (Code ){

Var code1 = new Code ();

Code1.id = "libCode ";

Code1.decorate ();

})




Delayed synchronization is loaded on demand (no blocking, JSI2.0 + ).

<Script> "../scripts/boot. js"> </script>

<Script>

$ Import ("org. xidea. example. code. Code", true );

</Script>



<Script>

Var code1 = new Code ();

Code1.id = "pageCode ";

Code1.decorate ();

</Script>




Test example:
Address:

Http://jsintegration.sourceforge.net/example/code.html

Http://www.xidea.org/project/jsi/example/code.html

The examples are the default examples of jsi. You can download them to the local machine for running. It is best to place them on a server that can be subject to network speed restrictions. The blocking problem can only be seen in this way.

Refer:
JSI import function: function $ import (path, callbackOrLazyLoad, target)



Ji2 preview version download: http://groups.google.com/group/jsier/files