images on home page overlap on load - magento

Images on my home page overlap on load and also the it takes more time to load. Iam using magento 1.9.
I had used Litespeed_LiteMage magento extension to speed up my site load time but still there is no change.
I am still getting overlap images on page load.
How can I overcome this overlap issue

Mostpropably it is an error in your CSS. But there can be a lot of reasons why images overlap... maybe you can post a link here?

Related

Magento2 homepage products section is loading slowly

my homepage is loading fast but its taking around 5 seconds for the products list widget/section to show in homepage.
Its website its around 3 seconds but in mobile its minimum 5 seconds.
The whole products widget section will be empty space and then the whole section appears at once.
I enabled varnish, redis cache but varnish and redis didnt make any difference.
I bundled css and js files and also enabled merging js and css files.
My questions:
How are the products loading? Ajax/API call or rendered directly from server. I don't see any API calls in network tab so I think products are rendered directly from html. But why is the lag as if its coming from some API. We are using webp for images so I think images are not the issue.
Is the speed lag happening due to heavy javascript ?
Thanks.
Product widgets are usually last to load on the home page as they need to load the product collection before rendering it compared some content blocks which can be purely html.
If using the blank / luma themes, check the templates if there are overriding the widgets / product templates such as vendor/magento/module-catalog/view/frontend/templates/product/list/items.phtml or vendor/magento/module-catalog/view/frontend/templates/product/list.phtml and their related block elements
If it's a 3rd party theme like Smartwave Porto they could potentially have lazy loading used on product images to delay the widgets from loading straight away.
You can also enable the dev profiler bin/magento dev:profiler:enable to see which elements are loading heavy on the php side.

Static images loads really slow

So, my assets folder in Angular app has a size of about 1GB where images are close to 134MB and a video of 738 MB. A component which displays these images take about 3-4 seconds to render in local, and it takes more than a minute on a application which is deployed to PCF(even after using AOT).
Strange thing is that the components renders just in fraction of
seconds if we revisit it.
I have tried using lazy loading for images by using deferload. But,
still the problem not resolved.
Could someone share their thoughts on this.
Mostlikely fetching such big images causes the app to load slow.
It is probably unnecessary to have such big image size. You could try to resize the images with something like lambda resize image.
Also if you revisit the site all the data is already cached in the browser. You could try to disable cache in the network tab and it should be slow on every visit of the site
You can use npm install package ng-lazyload-image
Fine the url for description and usage docs
https://www.npmjs.com/package/ng-lazyload-image

my opencart website is not displaying images on on way back machine

My opencart website is not displaying images on way back machine of Alexa.com (How did
www.aaa------aa.com
look in the past?), I have checked multiple dates but images does not display anywhere.
My opencart images are also not getting crawled by google merchant center, it shows that it is because of the robots.txt but I have removed images from robots.txt file & still it shows same error.
My website is working fine otherwise and I am also getting orders but want to know if the above two issues are interrelated and what can be the best solution to this problem.
Thanks,
Gaurav
from what you are saying i think the problem with wayback machine is that you cache of images got cleared so ofcource most urls of images are dead, since opencart get 98% of images from cache after they get resized. So no problem there, i think this happens with every oencart setup that cached images are cleared from time to time, also in the same fashion please check images folder and sub-directories if you have any .htaccess limiting everything but local requests, also one last notice google usually takes from one day and up to update data regarding robots.txt and other data.
And if nothing works out try to specifically allow access to one directory with robots.txt
Hope i could help you.

Fixing slow response time for resources

I have a Magento website and I have been noticing an increase in warnings from Catchpoint that various images, CSS files, and javascript files are taking longer than usual to load. We use Edgecast for our CDN and have all images, CSS, and JS files hosted there. I have been in contact with them and they determined that the delays happen when the cache for the resource has expired and it must contact the origin for an updated file. The problem is that I can't figure out why it would take longer than a second to return a small image file. If I load the offending image off our server (not from the CDN) in my browser it always returns quickly. I assume that if you call up an image file directly using the full URL to the image file (say a product image, for example), that would bypass any Magento logic or database access and simply return the image to you. This should happen quickly, and it normally does, but sometimes it doesn't.
We have a number of things in play that may have an effect. There are API calls to the server for various integrations, though they are directed at a secondary server and not the web frontend. We may also have a large number of stale images since Magento doesn't delete any images even if you replace them or delete the product.
I realize this is a fairly open ended question, and I'm sorry if it breaks SO protocol, but I'm grasping at straws here. If anyone has any ideas on where to look or what could cause small resource files, like images, to take upwards of 8 seconds to load, I'm all ears. As an eCommerce site, it's getting close to peak season, and I can feel the hot breath of management on my neck. Any help would be greatly appreciated.
Thanks!
Turns out we had stumbled upon some problems with the CDN that they were somewhat aware of and not quick to admit. They made some changes to our account to work around the issues and things are much better now.

Magento Caching Custom Images

I am using the avalanche theme and make use of the homepage slider.
The images are added to the site via a section in the admin panel and they are stored in
media/banners/default/slidex.jpg
I notice that these images are not being cached and loaded directly from their location. Is there any way to include images such as these in the magento image cache in order to reduce load time?
As these are large banner images you would expect them to take longer to load, however in the pingdom tools analysis for my home page it indicates that the server side wait is much longer than the time it actually takes to receive the files.
I had a similar problem witch was caching a resized brand logo slider images.
I solved the problem by storing the resized images in media/product/cache/resized_images - with Mage::getBaseDir('media'). So, you just need to check if the cached image exists before regenerating it.
Everything in this folder is deleted when flushing image cache in admin.
I hope it helps.

Resources