Category Archives: Technology

Blogposts on blog.futtta.be about internet, web developement, browsers, security, linux, …

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');

About that new autoptimize_filter_imgopt_lazyload_from_nth filter

Some people asked for documentation/ information on that new autoptimize_filter_imgopt_lazyload_from_nth filter which allows one to tell AO not to optimize the first X images found in the HTML, so here is an example code snippet that sees AO not lazyload the first 5 images:

add_filter( 'autoptimize_filter_imgopt_lazyload_from_nth', function(){ return 5; } );

Update: as from AO 2.8.2 this will also be an option on the settings page, see screenshot :)

 

Fixed: WordPress 5.6 required Autoptimize settings change

PSA: WordPress 5.6 changes the filename of jQuery core. If you’re using Autoptimize and you have jQuery excluded (which is default) you will want to update your JS optimization exclusion list from js/jquery/jquery.js to js/jquery/jquery.min.js.

Update: Autoptimize 2.8 will automagically fix this, urgently looking for some testers to download https://github.com/futtta/autoptimize/archive/beta.zip (make sure 2.7.8 is disabled when enabling the beta). If all goes well and I get some confirmation the update (which has a lot more then just the fix) will go out today!

Update2: AO28 was released, all is (or should be) OK now :)

Santa wrapping up Autoptimize 2.8!

I’m sure you have been good this year so Santa cannot but put a nice ribbon around the next version of Autoptimize, out later this month. These are the most important changes:

  • JavaScript: new option “defer but don’t aggregate” which *might* help with “total blocking time”
  • Images: add field to list images to be excluded from image optimization
  • Critical CSS: major improvements of the job processing mechanism, reducing time spent from up to 1 minute to just a couple of seconds.
  • Critical CSS: under “advanced options” replace “request limit” with “queue processing time limit” (default 30s).
  • Extra | Google Fonts: better parsing of version 2 Google Font URL’s (/css2/).
  • Misc. other minor fixes, see the GitHub commit log

In case you want to give Santa a hand with all that wrapping up, you can always download the Beta version here and take it out for a spin.

LYTE: change in YouTube API caching behavior

As mentioned earlier here, Google checks YouTube API usage and can cancel a project/ API key if there are no API requests for 90 days. Based on the fact that earlier post received more hits the last week and people asking on the WordPress support forum, I went back to the drawing board code editor and added logic for LYTE’s cached YouTube API responses to expire after 2 months, causing somewhat regular requests to YouTube which should keep Google happier with the API usage.

Obviously if you have page caching (which you should) this can have an impact as well, as a cached page will not result in LYTE “seeing” the request, so the cached YouTube data would not get refreshed even if older then 2 months. Then again having such aggressive page caching would likely cause other issues (nonces in forms becoming invalid and such), so I *think* the one month margin (results cached for 2 months whereas Google wants activity in 90 days) should suffice.

For those who don’t like the cache to expiry of if you want more or less then 2 months; I added  2 filters allowing you to tweak with a bit of code. Returning false to lyte_ytapi_check_cache will make LYTE function as before (no cache expiry) and the cache expiry threshold can be changed using the lyte_ytapi_cache_gracetime filter.

And like blogposts concerning LYTE, here’s a video to show it action: Yves Tumor with “Gospel for a New Century”. Weird stuff I admit (you have been warned), but good weird really …

Yves Tumor - Gospel For A New Century (Official Video)
Watch this video on YouTube.