Dennis Heldens

The homeslider load all images before showing them, and when these are more then 4 images and they're (relative) big, this blocks all (mostly 4) connections from the browser, and because of that the site is loaded slowly: My site with 6 slides was fully loaded after 4,5 seconds. (See first attachment) I've made an improvement, wich gives an big performance boost: Only load the slides when needed, so only 1 connection is used for slide image, the rest of the connections can download the site. Now the fully loaded time is 2,5 seconds! (See second attachment) The change is very easy: In homeslider/homeslider.tpl, add the bold code: {if $slide.active} <li><a href="{$slide.url}" title="{$slide.description}"><img src="{if ! isset($notFirst)}{$smarty.const._MODULE_DIR_}/homeslider/images/{$slide.image}{/if}" src_loadonshow="{$smarty.const._MODULE_DIR_}/homeslider/images/{$slide.image}" alt="{$slide.legend}" title="{$slide.description}" height="{$homeslider.height}" width="{$homeslider.width}" /></a></li> {assign "notFirst" "1"} {/if} In homeslider/js/homeslider.js, add the bold code: $('#homeslider').bxSlider({ infiniteLoop: homeslider_loop, hideControlOnEnd: true, pager: true, autoHover: true, auto: homeslider_loop, speed: homeslider_speed, pause: homeslider_pause, controls: false, onBeforeSlide: function(currentSlide, totalSlides, SlideObject){ img = SlideObject.find('img'); if (img.attr("src")=="") { img.attr("src", img.attr('src_loadonshow')); } } });