-
It is a system that allows Javascript on the frontend to be load async
- The amount of JS that blocks render is fairly small
- And the remaining JS that's needed can be loaded at a low priority
-
It's also a way to manage dependencies on JS modules
- Concating every single bit of JS into one big file resolves race conditions, but means that frontend users download a TON of JS.
- Require.js gets around this by using a
define(['dep'])approach, that allows dependencies to be wired in on load time. - It's also idempotent, so that if something is already loaded, it won't load twice.
-
It's a way to use Javascript in a modular fashion
- Sometimes the dependency tree is really long.
- That means that the time to execute a specific module can be overly long if it has a series of dependencies.
- AKA it takes too long.
-
deps
- A way to load specific JS modules on certain pages (or all) in a config
-
mixins
- Which let you modify behavior of existing JS objects/functions/whatever
-
shims
- Which let you load in non-Require.js syntax in a normal way
-
map
- Which lets you override existing modules in favor of whatever file you want!
-
text/x-magento-init, as well as data-mage-init and a whole host of other fun HTML approaches.
- Git approach
- Webpack
- Gulp
- Flattened dependency trees