https://github.com/shekhei/dust-scriptjs-helper

scriptjs helpers for dustjs
https://github.com/shekhei/dust-scriptjs-helper

Last synced: 1 day ago
JSON representation

scriptjs helpers for dustjs

• Host: GitHub
• URL: https://github.com/shekhei/dust-scriptjs-helper
• Owner: shekhei
• Created: 2016-03-14T10:41:51.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2016-03-18T09:18:04.000Z (over 8 years ago)
• Last Synced: 2024-10-11T20:11:15.651Z (about 1 month ago)
• Language: JavaScript
• Size: 49.8 KB
• Stars: 0
• Watchers: 3
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# A set of helpers for using [script.js](http://github.com/ded/script.js) as async dependency loader with [dust.js](http://github.com/linkedin/dustjs)

## What does it do?

Basically it helps you build your script.js code, and if any depended bundle is not requested, it will not be built. It builds a very simple graph internally and is used to build the code

### Not loading of unnecessary bundles

The following code is very much similar to the above code, except, the final set of script only depends on bundle("two") and as you can see the final result is much shorter(since bundle three is not loaded, bundle one is not needed)

```html

{@bundleScript bundle="one" src="one.js"/}

{@bundleScript bundle="two" src="two.js"/}

{@bundleScript bundle="three" src="three.js"/}

{@bundleDepends bundle="three"}

{@dependsOn bundle="one"/}

{@dependsOn bundle="two"/}

{/bundleDepends}

{@scriptjs}

{@dependsOn bundle="two"/}

{/scriptjs}

{@renderScript /}

$script(["two.js"],"two");

$script.ready("two",function(){

});

{@bundleScript bundle="one" src="one.js"/}

{@bundleScript bundle="two" src="two.js"/}

{@bundleScript bundle="three" src="three.js"/}

{@bundleDepends bundle="three"}

{@dependsOn bundle="one"/}

{@dependsOn bundle="two"/}

{/bundleDepends}

{@scriptjs}

{@dependsOn bundle="three"/}

{/scriptjs}

{@scriptjs dependsOn="one"/}

{/scriptjs}

{@renderScript /}

$script(["one.js"],"one");

$script(["two.js"],"two");

$script.ready(["one","two"],function(){

  $script(["three.js"],"three");

});

$script.ready("three", function(){

})

$script.ready("one", function(){

})

{@bundleScript bundle="one" src="one.js"/}

{@bundleScript bundle="two" src="two.js"/}

{@bundleScript bundle="three" src="three.js"/}

{@bundleDepends bundle="three"}

{@dependsOn bundle="one"/}

{@dependsOn bundle="two"/}

{/bundleDepends}

{@scriptjs}

{@dependsOn bundle="two"/}

{@dependsOn bundle="three"/}

{/scriptjs}

{@renderScript /}

<!-- the unused bundles are not included -->

$script(["one.js"],"one");

$script(["two.js"],"two");

$script.ready(["one","two"], function(){

  $script(["three.js"],"three");

})

$script.ready(["two","three"],function(){

});