I like using Lightbox v2 because I believe that it looks much nicer and feels "smoother" than Lightbox v1, but the overall file size of Lightbox v2 is huge when compared to Lightbox v1. I only plan on using Lightbox v2 in its default configuration, and I don't plan on using image sets, captions, or any other non-default feature. Is there a way to safely decrease the size of the .js and .css files by removing "unused" or "unneeded" code. If so, which lines would be safe to remove? Thanks in advance!
One thing you could do is compress the java script files. Just compressing prototype.js saves 25KB http://javascriptcompressor.com/ (the version of prototype on that site didn't work for me though)
Unfortunately, after trying both JavascriptCompressor and ShrinkSafe ( http://alex.dojotoolkit.org/shrinksafe/ ), I was not able to get a working compressed prototype.js, but I did manage to save 2k by deleting all of the commented lines. However, using ShrinkSafe, I did get working compressed versions of lightbox.js (saving 12k) effects.js (saving 8k) and scriptaculous.js (saving 1k).
I also tried using ShrinkSafe to combine lightbox.js, effects.js, and scriptaculous.js into one lightbox.js file and remove the call to scriptaculous.js from my header template. This worked perfectly, but the resulting file was 2k larger than the three separate files. Is there any advantage to having the three scripts combined into one?
Also, is there any advantage to using JavascriptCompressor over ShrinkSafe? When discussing his compressed prototype.js, the author mentions, "Because of its complexity I first ran it through Dojo ShrinkSafe to achieve some code reformatting."
Also also (last thing for now, I promise), while hunting for information on prototype.js, I ran across moo.fx ( http://moofx.mad4milk.net/ ), another effects script built off of prototype.js. They provide a "prototype.lite.js" which only contains the functions required by moo.fx and is only 3k. If there any way of making one of those stripped down prototype.js files for Lightbox?
Shrinksafe didn't work for me either, so I ran a different one ( http://dojotoolkit.org/docs/compressor_system.html ). After I passed prototype.js through it the JavascriptCompressor worked fine. The advantage of having them combined is just the saved space in the html file I think. I'm not sure about shrinksafe, but the thing I linked to (which you run on the command line) strips all comments/whitespaces and renames variables. Maybe, I know there are lots of users out there that would love to see lightbox use moofx/prototype.lite
Here's my compressed version: http://sandbox.portablesofdoom.org/prototype.compressed.js
That worked, Gannon, thanks! I used the web-based ShrinkSafe (because command-line hates me) followed by JavascriptCompressor to compress the other files as well, and you've saved me a ton of space and page load time. Out of curiosity, since you have access to the command-line encoder, do you see any speed improvements when you apply JavascriptCompressor's Normal encoding and "Fast Decode" option (under the "Advanced Settings") to the command-line-compressed prototype.js file?
In that case, would you mind posting the prototype.js file just compressed with the Dojo Toolkit command-line encoder? If I can, I'll run a few tests on JavascriptCompressor's "Fast Decode" tomorrow.
These are great efforts to speed the loading time of lightbox by compressing the scripts. How much page loading time is actually saved with the compressed versus uncompressed versions of Lightbox 2? The difference of course would be seen mostly with a dialup connection. Thank you for your work on this. ---Terry http://www.photostuff.org
Before optimizing the script file, my site would load in approx. 112 seconds on a 56k connection, now it apparently loads in approx. 40 seconds on a 56k connection.
You can check you site's loading speed with this tool: http://www.websiteoptimization.com/services/analyze/
I'll be checking the scripts with the Fast Decode feature later today, and will let you know how it turns out.
Compressing the files with the Fast Decode option makes no difference whatsoever. After using the Fast Decode option, the files were about 500 bytes larger, and there was no marked improvement in loading speed.
As for the loading speeds that I quoted before, my site must have been under stress when I ran the first test. With uncompressed Lightbox files, it loads in 48.77 seconds on a 56k connection and in 40.59 seconds with compressed Lightbox files.
Gannon, I read in another thread that you were in the process of porting Lightbox to moo.fx. I wish you the best of luck. Please let us know when you have finished it or have any beta releases to test.
I'm a bit tired from working on this for now, so I'll put it up incase anyone else wants to give it a shot. Right now it (for reasons I can't see at the moment) sticks on the loading image. I commented out the effects and replaced them with the code to do them instantly (because I haven't gotten around to converting all the effects to work with moo.fx) http://sandbox.portablesofdoom.org/litebox.js
I forgot to say, since prototype.lite doesn't have the event watcher you have to add <body onload="initLightbox()"> Also, remember that right now litebox is basically a non-working alpha.
<div style="background:#eee;border:1px solid #000;padding:3px;"><b><font size="5" color="#000">GET YOUR WORKING COPY HERE</font></b><br> <a href="http://doknowevil.net/litebox">here</a> is a working copy without effects.<br> <a href="http://doknowevil.net/litebox/litebox.zip">zip file here</a> </div> <br><br> Gannon, just wanted to let you know, I'm hosting this to speed up development, I'm not trying to take credit. With that said, I'm gonna go dive in and see if I can't get this working :-P
The error is caused by like 413, I don't know why yet. Investigating now... will report back :-P<br><br> <b>edit</b>: Oops, looks like someone had a spelling error >> outerImageContainter != outerImageContainer <br><br> problem solved :) <br><br> ONWARD! <br><br> <b>Edit 2</b>: I updated my links in the above post to reflect my progess. The close button now appears, I'll add effects in a second :-P.<br><br> Gannon, you should IM me.
<span style="color:#5577FF"><b>UPDATE:</b></span> gannon and I are colaborating via AIM to bring you folks a compressed sexy version of lightbox v2. We've gotten some of the effects to work and will start combining / compressing the scripts to the best of our abilities over the course of the next week.<br><br>I hope you're all as excited as I am :).
Im keeping an eye on the exciting developments. Thanks for your time on this. Im at work now so I cant look at it in more detail, but I will early next week. --Terry http://www.photostuff.org
I've been making some progress... I'll probably have a version 0.9 released by tonight or tomorrow night, though I wouldn't call it suitable for use quite yet.