LiteSpeed cache is loading unused css/js files

Hi,

Just my humble experience:

For css, you can use ucss (unique css) which will make a “package” of used css for each page.

For js, perhaps, you can use “Plugin Organizer” (a wonderful plugin) which allow you to only load the plugins you want for a category, posts, products …

For the required plugins, you can of course defer js files which are not immediately required (look at “page optimization”).

Best regards

thank u so much for your help,

Just to understand please. how do I use UCSS for each page in LiteSpeed and also I tried js optimization but its breaking my website elements. But at same time its slowing the website as you can see in this image https://bigbrandsaver.com/wp-content/uploads/2024/01/litespeed-files.png

So what do you suggest ?

Thank you so much in advance ^`^

You can try “Litespeed Presets” and choose an optimization level, or manually set each parameters of optimization.

In both cases, you’ll need to run some tests, as some pages may not display correctly.
For finer tuning, the manual method is more precise, as you choose whether or not to activate each optimization.

To set up UCSS, it’s in the page optimization settings: the css actually used for each page is generated by quiq.cloud (read the documentation).
But UCSS isn’t magic: sometimes there are difficulties in establishing these css rules, and you have to manually add any that may be missing.
Furthermore, it doesn’t necessarily improve loading time – it depends on the site.

What you really need to try is CCSS (critical css), which allows you to load (online) and therefore very early on, the minimum css required to display the start of a page (above the fold).
Efficient and simpler than UCSS.
Likewise, it uses quic.cloud credits.

For JS, it’s also not a good idea to combine scripts, and it’s possible to exclude from “deferred” some scripts that need to be loaded early.

You’re using Elementor, which is a very heavy site builder… I think that before trying to optimize, you should try to lighten things up.

All this requires a lot of testing: it can take a long time to get the “right compromise”.
That’s why it’s safer to carry out optimization tests on a staging site and then duplicate configuration to the production site.

The Lscwp documentation is very well done, and you’ll find plenty of explanations.