@a223123131 that’s a good point and critical CSS has been implemented in Asset CleanUp Pro, but the downside (at least for now, managing it within the Dashboard is a feature that is taken into account) is that it requires editing functions.php (from your child theme) or using a custom made plugin in addition. Here’s the documentation: https://assetcleanup.com/docs/critical-css-how-to-implement-it-to-completely-reduce-render-blocking-stylesheets/
Note that Asset CleanUp Pro does not extract the critical CSS for you. It just allows you to implement it if you already have the CSS syntax. There are services such as CriticalCss.com that allow you to do that.
Thanks @gabelivan !
Let me sum up what you have written
1. It is possible can be handled with Asset CleanUp Pro
2. It is not an out-of-thebox handling
3. It can only handle one critical css code, not different ones by URL
Is this correct? Especially point 3 is a point for me. When I unload plugins on different URLs (page, posts, start page, blog page,..) I have entirely different CSS loaded everywhere so it would require to adopt the critical css. Right? With this, does it realy makes sense to use a service like criticalcss.com in combination with Asset CleanUp Pro?
Also the critical css can change with every plugin update or new plugin installed. So using an service like criticalcss.com means updating the css manually which isn’t realy working
-
This reply was modified 5 years, 5 months ago by
a223123131.
@a223123131 yes, the first two points are correct. As for the third one, it can be done via custom coding as well. Anyone with medium experience can do it. Now, I know it’s not ideal and this feature should be available to anyone with and without experience, but due to high demand and the fact that it was easier to release it like this, I decide to go ahead and implement it in the plugin. At least for developers, it would work. Very soon (again, due to the demand), it will be nicely implemented within the Dashboard so anyone could use it without any problems for pages, groups of pages, or just one page, depending on the preferences.
Also the critical css can change with every plugin update or new plugin installed. So using an service like criticalcss.com means updating the css manually which isn’t realy working
Fortunately, this doesn’t happen often. Usually, the above-the-fold doesn’t change much when a plugin is deactivated or a new plugin is activated, unless it appends CSS to the header of the page, which as I said, it’s not common. But yes, in this case, the critical CSS has to be updated.
The next option in Asset CleanUp Pro will be making critical CSS manageable only from the Dashboard (not one line of code to be written). Then, the last phase will be generating the actual critical CSS, perhaps connecting it to CriticalCSS.com or having its own service.
Ok, got it. Thanks for making this clear @gabelivan
But now I need to decide if I do it manually (which is very difficult for me, I’m not a programmer) or wait till your update arrives… Can you give any time windown when this new option will be finished?
If this is a far future update I need to do it manually for now,
@a223123131 I don’t have an approx. date when this feature will be released, but since the demand is so high, I made it the most priority task. For now, please do it manually and I will do my best to have the new feature ready (at least the first stage where you control everything within the Dashboard) within two weeks.
Two weeks sounds great, that’s fast.. Then I don’t do it manually. 🙂
Tghanks @gabelivan !!
-
This reply was modified 5 years, 5 months ago by a223123131.
Have a look at WP Rocket how they are handling this!
1. They generate crittical section by location (page, post, front page, home,..)
2. They offer in Gutenberg in the right option pannel a section to generate a differen critical css for this single page or post.
With this there is max compatibility. Unfortunatelly this is not working together with the CSS settings of Asset CleanUp and the CSS settings by WP Rocket are by far not that good as the ones from Asset Cleanup. So I need to wait till you come up with your own Critical CSS functionality.
@a223123131 the development of the feature has been completed as well as the testing phase. However, one thing is not ready yet, which is applying critical CSS for individual pages. I’m thinking of releasing it as it is (for various types of pages) and later on add the option for exceptions.
For instance, at the moment, the feature supports adding critical CSS for all posts, pages, custom post types, etc, but only one for the whole group. If you have a landing page that has a very custom layout, you will have to add an exception via custom coding at this time. What I have in mind is adding an extra box for the custom CSS when the post/page is edited.
Sounds great and very much for the first release.
I like it like WP Rocket solved it… on every Page / Post within the editor a button “generaate seperate CSS” and a second “use global CSS”
Haven’t seen what you have done right now. Need to have a look into it 🙂
-
This reply was modified 5 years, 4 months ago by a223123131.
I have been doing it since a long time with asset cleaner
I load css in header for each template and then on each template i derigister the css
