youknowriad / wp-js-plugin-starter

Just another WordPress plugin starter
218 stars 30 forks source link

Add example and docs to only enqueue when required #6

Open tripflex opened 6 years ago

tripflex commented 6 years ago

Good tutorial, one thing I would like to mention (and I see it mentioned in the README), is to provide more details and example to show users how to only enqueue their script or style on THEIR pages (or pages required).

Being a full time WordPress developer, my biggest gripe about inexperienced or sloppy developers is enqueuing a script/style on every single page ... which I deal with constantly when there are javascript errors in their code or they add a dependency that conflicts with my plugins.

I literally have a function in all my plugins called death_to_sloppy_devs() to dequeue scripts/styles ... the list is up to 40 plugins now šŸ˜®

If I can find some time next week i'll submit a PR for you, just wanted to mention it while I was checking this out, as I honestly think it's not laziness, it's just not being experienced enough or even knowing how to do it correctly.

Even created this repo years ago that I never ended updating, but now reminds me I should finish it šŸ˜› https://github.com/tripflex/dequeue-sloppy-devs

tripflex commented 6 years ago

Just for giggles šŸ˜

function __construct() {
    add_action( 'admin_enqueue_scripts', array( $this, 'death_to_sloppy_devs' ), 9999999 );
    add_action( 'admin_print_scripts', array( $this, 'death_to_even_sloppier_devs' ), 9999999 );
}

/**
 * Dequeue scripts/styles that conflict with plugin
 *
 * Sloppy developers eneuque their scripts and styles on all pages instead of
 * only the pages they are needed on.  This almost always causes problems and
 * to try and prevent this, I dequeue any known scripts/styles that have known
 * compatibility issues.
 *
 * @since 1.2.1
 *
 * @param $hook
 */
function death_to_sloppy_devs( $hook ){
    // Return if not on plugin page, which some devs fail to check!
    if ( empty( $hook ) || ( ! empty( $hook ) && ! in_array( $hook, $this->hooks ) ) ) {
        return;
    }

    $this->dequeue_sloppy_devs();
}

/**
 * The sloppiest of devs, enqueue on admin_print_scripts
 *
 * Even though codex SPECIFICALLY states not to enqueue scripts/styles on admin_print_scripts,
 * unfortunately there are devs who still think this is the right way to do it ... either that,
 * or they just don't care
 *
 * ... so because of that, I have to write code to fix their sloppiness :(
 *
 * @since 1.8.2
 *
 */
public function death_to_even_sloppier_devs() {

    // Return if not on plugin page, which some devs fail to check!
    if ( ! $this->is_plugin_page() ) {
        return;
    }

    $this->dequeue_sloppy_devs();
}

/**
 * Dequeue scripts/styles that conflict with plugin
 *
 * Sloppy developers enqueue their scripts and styles on all pages instead of
 * only the pages they are needed on.  This almost always causes problems and
 * to try and prevent this, I dequeue any known scripts/styles that have known
 * compatibility issues.
 *
 * @since 1.8.2
 *
 */
public function dequeue_sloppy_devs() {

    $scripts = $this->get_sloppy_dev_scripts();
    $styles  = $this->get_sloppy_dev_styles();

    foreach ( (array) $scripts as $script ) {
        if ( wp_script_is( $script, 'enqueued' ) ) {
            wp_dequeue_script( $script );
        } elseif ( wp_script_is( $script, 'registered' ) ) {
            wp_deregister_script( $script );
        }
    }

    foreach ( (array) $styles as $style ) {
        if ( wp_style_is( $style, 'enqueued' ) ) {
            wp_dequeue_style( $style );
        } elseif ( wp_style_is( $style, 'registered' ) ) {
            wp_deregister_style( $style );
        }
    }

}

/**
 * Sloppy Developer Scripts to Dequeue
 *
 *
 * @since 1.8.2
 *
 * @return array
 */
public function get_sloppy_dev_scripts() {

    $scripts = array(
        'bootstrap', // Bootstrap 3 Shortcodes
        'swift-framework',
        'material-select', // Swift Framework
        'material', // Swift Framework
        'materialize', // Swift Framework Page Builder Start
        'spb-bootstrap',
        'base64',
        'touch-punch',
        'jquery-ui',
        'page-builder',
        'page-builder-min',
        'colorpicker-js',
        'uislider-js',
        'chosen-js',
        'spb-maps', // Swift Framework Page Builder End
        'admin-functions', // Cardinal Theme (swift framework)
        'sf-theme-scripts',
        'sf-functions',
        'jquery-ui-core',
        'jquery-ui-accordion',
//          'jquery-ui-sortable', - used now in plugin for sortable options
        'jquery-ui-button',
        'wpum-admin-js',
        'scporderjs',
        'kwayyhs-custom-js',
        'mobiloud-menu-config',
        'wp-seo-premium-quickedit-notification',
        'bont-admin-uic',
        'default', // Bridge Theme by Qode -- (WHO USES "DEFAULT" !?! WORST IVE SEEN SO FAR!)
        'bp-redirect',
        'service_finder-js-admin-custom', // Service Finder Theme SF Booking plugin
        'buy_sell_ads_pro_admin_jquery_ui_js_script', // Dequeue regardless
        'buy_sell_ads_pro_admin_js_script',
        'buy_sell_ads_pro_admin_switch_button_js_script',
        'buy_sell_ads_pro_tagsinput_js_script',
        'jquery-touch-punch' // Enqueued as DEP for buy sell ads pro plugin
    );

    return $scripts;
}

/**
 * Sloppy Developer Styles to Dequeue
 *
 *
 * @since 1.8.2
 *
 * @return array
 */
public function get_sloppy_dev_styles() {

    $styles = array(
        'jquery-ui-style',
        'woocommerce_admin_styles', // YITH WooCommerce Social Login Premium (all KINDS of sloppy enqueues)
        'cuar.admin', // WP Customer Area (Enqueued on ALL admin pages)
        'ots-common', // Our Team Showcase Plugin (loads on every page)
        'pixelgrade_care_style',
        'pixelgrade_care',
        'woocommerce_admin', // WooCommerce Email Customizer
        'caldera-forms-admin-styles', // Caldera Forms
        'pods-styles',
        'dokan-admin-css', // Dokan Lite (Generic CSS)
        'wpcf-css-embedded-css',
        'swift-framework',
        'material-select',
        'material',
        'swift-pb-font', // Swift Framework Page Builder Start
        'materialize-components-css',
        'spb-bootstrap',
        'page-builder',
        'page-builder-min',
        'colorpicker',
        'uislider',
        'chosen',
        'ss-iconmind',
        'ss-gizmo',
        'nucleo',
        'simple-line-icons',
        'fontawesome',
        'materialicons', // Swift Framework Page Builder end
        'bont-admin-ui', // Bontact Widget- Live contact form with chat, phone, text and email
        'bont-admin-uia',
        'bont-admin-uib',
        'ilentheme-styles-admin', // Code in PHP Widget plugin
        'ilentheme-styles-admin-2'
    );

    return $styles;
}