Hey Squazz, that’s right the slideshow scripts are currently loaded on every page. I’ve got some performance improvements planned for the next version of Meteor Slides, including loading those scripts conditionally, combining and compressing the scripts, and also reducing the number of images used for the slideshow navigation.
In the mean time there are steps you can take to speed it up for your own use. Like if you only have a slideshow in the homepage, you can load the scripts on just the homepage. Or you could disable the scripts completely, and add these to your theme so that you can get the most control over them.
If performance is a major concern you could remove all the scripts and stylesheets from your plugins and load just a single compressed script and stylesheet from your theme. If you aren’t already doing so, I have found that the biggest speed boost you can get with a slideshow is from using an compressor in the slide images. Taking 160k images and crunching them down to 80k can have a way bigger impact than a 20k script. Or simply switching from 10 slides to 5 slides can cut the load time in half!
Thread Starter
Squazz
(@squazz)
Thank you so much for your reply. This must be one of the best replies I have gotten on a plugin support so far! 😀
I am so glad that you are aware of the problem, and is focussing on fixing it. Speed is (at least for me) almost everything, as long the job still gets done. You are probably aware of how to do this properly, but I just stubled upon this post the other day: http://scribu.net/wordpress/optimal-script-loading.html, and I plan on doing something like this myself.
I will try to look at just loading the scripts on my homepage. Or as you suggest, disable them and then with my own code control when they are loaded.
About using 5 images instead of 10, and compressing images, these two things is something I would like to dwell a little more with.
From my perspective, we should not load all of the images in the same batch. We should lazy load them. It should not matter if we have 5, 10 or 20 images. We should only load the first image to start with, then the next one when needed. Maybe, load the first two and then wait. One of the reasons is that I want as fast a initial pageload as possible. Secondly, I see that many of my users are only seeing the first, maybe the second image. When this is the case, it seems like a waste to load 5 images if only two of them is being shown to the user.
About compression, then there is no doubt that you are right about that the images is the heavy load. But you can’t do anything about our images (at least, I don’t want you to 😉 ). What you can do instead is ensure that your plugin is as light as a feather 😛
I myself, is working on some way to use pictureFill 2 on all of my sites. As well as leveraging Photon from JetPack. These two tings combines seems for me to be the way to go if we want to have high quality images that loads fast.
Once again, thanks for the reply.
Keep up the good work, I’m looking forward to the update 🙂
You’re welcome Squazz, I’ve got a few ideas for optimizing the scripts, but I’m still doing some research on the best approach to take.
I haven’t tried PictureFill 2 or Photon yet but I should really look into those!
Thread Starter
Squazz
(@squazz)
I may have found a solution for how you can load the JS & CSS files only when needed. But I’m sure you will like it.
Originally i just searched for a shortcode, and then added the scripts and CSS if the shorttag was found. But this gave some problems with my specific setup as I’m using the PHP version directly in a template. Futhermore I’m quite sure it won’t work with widgets?
In short, what I did was to just move the loading of JS & CSS to meteor-slideshow.php, and then edit the path to something like this:
plugins_url( '/meteor-slides/js/jquery.cycle.all.js')
It works, but I’m not sure it wil ALWAYS work. Futhermore it kinda moved code to somewhere where it doesn’t belong. Even though I feel it kinda belongs there anyway 😉
If this is something you wanna chat about, discuss different approaches, I’m willing to do that. I’m rather interested in it myself. But, if you want to do that is there then somewhere we can chat about it instead of using the WordPress Support page?
That’s an interesting idea! I know there were a few different techniques for checking if scripts should be loaded, but at the time they were more resource intensive than just loading the scripts on every page. I haven’t researched recently to see if there is a better way now though.
Feel free to get in touch with me on my website if you’d like to.