Good day to wordpress developers! There is the RIO website, which has a 53/100 optimization parameter on the main page; this is very small; I would like to get out of the red zone at least. For this, of course, you need to correct at least important mistakes (although you can see everything yourself), this is:

  1. Optimize images -> put the WP Smush plugin, it seemed to optimize all the images in media files, but there was a problem, for example in the portfolio, not thumbnails of images are displayed there, but native thumbnails, but pagespeed want me to cut them if I do then in the portfolio itself there will be a small picture, a similar situation with the “last blog” block, the latest entries from the blog are immediately displayed, but the pictures are not displayed in thumbnails, but in native pictures inserted into the article and reduced for display in block hope v You understand what I mean. Oh yeah, this page was also created using the visual composer, if that helps.
  2. What to do with scripts and css blocking the display at the top of the page, put plugins like: autoptimize or speed boost pack, or the same W3 Total Cache and after turning on some parameters I got + on pagespeed, but the page could lose the slider or collapse altogether.

ps I will be grateful for any advice and materials in eliminating these problems, thank you very much!

    3 answers 3

    Wrote a solution for pictures. In function.php add the following function:

    function aq_resize($url,$width,$height=null,$crop=null,$single=true){ $up_info=wp_upload_dir(); $up_dir=$up_info['basedir']; $up_url=$up_info['baseurl']; if (strpos($url,home_url()) === false){return false;} $rel_path = str_replace( $up_url, '', $url); $img_path = $up_dir . $rel_path; if (!file_exists($img_path) OR ! getimagesize($img_path)){return false;} $info = pathinfo($img_path); $ext = $info['extension']; list($orig_w,$orig_h) = getimagesize($img_path); $dims = image_resize_dimensions($orig_w, $orig_h, $width, $height, $crop); $dst_w = $dims['4']; $dst_h = $dims['5']; $suffix="{$dst_w}x{$dst_h}"; $dstrel=str_replace('.'.$ext,'',$rel_path); $dest="{$up_dir}{$dstrel}-{$suffix}.{$ext}"; if($width >= $orig_w) { if(!$dst_h) : $img_url=$url; $dst_w=$orig_w; $dst_h=$orig_h; else : if(file_exists($dest) && getimagesize($dest)) { $img_url="{$up_url}{$dstrel}-{$suffix}.{$ext}"; } else { $resized=resize_image($img_path,$width,$height,$crop); $resized_rel=str_replace($up_dir,'',$resized); $img_url=$up_url.$resized_rel; } endif; } elseif(file_exists($dest) && getimagesize($dest)) { $img_url="{$up_url}{$dstrel}-{$suffix}.{$ext}"; } else { $resized=resize_image($img_path,$width,$height,$crop); $resized_rel=str_replace($up_dir,'',$resized); $img_url=$up_url.$resized_rel; } if($single) { $image = $img_url; } else { $image = array ( 0 => $img_url, 1 => $dst_w, 2 => $dst_h ); } return $image; }

    In the place where you need to display thumbnails, we write the following, changing the size of the thumbnail to the one you need:

     <img src="<?php echo aq_resize(first_img(),180,130,true)?>

      I use a bunch of plug-ins wp-rocket (full-page cache), memcached (object cache), imagify (photo compression) for 2 years, normal flight on my hayload projects. During this time, all caching and compression plug-ins were tried and only these three showed themselves from the best side, especially under load.

        It would be nice to collect all the scripts in one file, and connect asynchronously. Also mine their stylesheet. Styles also connect asynchronously. Pictures look for any optimization service. Googling is easy. And in general, I use the galp utility for this. Well, as mentioned above, caching.