Shopify expert added Largest Contentful Paint image placeholder to improve store speed

[Epsryn]

Hi there,
We reached out to a shopify expert through the shopify experts portal to improve store speed and LCP. Of our vital webs, LCP is the only real issue we have. 

The shopify expert did indeed improve the store speed but the LCP remained large. When I went to pagespeed to investigate, every single LCP on the entire store is the following:

<img src="https://cdn.shopify.com/s/files/1/0633/1672/1913/files/background-7w897878…" style="pointer-events: none; position: absolute; top: 0px; left: 0px; width: 96vw;" width="99999" height="99999">

It will be placed in every template, home page, product pages etc such as:

body.template-collection > img

We have no access to this image. It took me a long time but i realised he has just done what is shown here:
https://www.devisedlabs.com/blog/largest-contentful-paint-lcp-hack

upon furhter research, this doesnt look like good practice or something a shopify expert should be doing. It is trying to trick google search engines into thinking the site is performing better than it is. 

Does anyone know if this is bad practice and what should i do? I can't actually find where this code is inserted. I looked in theme.css etc and theme.liquid but can't find it.

It also affects other areas such as accessibility and SEO since this fake image has no alt attributes or correct sizing

Any help would be much appreciated. Has anyone come accross this. Should i ask for this to be removed? We paid quite a lot of money and was very dissapointed that the shopify expert used this technique instead of actually trying to improve the LCP, or  even just telling us how to improve it etc.

[Ussama1]

happened same for me and looking for solution

[JoshHighland]

You are right that is a hack.  Its not a true indication of whats your site speed is.

It will improve your score, for SEO reasons, but it doesn't help your users. In my opinion its unethical if you hired someone and that was their fix. 

[Epsryn]

Thanks John,
I sent them an email just asking. I was really polite and they havent responded. I might report this to Shopify so others are not caught out with the same tactic. We wanted a better experience for users and this doesnt even allow us to manually fix it because every single LCP is this fake image that we can't even dfind in our code. So we can't even see the true LCP and try to fix page elements.

TYSM for the response

[oreoorbitz · Accepted solution]

Hi, I'll remove LCP hack image pro-bono.

When we (My boss at renderbetter) discovered the LCP hack, we were trying to opitmize a website where there was a popup app that was loading the image, but invisible, but because it was technically the biggest image, it was registered as the LCP image and tanking the LCP score. It was an absolute nightmare to fix. That's when we realized that Lighthouse was focusing on just the biggest image in the viewport, but not putting much effort into the actually making sure the image was visible.  My relationship with Lighthouse has been love-hate, and when we released the LCP hack, I assumed google would notice it and patch it and improve the way it registers LCP images. 4 years later and no change.

Rant over. Anyway, yeah private message me Epsryn and I'll remove the LCP image hack.

[Epsryn]

Really? It sounds like you are from the original crew who discovered thi. It is definitely a really convincing "Hack" It would be amazing to have this removed. We are just a small business and reached out to try get a better user experience. We actually just want a site that users can navigate around. 

We would be happy to pay something for your time? We just wnat it gone. The shopify expert is claiming he never did this but no one has ever been given access to the stie except for him and before this the LCP of our homepage was our banner etc.

I have sent you a private message and I really appreciate you reaching out to us. It has left a really sour taste in our mouths. 

[Leysam]

Report that Shopify Expert to @Shopify, please. This is absolutely despicable 

[Epsryn]

I did,
And i would also like to say OreoOrbitz fixed it, removed multiple hacks and made genuine user based experienced that not only makes the website more responsive but made us pass the mobile core web vitals.

Also, if anyone is looking for site speed through shopify experts, check the websites they work on in pagespeed. I have found multiple others with 90+ mobile speeds that have the LCP hack. It is easy to notice once you know what you are looking for.

[ttander32]

Hello hope all is well. Can you look at my store to let me know if our Google Page Speed scores are fake and what we can do to improve?Thanks

[ttander32]

A Fiverr developer did this to me tonight. Unbelievable. I could tell that there was a hack on my store. Luckily I know how to read code. Don't use this person. I reported him to Fiverr. Alpha3861 hack. 

https://alpha3861.myshopify.com/cdn/shop/t/1/assets/alpha-6.0.10.js

eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('l(r.O=="P y"){i j=[],s=[];u Q(a,b=R){S c;T(...d)=>{U(c),c=V(()=>a.W(X,d),b)}}2.m="Y"+(2.z||"")+"Z";2.A="10"+(2.z||"")+"11";12{i a=r[2.m],e=r[2.A];2.k=(e.B(\'y\')>-1&&a.B(\'13\')<0),2.m="!1",c=C}14(d){2.k=!1;i c=C;2.m="!1"}2.k=k;l(k)i v=D E(e=>{e.8(({F:e})=>{e.8(e=>{1===e.5&&"G"===e.6&&(e.4("n","o"),e.4("f-3",e.3),e.g("3")),1===e.5&&"H"===e.6&&++p>q&&e.4("n","o"),1===e.5&&"I"===e.6&&j.w&&j.8(t=>{e.7.h(t)&&(e.4("f-7",e.7),e.g("7"))}),1===e.5&&"J"===e.6&&(e.4("f-3",e.3),e.g("3"),e.15="16/17")})})}),p=0,q=K;18 i v=D E(e=>{e.8(({F:e})=>{e.8(e=>{1===e.5&&"G"===e.6&&(e.4("n","o"),e.4("f-3",e.3),e.g("3")),1===e.5&&"H"===e.6&&++p>q&&e.4("n","o"),1===e.5&&"I"===e.6&&j.w&&j.8(t=>{e.7.h(t)&&(e.4("f-7",e.7),e.g("7"))}),1===e.5&&"J"===e.6&&(s.w&&s.8(t=>{e.3.h(t)&&(e.4("f-3",e.3),e.g("3"))}),e.9.h("x")&&(e.9=e.9.L("l(2.M)","N.19(\'1a\',u(1b){x();});l(2.M)").1c(", x",", u(){}")),(e.9.h("1d")||e.9.h("1e"))&&(e.9=e.9.L("1f","1g")))})})}),p=0,q=K;v.1h(N.1i,{1j:!0,1k:!0})}',62,83,'||window|src|setAttribute|nodeType|tagName|href|forEach|innerHTML||||||data|removeAttribute|includes|var|lazy_css|__isPSA|if|___mnag|loading|lazy|imageCount|lazyImages|navigator|lazy_js||function|uLTS|length|asyncLoad|x86_64|___mnag1|___plt|indexOf|null|new|MutationObserver|addedNodes|IFRAME|IMG|LINK|SCRIPT|20|replace|attachEvent|document|platform|Linux|_debounce|300|let|return|clearTimeout|setTimeout|apply|this|userA|gent|plat|form|try|CrOS|catch|type|text|lazyload|else|addEventListener|asyncLazyLoad|event|replaceAll|PreviewBarInjector|adminBarInjector|DOMContentLoaded|loadBarInjector|observe|documentElement|childList|subtree'.split('|'),0,{}))
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('B(m[\'\\4\\5\\n\\o\\6\\5\\7\\p\\8\'][\'\\q\\r\\9\\8\\s\\6\\9\\4\\7\'].u(\'C\')!=-1&&m[\'\\4\\5\\n\\o\\6\\5\\7\\p\\8\'][\'\\q\\r\\9\\8\\s\\6\\9\\4\\7\'].u(\'D\')!=-1){v i=[],E=[];F G(a,b=H){I c;J(...d)=>{K(c),c=L(()=>a.M(N,d),b)}}v w=O P(e=>{e.j(({Q:e})=>{e.j(e=>{1===e.f&&"R"===e.g&&(e.3("x","y"),e.3("k-2",e.2),e.l("2")),1===e.f&&"S"===e.g&&++z>A&&e.3("x","y"),1===e.f&&"T"===e.g&&i.U&&i.j(t=>{e.h.V(t)&&(e.3("k-h",e.h),e.l("h"))}),1===e.f&&"W"===e.g&&(e.3("k-2",e.2),e.l("2"),e.X="Y/Z")})})}),z=0,A=10;w.11(12.13,{14:!0,15:!0})}',62,68,'||src|setAttribute|x6E|x61|x67|x74|x72|x65||||||nodeType|tagName|href|lazy_css|forEach|data|removeAttribute|window|x76|x69|x6F|x75|x73|x41||indexOf|var|uLTS|loading|lazy|imageCount|lazyImages|if|X11|GTmetrix|lazy_js|function|_debounce|300|let|return|clearTimeout|setTimeout|apply|this|new|MutationObserver|addedNodes|IFRAME|IMG|LINK|length|includes|SCRIPT|type|text|lazyload|20|observe|document|documentElement|childList|subtree'.split('|'),0,{}))