How to speed my website, any suggestions?

[kostianev]

Dear, I have latest Joomla 3.8.1 website with installed VirtueMart 3.2.4 all plugins and modules are updated, also I deleted any modules and components which I am not using on the website. I need ideas how to speed my website, the client want the images of the products to be with Better quality, so I can`t reduce the size because the quality is not good.

I ping the Category page with Pingdom and see this results. Can someone advice me something?

I installed JCH Optimizer for Joomla PRO Version and now is running with Intermediate settings, because broke the website with heigher when I try.

[Ghost]

You have slow server response time. This is usually caused by database queries. You need to enable Joomla debug and see which queries take too long.

[balai]

As Ghost said, the server response seems to be the most crucial. You need some debugging to find the bottleneck.
You can use some caching there such as JotCache

Beyond that 90% of your requests regard images and scripts, a CDN could reduce the response time for these.

[jjk]

In my opinion the main speed problem on the page https://www.nikolecollection.com/tuniki are the images and the image animation. All image dimensions are larger than the displayed images, so each one has to be resized on the server before it is supplied to the browser. If you are displaying 189px x 284px images, use 189px x 284px thumbnails on that page (I've seen 1200px x 1800px!). And remember that browsers load one image after the other, so consider to reduce the initial number of products from 24 to 16 or 12.

[Studio 42]

Max width is 345px, so you should set thumb width in Virtuemart to 345px.
Your website do not support http2.
see https://tools.keycdn.com/http2-test for a test for eg.
This mean that the images are loaded Step by steps. http2 use multiplexing.
See https://blog.newrelic.com/2016/02/09/http2-best-practices-web-performance/
My tool vm be pro can now generate webp images.
See https://optimus.keycdn.com/support/jpg-to-webp/ for the benefict.
I added support for tinypng to optimise size see https://tinypng.com/developers to get 500 images per month free.

The other problem is that your javascript are not defered, but i'm pretty sure that 80% can be defered And you have so many script. Do you really need all this?
Eg; Owl-carroussel, in home is not used, fancybox too and certinaly 2 or 3 more.

[jjk]

@Studio 42
If I'm not mistaken, webp achieves smaller sizes primarily by using a 4.2.0 Chroma subsampling instead of 4.4.4, which means you loose color information in images with fine details. Another point is, that webp is not supported in Mozilla's Firefox browser (just checked in the FF56 64-bit version). So you would have to provide a jpg fallback for Firefox users.

[Studio 42]

@Studio 42
If I'm not mistaken, webp achieves smaller sizes primarily by using a 4.2.0 Chroma subsampling instead of 4.4.4, which means you loose color information in images with fine details. Another point is, that webp is not supported in Mozilla's Firefox browser (just checked in the FF56 64-bit version). So you would have to provide a jpg fallback for Firefox users.

jjk , i know that you need high res images, but in hes case i mean not.
You can serve webp for specific browser only using 1 rules in .htaccess for a whole website, no need to modify more for firefox(you can test my shop, it serve the right always).
tinypng service has same problem, it remove meta datas in image, you have no universal solutions, it depend your needs, i only give some solutions.

[Milbo]

All image dimensions are larger than the displayed images, so each one has to be resized on the server before it is supplied to the browser. If you are displaying 189px x 284px images, use 189px x 284px thumbnails on that page (I've seen 1200px x 1800px!). And remember that browsers load one image after the other, so consider to reduce the initial number of products from 24 to 16 or 12.

There is a misunderstanding. The server does NOT resize any image, delivering the html. It is your browser, which does that. But on one hand you are right. VM uses in the standard template only thumbnails now. There is a new setting called Fullimage width and Fullimage height. He should just set there a decent value. Usually you just set the width. Then your images are thumbnailed automatically.