How can I speed up my blog? Specify image sizes and reduce scaling

Hi,

I am already using WP Smush it and have minimal plugins running.
http://gtmetrix.com/reports/inside.tradr.com/vmOgtNoL

Of note from my performance report:

267.3KiB of JavaScript is parsed during initial page load. Defer parsing JavaScript to reduce blocking of page rendering.

The following image(s) are missing width and/or height attributes.

The following images are resized in HTML or CSS. Serving scaled images could save 2.3MiB (80% reduction).

How is this fixable automagically?

Cheers,

Johnny

  • johnnymestizo

    My theme author response:

    @johnny at present issue is clearly mentioned there
    1) Serve scaled images : you have to proper dimension of images exactly same what you have used in the css width and height.
    like A51F661FEB1-5616x2246.jpg can be resized in HTML or CSS from 5616x2246 to 465x186.
    2) Specify Dimensions : check those image codes they need width and height parameter for those images
    3) Defer parsing of JavaScript : you can enable defer via adding js codes
    if you are using some cache plugin they have defer setting else you can add
    in functions.php

    `function defer_parsing_of_js ( $url ) {

    if ( FALSE === strpos( $url, '.js' ) ) {
    return $url;
    }
    if ( strpos( $url, 'jquery.js' ) ) {
    return $url;
    }
    return "$url' defer='defer";
    }
    add_filter( 'clean_url', 'defer_parsing_of_js', 11, 1 );`

    Overall these are not the theme issues. It is how to optimize the speed and performance.

  • Michael Bissett

    Hey @johnnymestizo, hope you're doing well today! :slight_smile:

    The following images are resized in HTML or CSS. Serving scaled images could save 2.3MiB (80% reduction).

    This means that you'll need to change the image dimensions for some of the images. As an example:

    http://inside.tradr.com/files/2015/02/A51F661FEB1-5616x2246.jpg is resized in HTML or CSS from 5616x2246 to 465x186. Serving a
    scaled image could save 986.7KiB (99% reduction).

    To be more efficient (according to GTMetrix), you'd want to change the image size from 5616px by 2246px to something like 465px by 186px. It's not something that would be done automatic, but you can make sure that future uploads aren't so large by using a plugin like this on your site:

    https://wordpress.org/plugins/resize-image-after-upload/

    The following image(s) are missing width and/or height attributes.

    This would once again be a more manual task, but it would depend on how those images are inserted into the page, you may or may not have control (or at least, easy control) over some of the images mentioned there.

    267.3KiB of JavaScript is parsed during initial page load. Defer parsing JavaScript to reduce blocking of page rendering.

    You may wish to have a look at a plugin like this to handle that:

    https://wordpress.org/plugins/wp-deferred-javascripts/

    Hope this helps! :slight_smile:

    Kind Regards,
    Michael

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.