Basics
JS-Class-Loader's main concerns are parse-time dependencies and run-time dependencies. A parse time dependency means that when a file is parsed - when it's code is loaded into the page - it references code from another file. So it isn't just that it has functions that call code from other files, it has things like inheritance functions that need a superclass to already have been defined in the page before the subclass can even be loaded.
For example, if the code in file Dog.js uses the code from file Animal.js outside of any function or object, then the file Animal.js must appear in the bundle first, otherwise when the browser parses file Dog.js it will complain that things from Animal.js aren't defined. So JS-Class-Loader (in it's default config), will scan files for things like this:
extend(com.example.SubClass, com.example.SuperClass)
and when it finds them it makes sure that SuperClass appears in the bundle before Subclass.
Note on the extend, implement and namespace functions
You can configure JS-Class-Loader to recognise your own functions for these things, if they are named
differently or have a different structure. Or you can get a copy of the functions that are used in
all the JS-Class-Loader examples if you want to use them.
(The extend function is in all the examples and is a simple implementation that uses an
intermediate function constructor.)
The process
- Each time it runs, it reads the files and folders in your source trees and stores them as a list of package and class names, so a file in a source root that is com/example/MyClass.js is added to the list as com.example.MyClass. JS-Class-Loader always reads all file names and builds a complete list of all available classes.
- Second, it starts with the seed files and scans for dependencies. If the config says allClasses=true then the bundler will add all files. Otherwise it will only add files that it finds as it scans down the dependency tree. Unused files will not be added.
- As it does the scanning, if it detects a parse-time dependency in a file, it adds that file to the output list first and continues scanning from that file, then it returns to the current file and any run-time dependencies that the current file has. This ensures that parse-time dependencies will always appear in the bundle first.
This fairly simple process means that the list of files will always contain parse-time dependencies in the bundle first.
Example codebase
click the arrows to expand and collapse the treeModule tree view
module: lib
- box2d
- box2d.js
- prototype
- prototype.js
module: src
- Base.js
- jssynth
- player
- Global.js
- Instrument.js
- Mixer.js0li>
- Sample.js
- WebAudioOutput.js
- WebkitAudioPatch.js
- games
- app
- audio
- box2d
- effect
- scenario
- svg