How to remove JS & CSS bloat that is loaded on every page?

One notorious example would be plugin: Contact Form 7

Official document: Loading JavaScript and Stylesheet Only When it is Necessary

Od pluginova, tu je strategio/cf7unloaded koji se bavi sa shortcode-ovima a ne sa block, kao i Scripts Removal for Contact Form 7 koji

Remove Contact Form 7 scripts and styles through the WordPress action hook API

Conditionally Loading Scripts and Styles for WordPress Plugins

By looking at source code, has_shortcode() functions seems quite slow, so I will use more simpler approach.

function wpdocs_shortcode_scripts() {
    global $post;
    if ( is_a( $post, 'WP_Post' ) && has_shortcode( $post->post_content, 'wpdocs-shortcode') ) {
        wp_enqueue_script( 'wpdocs-script');
    }
}

add_action( 'wp_enqueue_scripts', 'wpdocs_shortcode_scripts', 999);


--

$page_id = get_queried_object_id();
$page_object = get_page( $page_id );
if ( strpos($page_object->post_content, '[/slider]') 

--

  JS: wp_register_script( 'jquery-form'
  JS: wp_enqueue_script( 'contact-form-7'
  CSS: wp_enqueue_style( 'contact-form-7'
  CSS: wp_enqueue_style( 'contact-form-7-rtl'

do_action( 'wpcf7_enqueue_scripts' ); 
do_action( 'wpcf7_enqueue_styles' );   

--

# old way of removing scripts
add_action( 'wpcf7_enqueue_styles', function() { wp_deregister_style( 'contact-form-7' ); } );
add_action( 'wpcf7_enqueue_scripts', function() { wp_deregister_script( 'jquery-form' ); } );

--

@see: http://contactform7.com/loading-javascript-and-stylesheet-only-when-it-is-necessary/

add_filter( 'wpcf7_load_js', '__return_false' );
add_filter( 'wpcf7_load_css', '__return_false' );

    if ( function_exists( 'wpcf7_enqueue_scripts' ) ) {
        wpcf7_enqueue_scripts();
    }
 
    if ( function_exists( 'wpcf7_enqueue_styles' ) ) {
        wpcf7_enqueue_styles();
    }

For scripts?

Conditionally Loading CSS for Shortcodes Conditional Script Loading Revisited

Odličan tekst o optimizaciji sa primenom na CF7 optimize WesztyWeb - Script Loading Optimizations

Load on need:

https://contactform7.com/loading-javascript-and-stylesheet-only-when-it-is-necessary/

Using an HTML5 Button Element as Contact Form 7 Submit - WPKlik

Najzad!

Contact Form 7 5.7.5 | Contact Form 7

Block editor: Introduces wpcf7_enqueue_block_editor_assets() and retrieves contact forms only when needed.

Sve najbolje sam primenio na:

cnc / cf7-conditionaly-load-assets.php

contact-form-7-conditional-enqueues.php je dobar conditional load za CF7 u smislu da se dva puta na enqueueuje kada ima više formi na istoj strani

GTM4WP

1. To disable enqueueing gtm4wp-form-move-tracker.js script Uncheck Events » Form fill eventsthat is an option send event when a visitor moves between elements of a form (comment, contact, etc).

2. To disable enqueueing gtm4wp-contact-form-7-tracker.js script Uncheck Integration » Contact Form 7 » Contact Form 7 that is an option to fire events after Contact Form 7 submissions.

Ako želim da ulepšam malo generički CF7, ovo je odlično rešenje: Pico.css • Minimal CSS Framework for semantic HTML