• Hi all,

    I am using Lightspeed Cache for caching and page optimization. The plugin has options to combine CSS and an option to combine JS.

    When would it be best to use these? My page is a bit slow but wouldn’t combining them make things worse since I can’t defer unneeded CSS/JS?

    The page I need help with: [log in to see the link]

Viewing 7 replies - 1 through 7 (of 7 total)
  • Thread Starter tdammon

    (@tdammon)

    Hi @keithjobss34,

    I have a plugin already that can do CSS/JS combine. I am just not sure when I would want to do this or how I can test and make sure it is advantageous for my application.

    Moderator threadi

    (@threadi)

    No matter which plugin you use – when you combine the files is more a question that you decide individually on the project. I usually activate it first and then test whether everything works as it should. If something is not right somewhere, then I deactivate some of the settings.

    That is generally the big question and as threadi mentioned, activate and test.

    Have you managed to discover which scripts and CSS work when combined?

    I use Lightspeed Cache on my Rough Pixels website, and that setting is usually quite risky–I’ve left it off while working with the configurations of other settings. The part that takes time is to test out the combining of CSS first. Enable that one and go through your website to see if anything looks odd. Do the same with the JS scripts. However, with the scripts, this requires you to test anything that your website has that uses scripts–then try them out. If everything seems to be functional, then you’re good to go.

    With your current configuration, how does your site perform with Google Insights (pagespeed) and GTMetrix?

    Thread Starter tdammon

    (@tdammon)

    Hi @roughpixels,

    It seems like my page speed times are getting pretty good. I have noticed that the page renders some text with no background before rerendering with a background and text and then rerendering a third time with the LCP.

    The desktop is loading faster than last night when I checked this one out. Today, on GTMetrix, you have 96% and Google PageSpeed Insights, 91%.

    One thing I did notice though, your front page is 1.97 MB in size, which is really large; fonts are taking up 1.15MB. That part is great. It’s the mobile views.

    I also see “Reduce unused JavaScript” is taking up to 1.6 seconds to load. I’m not sure what js files are loading (and/or combined), but there could be ones that are not needed. Hard for me to see as I don’t know what you have installed and active on your website.

    Ultimately, if you can get the total page size down from 1.97 MB, then you should be loading much faster in mobile.

    Regarding text loading without the background, this will more likely be the result of the page waiting for other things to load first.

    Thread Starter tdammon

    (@tdammon)

    @roughpixels,

    yes I noticed thats fonts were accounting for a large portion of the total size. There are some unused fonts from my theme (Haptic). You can see them in the GTMetrix waterfall view. I am not sure how to prevent the request for those. I am really only using two fonts. When I check my sources tab I can see I am making calls to Google API Fonts and Gstatic fonts for some overlapping font families.

    I see that you are using Elementor…I don’t use page builders, however, I am wondering if Elementor has a method to disable things like fonts, or to defer the loading, etc. The same for JS and CSS files when they are not needed. Of course, this also depends on third-party plugins if they are dependent on these JS files to be loaded. Do they have Mobile settings?

    You might want to venture over to the support for Elementor and find out if things like fonts and some JS can be held back from mobile loading. It appears your desktop is fine; it’s the mobile that is the problem at the moment.

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘When to Combine CSS/JS’ is closed to new replies.