13 Apr 2019 at 13:00 #21019
Optimization: combine (some) CSS files before output?Resolved
Hey there! Have you noticed this support service is provided FREE of charge?
If you like the speed and accuracy of resolutions, please consider supporting me with a small donation. Thank you ♥
A. To reduce requests is it possible to please combine some of the CSS before final output, for example:
– style.css (child theme CSS)
Print needs to be different I’ve noticed, at least in some cases, because otherwise it will get overridden. Also combining everything may cause a large file, and breaking it up can make it into smaller loadable files, which may aid in performance.
Reason: getting warning from optimizing sites that there are too many requests. Have been working on improving load performance. I’m going through the theme and plugins to see where there are gains to be had in this use case.
In this usage case using a combination plugin (like Autoptimize) causes possible issues and is possibly not compatible with the caching implementation.13 Apr 2019 at 13:01 #21020
I lost my user login unfortunately, and don’t know which email I used. I switched domains a while ago, and could have sworn I changed it. Ended up making a new login, apologies for the inconvenience.
13 Apr 2019 at 17:39 #21025
- This reply was modified 2 months, 2 weeks ago by Oliver Juhas. Reason: Making the post public as there is no sensitive information shared
I believe by tweaking settings of such plugin you can achieve your desired results.
Many of my theme users actually use Autoptimize and I don’t think there is any CSS combination issue reported. Not sure how the plugin can cause a caching issue though, but you could ask the plugin support for that.
I’ve had a CSS combination issue with one other plugin reported and you can check the support ticket for more info. Everything depends on how good the plugin is coded.
As for your login, no worries, you can use the new user account from now on. The old account was (most likely) under the username of
and email of.
...@[ ADMIN EDIT: REMOVED ]if that helps
16 Apr 2019 at 12:46 #21041
- This reply was modified 2 months, 1 week ago by Oliver Juhas. Reason: Removing the email domain info
Thanks for the reply.
Can you please remove my info from the ticket, this is for web admins only!!! Not for public publishing!!!
16 Apr 2019 at 12:58 #21043
- This reply was modified 2 months, 1 week ago by Oliver Juhas. Reason: Making the post public as there is no sensitive information shared
What info do you mean? I can’t see any sensitive info provided in our conversation here.
If you mean the username and email in my previous reply to you, then please note that username is not sensitive info as you can see it in any reply too. As for an email, I was careful not to reveal it and I’ve only provided the part after
@. Is this a problem?
If this is not an issue, please provide a screenshot of the disclosed info so I can immediately remove it.16 Apr 2019 at 13:03 #21045
Oh, I understand now. I’ve removed the email domain from my reply. Please use your username to reset the password for the old user account if needed.16 Apr 2019 at 13:05 #21046
Sorry for any inconvenience I’ve caused. Please note though that I haven’t actually revealed any sensitive information, the email address was not complete, I only revealed the domain, which is the same like I’ve written
...@gmail.com.17 Apr 2019 at 12:08 #21061
Thanks for fixing it.
The blog is using server/cloud caching as opposed to plugin caching solution like WP Rocket Cache and Autoptimize (and yes, Rocket can interact with some server setups too). Without getting into a technical discussion too much:
1. Plugins like Autoptimize randomize the css file name, so the caching servers can get out of sync if there were to be a CSS update.
2. Plugins (can) cause extra overhead on the hosting side, which can hurt performance. Some disk based caching systems can be slower then other caches in my experience.
I don’t think it is fair that as theme developer you would have to account for all the different server caching setups.
I used Autoptimize to combine some of the CSS (when I did this manually I got errors), and then pasted the combined CSS in the child theme style.css. Then I dequeud and deregistered the style sheets.
At some point I may write a PHP script to do this with CSS automatically. I just need to figure out how to combine the CSS sheets, because I’m running into errors. Maybe because of SASS/LESS or something like that, and I have little to no experience with that. For now I will keep an eye on the updates to update CSS if needed.
A bit longer thread but hope it helps in explaining this complicated subject concisely.17 Apr 2019 at 12:49 #21062
Thank you for sharing the possible solution.
Please understand that as a theme developer making themes according to WordPress best practices I tend to stay out of the way as much as possible. Assets optimization is one of those areas that should be left for plugins or other solutions.
I’m not really an expert on similar plugins, but there maybe should be a settings option to use only CSS combination of the files from such plugin and then you can use your server caching?
As for randomization or versioning of stylesheet file names, I think it is actually a good thing that helps preventing caching issues. But probably depends on your situation/server.
As for SASS, you don’t have to worry. The theme stylesheets were produced by SASS, but all of the stylesheets are pure CSS so there should be no issue at all with their combination. SASS is not being outputted/enqueued on front-end of the website at all.
Fun fact: The trend nowadays seems to be actually to split the CSS into even more partial files (and loading them as needed per page). This should help speed up the website promoting HTTP/2 parallel loading environments.17 Apr 2019 at 12:58 #21063
Thank you for the reply. This can be marked as resolved.
The way WordPress loads scripts and styles is something I’ve found an annoyance for years, it is something I’ve worked on in the past (e.g. conditional loading) with others in the community. It’s cool to see some of that being put into practice more. :D
Yes, I’ve found a better solution possibly. Using hooks to clear a cache when there is a plugin or theme update for example.
Also removing any CSS in the parent theme that isn’t used by the child theme can make a difference too. I might do this as well, although this can be time encompassing.
Thanx for the heads up on the CSS combination.
- This reply was modified 2 months, 1 week ago by wdc_dolphin.
You must be logged in to reply to this topic.