Ok, let's start from the beginning.
Firstly, you should be running Chrome's Lighthouse test to detect any performance related issues. In Chrome, press F12, then go to the Audit
tab.
I ran an audit on Desktop with no throttling and the performance is simply terrible.
So, first thing first, disable the Joomla JCH Optimize plugin so that you can see all of the assets being loaded.
1 - General:
You appear to be loading way too many assets and your Node list is over 4.5k when it should be under 1.5k. Start thinking about changing your page structure and moving certain elements to other pages if need be. Only display critical content on the homepage.
As for the many assets, one example being that you're loading 7 fonts. This simply isn't justified at all. If you want to load FontAwesome for icons, that's fair enough, but you do not need 6 other fonts to style your content. This is poor design. Choose 1 font for your brand, stick with it, and remove the rest.
2 - HTTP/2.0:
Get a free SSL certificate from LetsEncrypt, install it on your server, then enable HTTP/2.0. This update changes the way assets are fetched and thus will reduce the time taken to load them.
3 - LazyLoad:
A good website in 2018 renders the HTML first with a small chunk of critical CSS so that the initial page load doesn't look all over the place. Once the basic HTML is loaded, you then lazy load your CSS, JS and images. What you're currently going it loading all CSS and JS in the <head>
, meaning the browser will wait until they have downloaded, before it continues rendering the rest of the HTML.
I prefer doing this at the template level (faster) rather than relying on plugins...but then against, I'm a UI developer so I develop my own templates.
You may want to consider building your own template.
Someone I've personally worked with on the Joomla CMS has some great tutorials on how to create your own template:
https://www.youtube.com/channel/UCSinMbPPdEPx6Hw5QcueITg/featured
4 - SVG'S:
There are several images on your site that can be SVG's instead of PNG's. You're loading 200x200 pixel images and they're being rendered at 94x94. Start using SVG's which will in most cases be smaller in size, and won't lose clarity when the page is zoomed in or on a retina device.
5 - Images:
Your images are simply too large in size for what they are. Each slider image is between 250kb and 500kb. Furthermore, the images are not lazy loaded.
For images such as photos or anything else that won't perform optimally as an SVG, use WEBP which is a format developed by Google. You will need to have a fallback for browsers that don't support it though.
5 - Caching:
Do not use PHP to cache your assets! Do it at the server level (Apache, NGinx, etc). Have a look around for some tutorials on this or maybe talk to your hosting provider/server amdinistrator.
I hope this gives you a little insight to help you improve your product.