“dequeue” styles and scripts for frontend optimisation?

  • Resolved Mahesh Thorat

    (@maheshmthorat)


    3 years ago

    Hi WP Go Maps (formerly WP Google Maps) team, hope you all doing well.

    Recently I am using this plugin for integrating maps. But I have seen there are so many scripts and styles loaded in frontend and I don’t think that default methods are able to block them.
    I have tried below code : 

    function dequeue_wp_google_maps_styles_scripts() {
    wp_dequeue_style('fontawesome');
    wp_dequeue_style('datatables');
    wp_dequeue_style('wpgmaps_datatables_responsive-style');

	wp_dequeue_script('datatables');
	wp_dequeue_script('datatables-responsive');
    wp_dequeue_script('javascript-cookie');
}
add_action('wp_enqueue_scripts', 'dequeue_wp_google_maps_styles_scripts', 9999999);

    Initially may be need to control for better performance of frontend I don’t required some part like fontawesome, datatables and so on…

    So please let me know how to get it done.

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author DylanAuty

    (@dylanauty)

    3 years ago

    Hi @maheshmthorat,

    Thank you for getting in touch, we do appreciate your time.

    Although you can use standard hooks for dequeue calls, we usually advise instead using our dedicated developer hooks to manage these kinds of calls, as this ensures your load order will be respected as part of our initialization loops.

    For example, your dequeue script would be written like this instead: 

    function wpgmza_dequeue_non_essential_dependencies($deps){

    $dequeue = array('datatables', 'datatables-responsive', 'javascript-cookie');

    foreach($dequeue as $dep){

        if(!empty($deps[$dep])){

            unset($deps[$dep]);

        }

    }

    return $deps;

}

add_filter('wpgmza-get-library-dependencies', 'wpgmza_dequeue_non_essential_dependencies');

function wpgmza_dequeue_non_essential_styles(){

    wp_dequeue_style('datatables');

    wp_dequeue_style('wpgmaps_datatables_responsive-style');

    wp_dequeue_style('fontawesome');

}

add_action('wpgmza_script_loader_enqueue_styles', 'wpgmza_dequeue_non_essential_styles', 9999);

    You can learn more about our hooks, in our documentation: https://docs.wpgmaps.com/hooks

    I hope this helps?

    Thread Starter Mahesh Thorat

    (@maheshmthorat)

    3 years ago

    Hi @dylanauty thank you so much for your response. Appreciate the hooks provided by you.

    Q1. In that case it’s not able to restrict some js css in frontend as below.

    CSS

    1. wpgmaps_datatables_responsive-style
    2. featherlight
    3. owl-carousel_style
    4. owl-carousel_style__default_theme
    5. owl_carousel_style_theme_select

    JS

    1. featherlight

    Q2.Also I noticed in my head tag there are some external scripts attached from googleapis can I control that also from hooks?

    Q3. Also if possible can we get the lazy load feature for that because most of cases we use maps globally or on home page so its very laggy sometimes. If also able to make this for pro version that would fine. But we need lazy loading maps for better page speed.

    Thanks,
    Mahesh Thorat

    Plugin Author DylanAuty

    (@dylanauty)

    3 years ago

    Hi @maheshmthorat,

    Only a pleasure, happy to help where I can. Please find further responses below, in order:

    1. This may be true, for some modules for various reasons. Owl Carousel assets can simply be disabled in the settings area. Maps > Settings > Marker Listings > Dependencies. The additional modules you mentioned are not core dependencies, and as such can instead be dequeued when the map is prepared for initialization, with this additional hook: 
    function wpgmza_dequeue_additional_dependencies(){
    wp_dequeue_style('featherlight');
    wp_dequeue_script('featherlight');
    wp_dequeue_style('wpgmaps_datatables_responsive-style');
}

add_action('wpgooglemaps_hook_user_js_after_core', 'wpgmza_dequeue_additional_dependencies', 9999);

    2. These additional scripts are all controlled directly by the Google Maps API, that is to say we simply include the API, with your appropriate API key and once verified, Google loads those additional scripts to support their API core.

    3. Delayed, deferred, async and lazyloading is all supported in full. We do not offer this as a setting but integrate with plugins like LS Cache, WP Rocket, Async JavaScript which means you can enable most script optimization plugins, which support delayed loading, and see the addition of those tags in our inclusions.

    I hope that helps.

    Thread Starter Mahesh Thorat

    (@maheshmthorat)

    3 years ago

    Thanks @dylanauty appreciate your time spent for the thread. Worked settings as per you provided.
    Also appreciate the plugin is just awesome helped so many complex structures and saved so many hours of coding. Thanks again.

    Thanks,
    Mahesh Thorat

    Plugin Author DylanAuty

    (@dylanauty)

    3 years ago

    My pleasure @maheshmthorat – Glad I could help.

    Have a great day.

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

The topic ‘“dequeue” styles and scripts for frontend optimisation?’ is closed to new replies.