Create single, self-contained production.js file using steal

328 views
Skip to first unread message

Jonas Huckestein

unread,
Sep 6, 2010, 7:31:01 AM9/6/10
to JavaScriptMVC
Hey,

is there a way to generate a single, self-contained javascript file
from steal. It seems like this mus be possible.

For development mode I love the way steal loads my dependencies in
order and all that, but I think my production.js files are a little
too complicated. I would like to do

<script src="production.js"/>

to load the entire application. I don't want to load any libraries
from a different location or use multiple packages. I don't think I
need any of the steal.js stuff in my production.js.

My production.js contains a lot of steal.plugins, steal.end,
steal.then etc calls that are not necessary. We could instead figure
out a safe order for the code to be loaded in, pack it all into one
file in that order and then only serve that file.

Is there any way to do that?

Cheers, Jonas

Justin Meyer

unread,
Sep 6, 2010, 11:21:31 AM9/6/10
to javasc...@googlegroups.com
There is, but it's not worth it. If you are gziping your production, the steal code in your production probably comes out to a few 100 extra bytes on the largest of apps.

More concerning would be the loading of the production steal itself which adds about 3k. I can probably get this under 1k.

However, in many ways, this is the price you must pay for as convenient of dependency management. Your code and jmvc's code both have steal code. If you can think of a good way of parsing it out, I'm all ears.

But, if this is something really important to you, the are 3 options:

1: use the pluginify.js script to create steal-less scripts. This is our attempt at parsing it out.

But beware, pluginify requires you to write your code in a very specific way. It uses brittle regexps to look for steal and removes it.

You can see examples of pluginify's use in jmvc's build.js script.

2. use normal script tags that load jmvc's components stand alone. And write your own compression script.

Sent from my iPhone

> --
> You received this message because you are subscribed to the Google Groups "JavaScriptMVC" group.
> To post to this group, send email to javasc...@googlegroups.com.
> To unsubscribe from this group, send email to javascriptmv...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/javascriptmvc?hl=en.
>

Jonas Huckestein

unread,
Sep 6, 2010, 2:38:39 PM9/6/10
to JavaScriptMVC
Hey Justin, thanks for the reply. I think I'm trying to "unbrittle"
things in our app now, so pluginify may not be the right approach.

for me it would already work if build.js just copied
steal.production.js into the beginning of my apps production.js. I
tried that and of course it didn't work because steal.production.js
expects a "path" to load. I could patch it so that it does nothing
when no path is given. Would that work?

Cheers, Jonas

On Sep 6, 5:21 pm, Justin Meyer <justinbme...@gmail.com> wrote:
> There is, but it's not worth it. If you are gziping your production, the steal code in your production probably comes out to a few 100 extra bytes on the largest of apps.
>
> More concerning would be the loading of the production steal itself which adds about 3k. I can probably get this under 1k.
>
> However, in many ways, this is the price you must pay for as convenient of dependency management.  Your code and jmvc's code both have steal code. If you can think of a good way of parsing it out, I'm all ears.
>
> But, if this is something really important to you, the are 3 options:
>
> 1: use the pluginify.js script to create steal-less scripts. This is our attempt at parsing it out.
>
> But beware, pluginify requires you to write your code in a very specific way. It uses brittle regexps to look for steal and removes it.
>
> You can see examples of pluginify's use in jmvc's build.js script.
>
> 2. use normal script tags that load jmvc's components stand alone. And write your own compression script.
>
> Sent from my iPhone
>

Justin Meyer

unread,
Sep 6, 2010, 2:43:33 PM9/6/10
to javasc...@googlegroups.com
A better approach would be to use the build/apps functionality to order the dependencies and then just insert a 'dummy' steal on top:
steal = function(){
  for( arguments) 
     if(arg is function) arg()
}
steal.plugins = steal.controllers = .... = function(){}


Justin Meyer

Jupiter Consulting
\Development\Training\Support
847-924-6039
justin...@gmail.com

Jonas Huckestein

unread,
Oct 11, 2010, 7:27:09 AM10/11/10
to JavaScriptMVC
Hey Justin,

I hope you don't mind me taking up this old thread again. I just tried
to implement the 'dummy' steal you spoke of.

The problem is that the compressed JSMVC requires the dummy to be
rather elaborate because .then() is expected to pass the most recent
steal to the passed function.

I have been trying to do this to solve a different problem:

- I have two applications: app1, app2
- They share some code and I have successfully compiled the
applications into app1/production.js, app2/production.js and packages/
0.js
- Depending on the result of a bootloader function, I want either
app1 or app2 to load

So I created a bootloader script in which I put steal.production.js,
packages/0.js and and my bootloader function.

I'm stuck trying to load app1/production.js or app2/production.js.
Given the above setup, how would I use steal to load either of the
compressed fragments in app1 or app2?

It may be worth noting that the directory structure is different from
before. I want is three files called bootloader.js (containing
(mock-)steal, the shared code from 0.js and the bootloader function)
that loads either app1.js or app2.js (from the same directory). I can
see there are references to //app1/controllers and such in app1.js and
app2.js. Could this be a reason why steal fails. If I had a working
steal dummy, then obviously I wouldn't have to care about any of that.
Here's my approach

steal = function(){
for(var i=0, l=arguments.length; i<l; i++) {
if(typeof arguments[i] === 'function') arguments[i]()
}
return steal;
}
steal.end = steal.start = steal.then = ... = steal;

As I said, that breaks when the compressed framework uses steal.then.

I hope you can help me. I'm a little concerned about how steal is this
huge magic black box and whenever I try to do something unintended, I
end up spending a lot of time and rarely achieve my goals. It probably
makes sense to write up a few scenarios and how to implement them
using steal. What we're doing seems fairly standard. We load a
barebones bootloader that switches on either of a list of applications
(depending on language, browser, who cares).

Thanks and regards,

Jonas


On Sep 6, 8:43 pm, Justin Meyer <justinbme...@gmail.com> wrote:
> A better approach would be to use the build/apps functionality to order the
> dependencies and then just insert a 'dummy' steal on top:
> steal = function(){
>   for( arguments)
>      if(arg is function) arg()}
>
> steal.plugins = steal.controllers = .... = function(){}
>
> Justin Meyer
>
> Jupiter Consulting
> \Development\Training\Support
> 847-924-6039
> justinbme...@gmail.com
>
> On Mon, Sep 6, 2010 at 1:38 PM, Jonas Huckestein <jonas.huckest...@gmail.com
> > javascriptmv...@googlegroups.com<javascriptmvc%2Bunsubscribe@goog legroups.com>
> > .
> > > > For more options, visit this group athttp://
> > groups.google.com/group/javascriptmvc?hl=en.
>
> > --
> > You received this message because you are subscribed to the Google Groups
> > "JavaScriptMVC" group.
> > To post to this group, send email to javasc...@googlegroups.com.
> > To unsubscribe from this group, send email to
> > javascriptmv...@googlegroups.com<javascriptmvc%2Bunsubscribe@goog legroups.com>
> > .

Justin Meyer

unread,
Oct 11, 2010, 7:41:29 AM10/11/10
to javasc...@googlegroups.com
Anyway, you can post that here:


Thanks,

Justin Meyer

Jupiter Consulting
\Development\Training\Support
847-924-6039
To unsubscribe from this group, send email to javascriptmv...@googlegroups.com.
Reply all
Reply to author
Forward
0 new messages