I do not think this is the main problem. Your site suffers from YANGNI. I interpret that you download files that you either not use or may be use a only tiny bit of.
For an example you download jquery, but you only use 30 percent of this “framework”.
What about the images size , i been doing some tweaking in the website also found the file size is making a difference too and i want to ask if there is any place where i can compress the file by alot without losing quality ?
Did some changes but when goes down to the jquery , half of certain functions are not being used and i wonder if deleting those wouldnt mess up with things ?
I don’t think messing around with the jquery code is a particularly good idea. You’re talking thousands of lines of quite complex code. That and what happens when you need to update jquery in the future?
It also seems a bit like overkill to me. Surely you should be able to have an efficient website with jquery.
Alternatively, if you do want to cut back on jquery, then you could consider cutting it out completely. Look for a carousel that isn’t dependent on jquery like glide or glider. Doesn’t bootstrap have a built in carousel as well?
From a quick scan of your custom code, the only other use of jquery is for an animate feature. You could possibly look into a javascript and/or css alternative.
I agree. Even better is just to skip loading the Jquery library. And then run the pagespeed.web.dev. If it loads faster without Jquery, then focus to replace Jquery with smaller vanilla Javascript. Otherwise look into the carousel as a next step.
The loading time is the problem. Not the Jquery itself. So loading 70 percent obsolete code may or may not cause the slow LCP. Skip loading Jquery is just a way to find out if this is the problem.
But if you look at all the redundant code (red) that is loaded in many files this indicates that you have some more work to do. It is almost never only one thing you have to polish.
Next thing to explore is the carousel. Do not load this library and look what score you get.
Then you can look at all libraries that is almost completely red (minimal usage).
Its been quite challenging to figure out how to do this jquery thing since i want to finish this as soon as possible. The lcp might also be because i reduced a bit the size of the image
I have been looking at both glide and glider in the browser and mobile, and glide seems the more polished of the two. In fact with glider, I couldn’t even scroll down through the examples page.
In glide when you swipe it scrolls to the next image, snapping into position. In glider it scrolls just like a scroll bar, without any snapping.
So just from viewing the examples, personally I would lean towards glide instead.
Nice it works , for the other pages do i have to replace them with the glide even though they dont use carrousel or what options would i have in there ?
In answer, you only need to import glide on pages that have a carousel. glide is not a multi-purpose library like jquery, it is a standalone module/script that has the single purpose of creating sliders/carousels.