Contact Form 7 update breaks Autoptimize JS optimization: workaround

Due to a recent major change in Contact Form 7’s frontend JavaScript Autoptimize users will have to add wp-includes/js the comma-separated JS optimization exclusion list.

It is nice CF7 gets rid of the jQuery dependancy, but replacing that with a significant amount of extra JS-files and a wp-json request, really?

Autoptimize Image Optimization to be less lazy with pictures

Up until now Autoptimize, when performing image optimization, relies on JS-based lazyloading (with the great lazysizes component) to differentiate between browser that support different image formats (AVIF, WebP and JPEG as fallback).

As JS-based Lazyload is going out of fashion though (with native lazyload being supported by more browsers and WordPress having out-of-the-box support for it too), it is time to start working on <picture> output in Autoptimize to serve “nextgen image formats” where different <source> tags offer the AVIF and WebP files and the <img> tag (which includes the  loading=”lazy” attribute) with JPEG as fallback.

For now that functionality is in a separate “power-up”, available on Github. If you have Image Optimization active in Autoptimize (and you are on the Beta version, Autoptimize 2.8.1 is missing a filter which the power-up needs so download & install the Beta if not done yet), you can download the plugin Github and give it a go. All feedback is welcome!

Fix for Elementor 3.1 YouTube not LYTE anymore

Elementor 3.1 came with “refactored YouTube source to use YouTube API in Video widget” which resulted in WP YouTube Lyte not being able to lyten up the YouTubes any more. Below code snippet (consider it beta) hooks into Elementor to fix this regression;

add_filter( 'elementor/frontend/widget/should_render', function( $should_render, $elementor_element ) {
	if ( function_exists( 'lyte_preparse' ) && 'Elementor\Widget_Video' === get_class( $elementor_element ) ) {
		$pas = get_private_property( $elementor_element , 'parsed_active_settings');
		if ( ! empty( $pas['youtube_url'] ) ) {
			echo lyte_preparse( $pas['youtube_url'] );
			return false;
		}
	}

	return $should_render;
}, 10, 2 );

// from https://www.lambda-out-loud.com/posts/accessing-private-properties-php/
function get_private_property( object $object, string $property ) {
    $array = (array) $object;
    $propertyLength = strlen( $property );
    foreach ( $array as $key => $value ) {
        if ( substr( $key, -$propertyLength ) === $property ) {
            return $value;
        }
    }
}

Hat tip to Koen for his assistance in digging into Elementor, much appreciated!

AO image optimization: transparent .png to avif issue

if “Load WebP or AVIF in supported browsers?” is on, .png files with transparency will loose that transparency in browsers that support AVIF due to a recent technical change in Shortpixel’s AVIF toolchain.

Shortpixel is looking at alternative solutions, but until then as a workaround you can either:

  • add .png to Autoptimize’s lazyload exclusion field
  • or to use below code snippet to disable AVIF images;

add_filter( 'autoptimize_filter_imgopt_do_avif', '__return_false');

Music from Our Tube: Robert Wyatt’s cover of “At Last I Am Free”

Last Sunday-evening while making the beds, listening to Charlotte Adigéry’s very enjoyable radioshow on Stubru, I heard “At last I Am Free”. Turns out Robert Wyatt actually covered this pretty uncharacteristic Chic-song, but I prefer his version:

Robert Wyatt "At Last I Am Free"
Watch this video on YouTube.

Gelezen: Max, Mischa & het Tet-offensief van Johan Harstad

Wat een boek …

Coming of age, de buitenwijken, New York, Noorwegen. Muziek, toneel, schilderkunst. De oorlog in Vietnam de oorlog die Coppola’s film over de oorlog in Vietnam was. Communisme, kapitalisme. Eenzaamheid, vervreemding, maar ook liefde.

1230 pagina’s en ik zou direct opnieuw beginnen (en ik ben stukken aan het herlezen), ondanks de soms zwaar op de hand liggende beschouwingen over toneel of schilderkunst (maar vooral de stukken over toneel zijn nu zoveel relevanter).

Wat een boek!

Voor de muziekfreaks; een YouTube playlist :

Playlist: Max, Micha & het Tet-Offensief Soundtrack
Watch this playlist on YouTube