This is searchable archive of our old support forums, which operated from 2012 - 2016. To find out how to get support for your current theme, please visit our support page.

Tagged: 

Sliders plugin loads slowly

  • Creator
    Topic
  • #10907
    royeyal
    Participant

    It’s not a bug per se, but still.
    Lately I’ve been getting complaints from clients that sliders from the Theme Blvd Sliders plugin load slow.
    You see that spinning circle for 2 seconds, and only after that the slides form and push the content down.
    I love the Sliders plugin because it’s as simple as it gets.
    But I wish it could load as fast as the Royal Slider plugin.

    And on that note, that you could a swipe script so that slides could be dragged on touch screens.
    Thanks.

Viewing 4 replies - 1 through 4 (of 4 total)
  • Author
    Replies
  • #10926
    Jason Bobich
    Keymaster

    Are you using the standard slider type? If so, there is already swiping gestures built-in to Flexslider. Swiping works fine on my end, with my iOS devices anyway.

    Unless your slider has a YouTube or Vimeo video embedded in it, the loading of the slider is most likely not root the cause of your issue. As suggested in the Flexslider basic usage instructions, Jump Start calls the flexslider() method using jQuery’s .load() method of the browser window.

    In other words, the slider isn’t even initialized until your webpage is fully loaded. When you see that loading icon, you’re not seeing the slider loading, you’re seeing the rest of your site loading, while the slider is waiting to initialize. Once the slider is initialized, it should pop in instantly because the client’s web browser has already loaded everything on your site. — That’s the purpose of this. It allows for the slider to always come in smoothly without any glitches.

    So, the question is not of how you can get your slider to load faster. The question is how do you get your webpage containing the slider to load faster? —

    I would re-evaluate what is on the page displaying the slider. Do you have any iframe content from external sources? Like Vimeo or YouTube? Or maybe streaming items from Facebook or Twitter that are not cached?

    Do you have many other plugins on the page that require javascript?

    Are you caching your site and minifying scripts? Are you using a CDN service for feeding images? If you’re not doing these things, this will make a giant difference in how fast your website loads in the client browser. Pairing W3 Total Cache with Amazon S3 is a great solution for these things.

    #10937
    royeyal
    Participant

    Thanks for lengthy reply.

    Most of my clients are using shared hosting services, and the page loading performance is as you would expect from a shared hosting service. GoDaddy are the worst on that part.

    I am talking about regular ol’ image slides.

    “the slider isn’t even initialized until your webpage is fully loaded”
    The thing is that the FlexSlider loads after every element on the page has been loaded, while other slider scripts don’t wait for the every element on the page to be fully loaded.

    See that circle on the screenshot? It won’t go away until the page fully loads.
    http://d.pr/i/L4d5

    I can minify stuff, but the thing is not the page loading but the behaviour of the script. I wish it could load asynchronously.

    Also, swiping does change slides, but you can’t drag the image with you finger.

    Again, these are not bugs, but input I’ve getting from my clients.
    They love the simplicity, but they don’t like that the slider loads last.

    I guess it’s up to the script, but again, just a wishful thinking.

    #10939
    Jason Bobich
    Keymaster

    See that circle on the screenshot? It won’t go away until the page fully loads.
    http://d.pr/i/L4d5

    Yes, this is correct and what I was trying to describe. Once your page is fully loaded, the slider can be called and will then fade in.

    If you wanted to customize the function where Flexslider script is outputed, you could do that. The function “themeblvd_standard_slider_js” is pluggable and is found within Jump Start (/framework/includes/helpers.php). You’d just remove the wrapping jQuery .load — I’m not sure what the result will be, but I’d imagine it just won’t come in as elegantly.

    #10954
    karlo
    Participant

    I wonder if they would complain if height of slider was fixed per on the fly calculation? So initial height was set by Flexslider not Jump Start? Right now it seems CSS from Jump Start is on top. Min-height: 100px for “standard-slider-wrapper .slides-wrapper”. If Flexslider did this dynamically there would be no pushing. That annoys my eyes. Fading in when done is ok though. What load spinner hints.

    Do not think CSS can do this, must be Flexslider and there could be reasons why they have not.

    Post fix if there is one among the 100s of issues https://github.com/woothemes/FlexSlider/issues 🙂 I bet it has come up before.

Viewing 4 replies - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.