Thumbnail image delivery on blog archive page

Hello,

Blog page loads full image sizes on “grid” style. because of it pagespeed insights shows error “Improve image delivery”:
“Reducing the download time of images can improve the perceived load time of the page and LCP. Learn more about optimizing image sizeLCP, FCP”

“This image file is larger than it needs to be (768×351) for its displayed dimensions (382×175). Use responsive images to reduce the image download size.”

I guess blog element loads full images for thumbnails.

Then I tried to solve it with chatgpt help, chat gave me code below but it didnt help, can you help me if there is an error in code or what else should I do?

Only I have this kind of issue or anyone else?

code from chatgpt:
// 1. Register a custom image size for blog thumbnails
function custom_blog_thumbnail_size() {
add_image_size(‘blog-thumb-382×175’, 382, 175, true); // 382×175 hard crop
}
add_action(‘after_setup_theme’, ‘custom_blog_thumbnail_size’);

// 2. Force WordPress to use the custom size in blog/archive loops
function override_post_thumbnail_html($html, $post_id, $post_thumbnail_id, $size, $attr) {
if (is_home() || is_archive() || is_category() || is_tag()) {
// Use our custom image size
$custom_html = get_the_post_thumbnail($post_id, ‘blog-thumb-382×175’, $attr);
return $custom_html ?: $html;
}
return $html;
}
add_filter(‘post_thumbnail_html’, ‘override_post_thumbnail_html’, 10, 5);

// 3. Override the responsive ‘sizes’ attribute specifically for our custom thumbnail
function custom_blog_thumbnail_sizes($sizes, $size, $image_src, $image_meta, $attachment_id) {
if (is_home() || is_archive() || is_category() || is_tag()) {
// Ensure it doesn’t affect other image sizes
$current_post_thumbnail_id = get_post_thumbnail_id();
if ($attachment_id == $current_post_thumbnail_id) {
return ‘(max-width: 480px) 100vw, 382px’; // Adjust this if layout differs
}
}
return $sizes;
}
add_filter(‘wp_calculate_image_sizes’, ‘custom_blog_thumbnail_sizes’, 10, 5);