[jquery-dev] Re: Join several JS scripts into one big file to lower http request
give it a try, once you have Java Runtime Environment you can simply
configure one or more batch files and create the optimized version in a
click.
Then the best way to serve it is via pre compressed gzip/deflate and decide
via server if the browser accept which version and serve it.
Specially with big files this practice is suggested rather than
ob_start('ob_gzhandler') et similar, simply because compression could be
expensive for the server.
I had a project called MyMin which aims was to do it, but the service did
not grab enough attention so I created a batch file and I let you manage the
rest:
http://www.3site.eu/yuibompressor/
Known bug right now are with special chars in the first line, I am using a
Python 3000 parser but I am thinking to create a better manager entirely via
C so both Linux and Windows shell could call the file and that's it. Stay
tuned?
Regards
2009/7/4 Damir Zekić
>
> On Jul 4, 12:41 am, Samer wrote:
> > I found it tricky to use an automated combiner thingy in that it
> > doesn't know the order of the javascripts to be added to the page.
>
> I use Sprockets[1] to combine multiple scripts into one file. With
> sprockets you write "require" statements and it automatically manages
> the dependencies for you so that the same file is not included
> multiple times. For example:
>
> //= require
> //= require "other_script_file
> $(...);
>
> [1] http://github.com/sstephenson/sprockets/tree/master
> >
>
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups
"jQuery Development" group.
To post to this group, send email to jquery-dev@googlegroups.com
To unsubscribe from this group, send email to
jquery-dev+unsubscr...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/jquery-dev?hl=en
-~--~~~~--~~--~--~---
[jquery-dev] Re: Join several JS scripts into one big file to lower http request
On Jul 4, 12:41 am, Samer wrote: > I found it tricky to use an automated combiner thingy in that it > doesn't know the order of the javascripts to be added to the page. I use Sprockets[1] to combine multiple scripts into one file. With sprockets you write "require" statements and it automatically manages the dependencies for you so that the same file is not included multiple times. For example: //= require //= require "other_script_file $(...); [1] http://github.com/sstephenson/sprockets/tree/master --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups "jQuery Development" group. To post to this group, send email to jquery-dev@googlegroups.com To unsubscribe from this group, send email to jquery-dev+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/jquery-dev?hl=en -~--~~~~--~~--~--~---
[jquery-dev] Re: Join several JS scripts into one big file to lower http request
I like to write quick (manifest?) files for that purpose. jsfile1.js jsfile2.js lib/jquery.js Just yesterday I had to optimize the system I've been working on. I wrote a allinone.php cli script that would read the manifest files and build a combined .js and combined .css file then minify both of them. As well I modified the system to in debug/dev mode instead read those manifest files and output all the script tags instead of outputting one allinone tag for both. If you do it the dynamic way, be sure to do something where you compare the latest modified timestamp of all the js files and check to see if it's newer than the allinone file's timestamp and regenerate it if it is. ~Daniel Friesen (Dantman, Nadir-Seen-Fire) [http://daniel.friesen.name] Samer wrote: > I found it tricky to use an automated combiner thingy in that it > doesn't know the order of the javascripts to be added to the page. > > On Jul 3, 10:46 am, Thijs Houtenbos > wrote: > >> You make a good point that you put an extra load on the server by >> compressing each time (even if only a little because gzip is pretty fast). >> But this can be solved by caching the resulting big JS file, whether you do >> this with a file cache (my solution) or memcache (should even be more >> efficient). I have measured significant speed improvements by caching and >> gzipping. And each time i even change a single byte I just refresh. And >> besides when you pack the code you just let the client side waste a lot of >> CPU with each page load. This wasted CPU will become non-trivial on older >> computers and browsers and definitely when your JS code becomes over several >> hundred KiB (like Jquery UI). >> >> When you are done developing and prepare a release you can also just minify >> the JS, and let the script add them together and gzip again. This will >> improve the compression without any performance hit on the client side (min >> + gzip works better than any packer). >> >> And a last note: minifying or packing the JS is no option when you need to >> debug that JS code. :-) >> >> Regards, >> THD >> >> On Fri, Jul 3, 2009 at 4:22 PM, Rebecca Murphey wrote: >> >>> Having PHP do the gzipping is inefficient, IMO. The PHP has to run >>> every time someone requests the file anew; if you compress the files >>> as part of the release process, then they are static files that the >>> server simply has to serve. >>> > > > --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups "jQuery Development" group. To post to this group, send email to jquery-dev@googlegroups.com To unsubscribe from this group, send email to jquery-dev+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/jquery-dev?hl=en -~--~~~~--~~--~--~---
[jquery-dev] Re: Join several JS scripts into one big file to lower http request
I found it tricky to use an automated combiner thingy in that it doesn't know the order of the javascripts to be added to the page. On Jul 3, 10:46 am, Thijs Houtenbos wrote: > You make a good point that you put an extra load on the server by > compressing each time (even if only a little because gzip is pretty fast). > But this can be solved by caching the resulting big JS file, whether you do > this with a file cache (my solution) or memcache (should even be more > efficient). I have measured significant speed improvements by caching and > gzipping. And each time i even change a single byte I just refresh. And > besides when you pack the code you just let the client side waste a lot of > CPU with each page load. This wasted CPU will become non-trivial on older > computers and browsers and definitely when your JS code becomes over several > hundred KiB (like Jquery UI). > > When you are done developing and prepare a release you can also just minify > the JS, and let the script add them together and gzip again. This will > improve the compression without any performance hit on the client side (min > + gzip works better than any packer). > > And a last note: minifying or packing the JS is no option when you need to > debug that JS code. :-) > > Regards, > THD > > On Fri, Jul 3, 2009 at 4:22 PM, Rebecca Murphey wrote: > > Having PHP do the gzipping is inefficient, IMO. The PHP has to run > > every time someone requests the file anew; if you compress the files > > as part of the release process, then they are static files that the > > server simply has to serve. --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups "jQuery Development" group. To post to this group, send email to jquery-dev@googlegroups.com To unsubscribe from this group, send email to jquery-dev+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/jquery-dev?hl=en -~--~~~~--~~--~--~---
[jquery-dev] Re: Join several JS scripts into one big file to lower http request
You make a good point that you put an extra load on the server by compressing each time (even if only a little because gzip is pretty fast). But this can be solved by caching the resulting big JS file, whether you do this with a file cache (my solution) or memcache (should even be more efficient). I have measured significant speed improvements by caching and gzipping. And each time i even change a single byte I just refresh. And besides when you pack the code you just let the client side waste a lot of CPU with each page load. This wasted CPU will become non-trivial on older computers and browsers and definitely when your JS code becomes over several hundred KiB (like Jquery UI). When you are done developing and prepare a release you can also just minify the JS, and let the script add them together and gzip again. This will improve the compression without any performance hit on the client side (min + gzip works better than any packer). And a last note: minifying or packing the JS is no option when you need to debug that JS code. :-) Regards, THD On Fri, Jul 3, 2009 at 4:22 PM, Rebecca Murphey wrote: > Having PHP do the gzipping is inefficient, IMO. The PHP has to run > every time someone requests the file anew; if you compress the files > as part of the release process, then they are static files that the > server simply has to serve. > --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups "jQuery Development" group. To post to this group, send email to jquery-dev@googlegroups.com To unsubscribe from this group, send email to jquery-dev+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/jquery-dev?hl=en -~--~~~~--~~--~--~---
[jquery-dev] Re: Join several JS scripts into one big file to lower http request
I would absolutely use a compressor, and have your server gzip the
files. Compressors do more than gzip -- they strip out comments too.
Write a build script to do the compression (YUI compressor, JSMin,
etc.) and run that script as part of your release process. On the
server side, use a switch to indicate whether your application is in
development or production mode. Based on the state of that switch,
point your application at the combined files in production and at the
individual files in development mode.
Having PHP do the gzipping is inefficient, IMO. The PHP has to run
every time someone requests the file anew; if you compress the files
as part of the release process, then they are static files that the
server simply has to serve.
Tom Hughes-Croucher from Yahoo had a great article about build scripts
in the June issue of JSMag (http://jsmag.com). You may also find Paul
Irish's post on "Markup-based unobtrusive comprehensive DOM-ready
execution" useful if you're looking at combining your JS files:
http://paulirish.com/2009/markup-based-unobtrusive-comprehensive-dom-ready-execution/
On Jul 3, 5:24 am, Thijs Houtenbos
wrote:
> When you work with a lot of separate scripts that have to be updated
> regularly you might find it easier to add them together autmatically
> (instead of manually each time).I wouldn't use a JS compressor, on each page
> load the entire document is parsed again and that can be a significant
> overhead on the page load. Use GZIP instead, it is much faster and the size
> is ok.
>
> My solution is a simple PHP script that serves the JS. I have a folder named
> 'scripts' with a lot of .js files and a single index.php.
> You just add:
>
> The PHP code looks something like this:
>
> // WARNING: GZIP causes problems in IE6 when manually enabled. Just let
> the ob_gzhandler handle it.
> ob_start("ob_gzhandler");
>
> // Read JS
> $modified = 0; $data = "";
> foreach(glob("*.js") as $script) {
> // Read script
> $data .= "\n\n\n/* SCRIPT: $script */\n\n\n";
> $data .= "try {\n";
> $scriptdata = file_get_contents($script);
> $data .= $scriptdata;
> $data .= "} catch (e) { alert(\"Javascript error in $script: \" +
> e.name+ \" - \" + e.message); }\n";
> $modified = max(filemtime($script), $modified);
>
> // Add info to header
> $scripts[$lines] = $script;
> $lines += substr_count($scriptdata, "\n") + 8; // Add extra lines (6 + 2
> for JS)
> }
>
> // Headers
> $ETag = '"' . md5($_SERVER['REQUEST_URI'] . $modified) . '"';
> header('Content-type: atext/javascript'); // use '' for compatibility,
> application/x-javascript is not for every browser
> header("Content-Disposition: inline; filename=script.js"); // Helps IE
> cache the file!!!
> header("Cache-Control: public");
> header("Cache-Control: max-age=123456");
> header("Expires: " . gmdate("D, d M Y H:i:s", time() + 123456) . " GMT");
> header("Last-Modified: " . gmdate("D, d M Y H:i:s", $modified) . " GMT");
> header("ETag: $ETag");
>
> // Output
> echo $data;
>
> // End
> ob_end_flush();
>
> You might have to change the headers a bit, and since i've cleaned it up a
> little I don't know if it's all perfect, but this is the general idea.
> The advantage is that the JS file is loaded in one chunk with GZIP encoding
> and is cached in all browsers (even in IE6). This is not as easy to achieve
> as you might think, all headers used for caching are different per browser!
> When you modify one of the files the last modified is also updated. In my
> own script I also check the Etag and return a 304 when it's the same, this
> also helps a lot!
>
> You can also add a lot of nice dynamic info with this, I have an index in
> the beginning with the lines where the different scripts start (easier to
> help debug), and some dynamic settings are added to the JS, like a login
> timeout warning etc.
>
> I hope this example can be of some use to you.
>
> Regards,
> THD
>
> On Thu, Jul 2, 2009 at 2:51 AM, Dave Methvin wrote:
>
> > In the simplest case, you should be able to download jsmin and run it
> > from a command line.
>
> >http://www.crockford.com/javascript/jsmin.html
>
> > jsmin.exe minified.js "// Copyright (c) 2009 You and
> > Others"
> > jsmin.exe >minified.js
> > jsmin.exe >minified.js
>
> > Then include minified.js in your pages.
>
> > YUI Compressor does a better job, but the setup is a bit more complex:
>
> >http://developer.yahoo.com/yui/compressor/
>
>
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups
"jQuery Development" group.
To post to this group, send email to jquery-dev@googlegroups.com
To unsubscribe from this group, send email to
jquery-dev+unsubscr...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/jquery-dev?hl=en
-~--~~~~--~~--~--~---
[jquery-dev] Re: Join several JS scripts into one big file to lower http request
This might help if you can use PHP. http://rakaz.nl/projects/combine/combine.phps On Jul 1, 6:36 pm, AndyPSV wrote: > I've got on site a huge amount of js, 'single' script. What I want to > do is to pack them into one file. > Could somebody assist me in doing this? Tried before but something > crashed... > Here is package:http://rcdrugs.com/_done/js.zip > > I've posted this question on several boards: > -http://www.experts-exchange.com/Programming/Languages/Scripting/JavaS... > -http://forum.webhelp.pl/viewtopic.php?p=906036#906036 > -http://forum.php.pl/Polaczyc_wszystkie_pliki_js_w_JEDEN_wielki_t12413... > > nobody couldn't / didn't know how to help. Thanks for help. --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups "jQuery Development" group. To post to this group, send email to jquery-dev@googlegroups.com To unsubscribe from this group, send email to jquery-dev+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/jquery-dev?hl=en -~--~~~~--~~--~--~---
[jquery-dev] Re: Join several JS scripts into one big file to lower http request
When you work with a lot of separate scripts that have to be updated
regularly you might find it easier to add them together autmatically
(instead of manually each time).I wouldn't use a JS compressor, on each page
load the entire document is parsed again and that can be a significant
overhead on the page load. Use GZIP instead, it is much faster and the size
is ok.
My solution is a simple PHP script that serves the JS. I have a folder named
'scripts' with a lot of .js files and a single index.php.
You just add:
The PHP code looks something like this:
// WARNING: GZIP causes problems in IE6 when manually enabled. Just let
the ob_gzhandler handle it.
ob_start("ob_gzhandler");
// Read JS
$modified = 0; $data = "";
foreach(glob("*.js") as $script) {
// Read script
$data .= "\n\n\n/* SCRIPT: $script */\n\n\n";
$data .= "try {\n";
$scriptdata = file_get_contents($script);
$data .= $scriptdata;
$data .= "} catch (e) { alert(\"Javascript error in $script: \" +
e.name+ \" - \" + e.message); }\n";
$modified = max(filemtime($script), $modified);
// Add info to header
$scripts[$lines] = $script;
$lines += substr_count($scriptdata, "\n") + 8; // Add extra lines (6 + 2
for JS)
}
// Headers
$ETag = '"' . md5($_SERVER['REQUEST_URI'] . $modified) . '"';
header('Content-type: atext/javascript'); // use '' for compatibility,
application/x-javascript is not for every browser
header("Content-Disposition: inline; filename=script.js"); // Helps IE
cache the file!!!
header("Cache-Control: public");
header("Cache-Control: max-age=123456");
header("Expires: " . gmdate("D, d M Y H:i:s", time() + 123456) . " GMT");
header("Last-Modified: " . gmdate("D, d M Y H:i:s", $modified) . " GMT");
header("ETag: $ETag");
// Output
echo $data;
// End
ob_end_flush();
You might have to change the headers a bit, and since i've cleaned it up a
little I don't know if it's all perfect, but this is the general idea.
The advantage is that the JS file is loaded in one chunk with GZIP encoding
and is cached in all browsers (even in IE6). This is not as easy to achieve
as you might think, all headers used for caching are different per browser!
When you modify one of the files the last modified is also updated. In my
own script I also check the Etag and return a 304 when it's the same, this
also helps a lot!
You can also add a lot of nice dynamic info with this, I have an index in
the beginning with the lines where the different scripts start (easier to
help debug), and some dynamic settings are added to the JS, like a login
timeout warning etc.
I hope this example can be of some use to you.
Regards,
THD
On Thu, Jul 2, 2009 at 2:51 AM, Dave Methvin wrote:
>
> In the simplest case, you should be able to download jsmin and run it
> from a command line.
>
> http://www.crockford.com/javascript/jsmin.html
>
> jsmin.exe minified.js "// Copyright (c) 2009 You and
> Others"
> jsmin.exe >minified.js
> jsmin.exe >minified.js
>
> Then include minified.js in your pages.
>
> YUI Compressor does a better job, but the setup is a bit more complex:
>
> http://developer.yahoo.com/yui/compressor/
>
> >
>
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups
"jQuery Development" group.
To post to this group, send email to jquery-dev@googlegroups.com
To unsubscribe from this group, send email to
jquery-dev+unsubscr...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/jquery-dev?hl=en
-~--~~~~--~~--~--~---
[jquery-dev] Re: Join several JS scripts into one big file to lower http request
In the simplest case, you should be able to download jsmin and run it from a command line. http://www.crockford.com/javascript/jsmin.html jsmin.exe minified.js "// Copyright (c) 2009 You and Others" jsmin.exe >minified.js jsmin.exe >minified.js Then include minified.js in your pages. YUI Compressor does a better job, but the setup is a bit more complex: http://developer.yahoo.com/yui/compressor/ --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups "jQuery Development" group. To post to this group, send email to jquery-dev@googlegroups.com To unsubscribe from this group, send email to jquery-dev+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/jquery-dev?hl=en -~--~~~~--~~--~--~---
