Hi Andy,

Yes, I see that something is not working properly on your site. We have incorporated many optimizations into LayerSlider, and using several sliders at the same time should not cause such problems. At layerslider.com, we use several sliders at the same time.

I can recommend you to open LayerSlider Settings, and enable the settings seen on the attached screenshots under Performance & Project Settings menu.

Please note, that performance issues can also caused by not optimized plugins, or a slow server (or slow internet connection). I would recommend you to temporary switch to a default WordPress theme and disable all plugins except LayerSlider for testing.

Please let me know if these steps helped solving your issues.

Hello Andy,

The images are not showing because - as I can see - you are using an image optimizer / lazy loader plugin (or theme feature). LayerSlider has a built-in solution for that, so, please disable the third party plugin and the images will be visible.

Hello Andy,

Please create me a temporary wp-admin access, I would like to check the settings of the sliders. They should appear much earlier.

Hello Andy,

Thank you for the login credentials and for your patience.

I've investigated your sliders and found, that the mobile-versions are often too tall. If "Start in viewport" option is enabled, sliders are starting their animations when their half size (vertically) are already visible on the screen (as you scroll down). If the slider is very tall (the aspect ratio is larger than 1:1.75), you will need scroll down more, than a half-screen till the animations will be triggered.

Currently, there are two solutions for this:

1. Please disable "Start in viewport" under Project Settings -> Slideshow

or

2. Please "cut" your tall sliders vertically half. I mean: create two sliders with half of the original's height and embed both to your page.

Hello Andy,

"do you mean essentially having half the content on one, and then the other half on another" - yes exactly.

I can recommend you to use the following aspect ratio for mobile sliders: 1:1.75
Which means, if - for example - the width of the slider is 400 px, the height should be approx. 700-750px but not higher.

Hi Andy,

My name is John, and this ticket was assigned to me to investigate the performance issues further.

I believe almost every aspect of this case can be attributed to server speed. When I ping northgate.org.uk, it takes around 200ms to receive 64 bytes of packets. This is quite a slow response since I usually get around 30ms for most UK servers.

By default, GTMatrix uses Canada as the test location, so they likely have an even slower connection. In my test (see the attached screenshot), the Time To First Byte (TTFB) was 1.2 seconds. It means that GTMatrix had to wait 1.2 seconds to receive anything back from your server. This is the earliest measurable event, and nothing on your web page has even started to load at this point. It's very important to note that every other request your web page generates depends on this time and can have a significant effect.

The First Contentful Paint was more than 2 seconds, which is also very high. At this point, LayerSlider did not yet start loading your content, and it's the earliest time a visitor can see anything loaded from your site.

The Onload Time was 4.3 seconds, which normally would be the point when your content properly appears. However, around this time is when LayerSlider and any other script can initialize themselves and start to load their own content.

LayerSlider preloads the necessary images used in your projects that must be displayed as soon as possible. This usually means it preloads the images of any project's first slide. Sadly, slow connection times can prolong this, and that's why GTMatrix displays multiple LayerSlider entries for the long main-thread tasks and other categories. So it doesn't mean that LayerSlider itself is slow; it just means that LayerSlider initiates the loading of images, and LayerSlider itself also waits for your server.

To give meaning to these numbers, our home page (with more images, large videos, lots of sliders, etc.) has 31ms for TTFB, 148ms First Contentful Paint, 1.3s Onload Time, and 1.6s for Time to Interactive.

I also want to note that JavaScript-based interactive content such as LayerSlider has to wait until your page more or less loads. Hence, it's unavoidable to have some slowdowns that synthetic benchmarks usually don't like.