Question 2806 in Wordpress Question posted in
The official Wordpress documentation can be found here.

How Can I Optimize Images – WordPress

I have built a website for my ortfolio using Elementor Pro. However, everytime I load the site the logo seems to load a few milliseconds slower than the rest of the page and I cannot get it all to load at the same time?

Secondly, it is relatively slow to load on mobile and I have been advised to Eliminate render-blocking resources – what is the best way to go about this?

jacarywebdesign.com/

Any help much appreciated!

Tags:

3

Answers


  1. 0

    Your logo seems to have the below opacity transition rule. Try erasing it and see if it works or setting transition: opacity 0ms;.

    .lazyloaded {
    opacity: 1;
    transition: opacity 400ms;
    transition-delay: 0ms;
}

    Regarding eliminating render-blocking resources you can check the WP-Rocket post.

    Login or Signup to reply.
  2. 0

    A look at the element inspector in Chrome shows that your logo is "lazy loaded". The CSS class lazyloaded has transition set to opacity 400ms. Reset this to 0ms.

    From:

    .lazyloaded {
    opacity: 1;
    transition: opacity 400ms;
    transition-delay: 0ms;
}

    To:

    .lazyloaded {
    opacity: 1;
    transition: opacity 0ms;
    transition-delay: 0ms;
}

    As for your question regarding eliminating render-blocking resources, here’s a detail explanation of how to do it manually: See here.

    If you would rather go with plugins, read this article.

    Login or Signup to reply.
  3. 0

    You have so many JS files, they are blocking rendering.
    The Browser cannot start rendering until the fonts, JS, and CSS are all loaded.

    These are the render blocking files.
    LINK to speed results from webpagetest 

    91 ms: https://jacarywebdesign.com/wp-content/cache/minify/d52ed.js
673 ms: https://code.jquery.com/jquery-3.6.0.min.js
195 ms: https://jacarywebdesign.com/wp-content/cache/minify/9af47.js
63 ms: https://jacarywebdesign.com/wp-content/cache/minify/f2459.js
180 ms: https://jacarywebdesign.com/wp-content/cache/minify/b74df.js
86 ms: https://jacarywebdesign.com/wp-content/plugins/elementor-pro/assets/js/animated-headline.ffb4bb4ce1b16b11446d.bundle.min.js 
https://fonts.googleapis.com/css?family=Roboto%3A100%2C100italic%2C200%2C200italic%2C300%2C300italic%2C400%2C400italic%2C500%2C500italic%2C600%2C600italic%2C700%2C700italic%2C800%2C800italic%2C900%2C900italic%7CRoboto+Slab%3A100%2C100italic%2C200%2C200italic%2C300%2C300italic%2C400%2C400italic%2C500%2C500italic%2C600%2C600italic%2C700%2C700italic%2C800%2C800italic%2C900%2C900italic%7CGothic+A1%3A100%2C100italic%2C200%2C200italic%2C300%2C300italic%2C400%2C400italic%2C500%2C500italic%2C600%2C600italic%2C700%2C700italic%2C800%2C800italic%2C900%2C900italic%7CQuestrial%3A100%2C100italic%2C200%2C200italic%2C300%2C300italic%2C400%2C400italic%2C500%2C500italic%2C600%2C600italic%2C700%2C700italic%2C800%2C800italic%2C900%2C900italic%7CAverage+Sans%3A100%2C100italic%2C200%2C200italic%2C300%2C300italic%2C400%2C400italic%2C500%2C500italic%2C600%2C600italic%2C700%2C700italic%2C800%2C800italic%2C900%2C900italic&display=auto&ver=6.0.2
https://code.jquery.com/jquery-3.6.0.min.js
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search