I have small wordpress site but the problem that the first load of the site take 5 seconds because of small jpg image 200x200 size=47kb . How I can solve this problem ?
I measured with chrome developer tools:
An image of 47kB shouldn”t cause such a long delay. Have you tried removing the image and testing again?
2 Likes
What’s your HTML for serving the image?
<div id="page" class="page-layout">
<header id="site_header" class="header mobile-menu-hide">
<div class="header-content clearfix">
<div class="logo mobile-hidden">
<a href="https://domain.com/">
<img src="//domain.com/wp-content/uploads/2021/10/main.jpg" alt="image">
</a>
</div>
<div class="site-title-block mobile-hidden">
<a href="https://domain.com/">
</a>
</div>
You’re not giving a width and height attribute - that will cause a layout shift.
If you still need to optimise the image you could try tinyjpg.com
Interesting. I’ve never seen a url specified like that, without the scheme part. Kind of surprised it works. In any event, I would add https: in front of that, just to see if that’s an issue.
Agreed.
Or just remove the //domain.com/ and put it from a relative path “/wp-content/uploads/…”
1 Like
Apparently it’s used to load the resource from the same protocol (http: or https:) that the current page was loaded with. Useful when the same HTML/JS is used on both HTTP and HTTPS environments (as in during staging vs production). Today, it’s better practice to explicitly use https:// for security and clarity.
2 Likes
but why it say the blocked element is div.page-header ? how I can optimize this ?
Hard to say. Do you have it online? If so, what’s the URL?
1 Like
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.