Support » Plugin: Asset CleanUp: Page Speed Booster » Disable rules on backend?

  • Hello,
    I’m facing an with Elementor. I have site-wide rules to unload assets on pages I previously built with Elementor. It works perfectly on the frontend! Quite fast actually, after disabling the excess bloat.

    However, if I head to the admin area and try to load the page in Elementor to make edits, it doesn’t work. I guess some of that bloat is needed when using the actual page builder.

    If I disable the plugin, then Elementor goes on working like normal.

    Is there a way to have your plugin ignore all rules when working in the backend?

    Thanks for the hand and the great plugin!
    Damon

Viewing 12 replies - 1 through 12 (of 12 total)
  • Plugin Author Gabe Livan

    (@gabelivan)

    @dcmalk if you’re in edit mode via Elementor, Asset CleanUp will be technically disabled as a plugin (ti’s done 100% intentionally, no bug here) just so it doesn’t bother you at all while editing your pages (same with other page builders). Have you updated to the latest version of Asset CleanUp?

    >>> Is there a way to have your plugin ignore all rules when working in the backend?
    The whole plugin with all its settings and rules are ignored (as nothing is triggered). If there’s a misunderstanding, let me know. Moreover, you can add print screens via https://prnt.sc – I used to ask people for their WP login but the staff from WordPress.org doesn’t allow this and I respect their rules.

    Hi Gabe,
    Thanks for the quick reply! All great info, thanks for helping me better understand your plugin.

    I wonder if it’s something unique to Elementor and how it loads pages for live editing. If you’re interested, I can give you the steps for recreating:

    1.) Disable Asset CleanUp
    2.) Install Elementor and create a quick page
    3.) Enable Asset Cleanup
    4.) On your Elementor page, disable the Elementor asset handle “swiper” (…/swiper.min.js) and Update
    5.) Edit your page with Elementor

    I’ve tested these steps on two different sites and each time, I get the error message “The preview could not be loaded” and prompted to load Elementor in safe mode. When I re-enable “swiper”, the error goes away and Elementor loads.

    Perhaps I’m missing something but it seems like in this instance, Asset CleanUp rules aren’t being ignored.

    As for Asset CleanUp version, I’m running v1.3.2.6.

    Damon

    Plugin Author Gabe Livan

    (@gabelivan)

    Regarding this one:
    >>> 4.) On your Elementor page, disable the Elementor asset handle β€œswiper” (…/swiper.min.js) and Update
    Are you actually in Elementor Edit Mode or you’re just editing the Elementor page via the standard WordPress edit? Some print screen would be helpful, indeed! We’ll sort this out as it’s an easy fix. It’s all about understanding exactly what you’re doing there, that’s all!

    When disabling the assets, as in step #4 above, I am in the standard WordPress edit page area as shown here:
    https://prnt.sc/ndo9nm

    While on this page, I scroll down and disable the asset:
    https://prnt.sc/ndo9uo

    After updating, I click the “Edit with Elementor” button and receive the following error:
    https://prnt.sc/ndo9zf

    Afterwards, if I reverse the steps and re-enable that asset, “Edit with Elementor” works like normal.

    Plugin Author Gabe Livan

    (@gabelivan)

    Now it makes perfect sense and it should give you that error because by unloading the “swiper” handle, you’re also unloading all of its ‘children’ (as you can read in the print screen, there’s a message next to an informative icon saying that “elementor-frontend” will also be unloaded which has its own ‘children’ that as a result will be unloaded too. Technically, you’re unloading all JS files from ELementor.

    The reason these handles have dependencies is that in most cases, you need one file to be loaded first, before loading another one that triggers code which was defined in the first file. One of the best examples is jQuery Migrate which is loaded after jQuery. For maximum compatibility, WordPress core developers have made the files connected one to another through dependency. After all, it’s a small price to pay in extra loading to make sure nothing is broken. The file /wp-includes/js/jquery/jquery-migrate.min.js has only 10KB.

    However, there are many situations nowadays where jQuery migrate is not needed anymore and, in your case, if you’re sure your users will no use “swiper”, then you should be able to unload it without affecting other files. After all, wp-content/plugins/elementor/assets/lib/swiper/swiper.min.js has 126KB and added up with other unloaded files, it would make a difference in total page size and load time.

    One solution would be o add an option (e.g. a checkbox) that will allow you to unload the file without affecting the ‘children’. I can implement this as soon as possible (ideally in the next plugin release).

    What I can do, at least for now, is provide you a snippet that you will have to add in functions.php which will remove the script tag loading swiper.min.js. Let me know if you’re interested.

    Wow, that was a great explanation. Thanks so much for clarifying this so thoroughly! πŸ™‚

    I think I became “settings blind” to that child dependency note – I never noticed it before. It does make sense now why this affects the Elementor editor.

    I’ve used wp_deregister_script() in the past but if you have a moment, I’d rather see the function.php snippet you offered so I don’t interfere with Asset CleanUp.

    Again, thanks so much for the help and attention to detail here!

    Plugin Author Gabe Livan

    (@gabelivan)

    I’m glad it makes sense now. If you use wp_deregister_script(), you will get the same results (dependencies will be unloaded too) as this is how it should work.

    Here’s a snippet that would strip the SCRIPT tag for “swiper” handle (works fine on my end, make sure to properly test it once you update functions.php). It will not trigger in the Dashboard (as you’ll notice in the code). It will trigger on Elementor edit mode. If you want to avoid that, a condition can be set above ob_start().

    add_action('wp_loaded', function () {
        if (is_admin()) {
            return; // Do not trigger in the Dashboard
        }
    
        ob_start( function ($htmlSource) {
            $srcContainsFormat = preg_quote('/elementor/assets/lib/swiper/swiper', '/');
    
    	    $regExpPattern = '#<script[^>]*src(|\s+)=(|\s+)[^>]*'. $srcContainsFormat. '.*(>)#Usmi';
    
    	    preg_match_all($regExpPattern, $htmlSource, $matchesSourcesFromTags, PREG_SET_ORDER);
    
    	    if (isset($matchesSourcesFromTags[0][0])) {
    	        $htmlSource = str_replace($matchesSourcesFromTags[0][0].'</script>', '', $htmlSource);
            }
    
    	    return $htmlSource;
        } );
    }, 1);

    Note that this code triggers very soon before WP Rocket combines the remaining JavaScript files (e.g. https://startingcurve.com/wp-content/cache/min/1/9816a547b82805f6df5676563fa64dd8.js). It shouldn’t give you issues. If it does, just exclude the swiper from being minified and concatenated via WP Rocket (you can do that in the plugin’s settings).

    The results of the snippet above will be removing the following HTML code:
    <script type='text/javascript' src='https://startingcurve.com/wp-content/plugins/elementor/assets/lib/swiper/swiper.min.js?ver=4.4.6'></script>

    You can clearly see it in the source code if you access the website without WP Rocket enabled: https://startingcurve.com/?nocache

    Looking forward to your update and hopefully, it will all be good πŸ˜‰

    • This reply was modified 1 month, 1 week ago by  Gabe Livan.

    Perfect!

    Everything worked exactly as you described. I did have to exclude the script from WP Rocket to prevent it from combining; afterwards, however, your snippet removed all traces without breaking dependencies. It works on the frontend and inside the Elementor edit mode. Awesome!

    You’re in your own class when it comes to thoroughness and support. Thanks again for the help and your work on this great plugin! πŸ˜€

    Damon

    Plugin Author Gabe Livan

    (@gabelivan)

    Hi, Damon!

    Just so you know, a new feature was added to the current tag (a new one wasn’t yet released) called ‘Ignore dependency rule and keep the “children” loaded’ which basically allows you to unload swiper.min.js and other files without breaking the page. You might want to give it a try by re-downloading Asset CleanUp from WordPress.org. Note that you will find the checkbox (you have to turn on) next to the notice that tells you there are “children” linked to the CSS/JS handle.

    Best wishes,
    Gabe

    Hey Gabe,

    That’s awesome. I will definitely check this out!

    Thanks for the heads up, and for making this plugin better and better. πŸ™‚

    Damon

    I updated the plugin as you instructed and tried the new checkbox for ignoring dependencies. It works perfectly!

    Also, without needing the functions.php code snippet anymore, this makes further tweaking quite easy. Thank you again!

    Damon

    Plugin Author Gabe Livan

    (@gabelivan)

    @dcmalk Cool, I might add extra confirmation messages later on for “parent” files and other sensitive options to avoid (even by mistake) doing the wrong thing. I’ve seen WordPress core files unloaded when they should be loaded! That’s why WP core CSS/JS are not visible by default!

Viewing 12 replies - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.