The difference between Requirejs and SEAJS

Source: Internet
Author: User
Tags define expression interface regular expression require script tag
Quote Self-Knowledge (Lube)

1. Requirejs Asynchronous module loading caters to the inherent asynchronous thinking of browser-side JS programmers and low learning cost
--------------------------------
Sea.js's home page reads:
    • Sea.js follow the CMD specification and can write module code like Node.js General
    • Relying on automatic loading, simple and clear configuration, so that we can enjoy the fun of coding more
Two years ago, I saw sea.js such a self description, the first feeling is: why the browser JS programming and Nodejs similar is elegant?

So, to discuss Requirejs and Sea.js's learning costs.

such as Requirejs in the Dependencies module:
Require ([' jquery ', ' module '],function ($,B) for global variables) {
	//Since I explicitly declare dependency requirements at the beginning, it can be determined that the dependency must have been satisfied when the callback function is executed
	//So, Use it with ease
})

In the Sea.js, it is shown as:
Define (function (require,exports,modules) {
	var $ = require (' jquery ')
	$.get (' http://www.zhihu.com ')
	// Traditional JS Programmer's thinking:
	//"Yi, good magic, JS loading should not be asynchronous, how I said to rely on, jquery jumped out of their own?" "
})

So, is "rightfully" easy to understand, or is magic easy to understand?

2. Requirejs implementation of the way to meet the JS general implementation process
--------------------------------
When we see the Requirejs interface,
Require ([' A ', ' B '],function () {
//do something
})
The real thing to do is:
    1. Require function check the dependent module, according to the configuration file, get the actual path of JS file
    2. According to the actual path of the JS file, insert the Script node in the DOM and bind the OnLoad event to get the notification that the module has completed loading.
    3. Call the callback function after the dependent script has completed loading
The above steps are easy to imagine

and Sea.js is calling
Define (' A ', function (require,exports,modules) {
	var b = require (' B ')
})
When
    1. Using the Function.tostring function of the callback function, the regular expression is used to capture the internal require field and find the Require (' jquery ')-dependent modules jquery
    2. According to the configuration file, find the actual path of the jquery JS file
    3. Inserts a script tag in the DOM, loads the module-specified JS, binds the completed event, and binds the JS file to the ID specified by the Require module (here is the jquery string) after the load completes
    4. callback function internal dependent JS all loaded (no call) after the call callback function
    5. When the callback function calls require (' jquery '), executes the JS file bound to the ID of ' jquery ', executes it immediately, and passes the return value to Var b
This use of regular expressions to capture the Require internal dependency module, so that not yet executed by the callback function JS run environment, resulting in the interior of the require function can only rely on the name of the module hard coded, can not write the following code
Define (' A ', function (require,exports,modules) {
    var b = require (' Us ' + ' er ')
})
And can only be written
Define (' A ', function (require,exports,modules) {
    var b = require (' User ')
})
And above sea.js the most fundamental principle in Sea.js document incredibly no trace!
"You have changed the wonderful magic, we will cheer for you." But you want us to trust you, you have to take the initiative to explain the mysteries of magic. Or I'll feel like I've been fooled. ”

So it draws the next one:

3. Sea.js's documentation is high and does not mention key details
--------------------------------
In fact, if the same as the previous paragraph, will sea.js the core principles of a simple explanation, the basic knowledge of the JS programmer may be "five minutes to start Sea.js", but in the official document, these are not mentioned.

Sea.js-In the official document began to address the problem and solve the problem after the value, OK, can begin to consciously try to use Sea.js JS programmer must be encountered the complexity of the problem needs to solve the module.

Then give the seemingly synchronized loading of the example code that looks very magic ("Wow, good hurrying feet!"). Daniel, so how did this happen? ”)
All modules are defined by define to define
define (function (Require, exports, module) {

  //via require to introduce dependent
  var $ = require (' jquery ') ;
  var spinning = require ('./spinning ');

  Through exports to provide external interface
  exports.dosomething = ...

  or provide the entire interface
  Module.exports = ...} via Module.exports

;

Then you go straight to the API and the Convention. ("Who will take care of my curiosity!") said that I am indifferent to you today, tomorrow you let me not rise! ”)

This feeling seems to be the math teacher just talked about the history of calculus and its importance, looked down at the eyes of the mobile phone, raised his head is already talking about triple integral! (Cover your face)

This is why I have been full of resentment against the author. At that time, the first smell of sea.js, found that the works of the people, yes, the online evaluation is good, immediately learn, there is no reason to want to migrate from Requirejs to Sea.js (Requirejs in the side asked: "I did something wrong?" Do wrong I change "). But look at the document to try to read several times (without looking at the code, scold me), or feel very magic, feel is the smoke and mirrors.
I don't know where I glanced at it today, sea.js. The regular expression is used to find the require in the contents of the callback function to determine the loaded function. Then a look at the code is really, immediately fire from the heart, do not write an article spit can not put out the fire (imagine throwing his wife and son pursuit of true love, finally found true love is the feeling of fraternity).

Technical documents should be to the point, saving reader time, rather than pretending to be deep. The simple complication should not be a programmer's style.

"For the peace and stability of the world, the happiness of the family" can not stay in the mouth to say, ultimately to be implemented.

4. Sea.js Deployment Optimization tool is not yet complete
--------------------------------
Well, that's what everybody's saying, I'm not using sea.js, I've never had a problem like this.

Finally, I'd like to express my understanding of the lazy loading part of the answer to @ Li Yu

The advantage of lazyload is that resources are loaded only when resources need to be used. In Requirejs and Sea.js, the JS script resource is loaded before the callback function call.

Requirejs and Sea.js are the same at the point of time when resources are loaded, so the degree of laziness is the same. The difference is only when the loaded script executes. The Requirejs dependent module executes before the callback function executes, and the Sea.js dependent module executes when the callback function executes require.

What the callback function wants to achieve is the "atomicity of the Transaction", which completes the goal only when the entire callback function ends. So since the execution time of the entire callback function is constant, there is no intrinsic difference between the individual's belief that the time it takes to load a script is spent before or after the callback. If you disagree with the nature of the same, then at least there is no one more lazy difference.



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: info-contact@alibabacloud.com 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.