Figure out why the page speed is slow

Our slider only loads after everything else finished loading on your website to be able to calculate the positions where everything should be, so in a lot of cases the problem is the website's speed, not the slider's!

Sometimes websites are becoming slower and to figure out what is causing the issue, use Chrome or Firefox.

Go to the page with the problem -> press F12 -> click on Network -> refresh the page (in Windows with Ctrl + F5 [hard refresh to not load anything from the browser's cache.]) This will write out what is loading for how long on your website, like this:

Common problems and solutions

1

Too big images are used

When there are too big images used, they have noticable longer loading times.

Solution

You should check out its filesize and don't use bigger, than 1MB images. If they are PNG images, use JPG instead if it's possible, because they have smaller filesizes.

If these images were used in the  background of your slides, we have an Optimize images option, what you can use within our system to resize your images to the slider's size or to the given size.
But if you used many very big images, the memory_limit on the server can be easily reached by this option, which can cause blank or messed up pages on the frontend of your website. Your admin area will still stay fine, so you can turn this option off, if you would see that issue at the page with our slider on. In this case you have to resize your images on your computer manually.

2

Too high quality images are used

If your image is loading for a long time while it doesn't have a big filesize, it means the image has too high quality and the time you see there is the time your browser takes to draw the image into the screen.

Solution

If these images were used in the  background of your slides, we have an Optimize images option, which has a quality setting. You can use this option within our system to resize your images to the slider's size or to the given size.

PHP image resizing isn't always the best and you might want to have better quality. In this case use  Photoshop or GIMP to lower your image's quality, which will give a much better result.

3

Too many images are used

If you have many images, the waiting time (green part) can take longer, than the actual loading of the image. This happens, because not all your files can load together, but they have to wait for each other.

Solution

If these images were used in the  background of your slides, then use our lazy loading option. This is a PRO version feature and with this you can make only a certain number of images load, which could be for example 1 image and then the other ones would only load, when they have to. If you have the FREE version sadly there isn't any other option, than using less slides. We don't suggest using more, than 12 slides.

If your images were used as  layers and their filesizes aren't big, like they are under 100KB, try out the Layer image embed into HTML option. This option will replace your images with base64 html codes, which could be good, because this way your images don't have to come one-by-one from the server, but they would be included in the html code of your website, so there would be no connection time to the server for each image. You should probably only use values under 100KB in here, because this option basically changes your images into texts and with bigger files this text can become quite long and at that point connecting to the server and getting the image could be faster.

4

Time to first byte

The first row you see in this loading is the time to first byte value. This is the time your website's PHP codes are running on the server and once that is done, this loading is finished and the website's html structure can be started being built up by your browser.

If this seems to be too long, you can try to use cache on your website:

This could help, because the way cache plugins are working is, that they are saving down the html code of your website and they won't allow the PHP codes to run, they will just display the html code they are storing. Since PHP codes wouldn't run like this, only a few asking down this html code, your site will need to spend less time on the server.

5

Too many CSS and JS files

In frameworks, like WordPress or Joomla it is common, that there are a ton of CSS and JS files called in, as each plugin/extension needs its own file. These have to wait for each other, also each file has to connect to the server, which can take some time.

Solution

Use a CSS/JS minification plugin, which combines these files as well.

But make tests to see if everything works well! The javascript file combination/minification often causes problems in plugins/extensions, but the css combination/minification can create some bad results too.

Smart Slider 3 option: we have an option to combine our JavaScript files. And our files are minified by default.

6

Missing files

When there are missing files, it can take a while until your server stops trying to load them and this can take up a lot of loading time too. These are marked red and the status is probably 404 or 500, also you can copy out the link to check it in your browser.

Solution

Either remove it from your website where those files are called in or make sure you will have those files in the places from where they are called in.