By default, all images on online store pages are loaded at the same time, resulting in slower loading speeds, pessimized search queries, longer wait times, and poorer user experience.
Why it's important:
- Customers generally don't wait longer than 5 seconds for slow sites to load, it's easier for them to find a competitor.
- Loading speed affects a site's ranking in search engines. If the site takes a long time to load, the search engine robot may not have time to fully index it.
- Server overload and increased storage and data transfer costs.
What can be done?
A simple solution is to postpone downloading anything that is not needed by the user right now. To do this, we have developed an add-on "Deferred Image Upload", which only uploads images when they are visible to the user. The rest of the images are loaded as the page scrolls. This speeds up page loading and reduces resource consumption.
This optimization method is especially useful for sites with a large number of images, such as online stores, pages with a large number of images, photo galleries or portfolios.
According to the results of our measurements on a test site (100 products and 4 banners were placed on the page) :
- Page loading speed increased by 1.5 times;
- Reductions in HTTP requests;
- Decrease in total page size;
- Reducing the time to interaction with the site.
Before installing the add-on
After installing the add-on
Add-on Features
The add-on is easy to install and requires no additional settings.
- Store Builder
- Store Builder Ultimate
- Multi-Vendor
- Multi-Vendor Plus
- Multi-Vendor Ultimate
- Owners
- English
- Русский
- 4.18.X
- 4.17.X
- 4.16.X
Add-on installation
After downloading the add-on, it can be installed using the standard CS-Cart tools on the page Admin Panel → Add-ons → Manage Add-ons → Upload and Install Add-on (+).
For CS-Cart version 4.13.1 or later, go to Admin Panel → Add-ons → Manage Add-ons → Gear Icon → Manual installation.
Setting up the add-on
After installation, the add-on is ready to work.
The add-on has a single setting Use external js component.
In some cases, it may be necessary to download the JavaScript library from an external source for the add-on to work correctly. This may apply to situations where images or other media elements, such as brand logos, are not displayed properly.
v1.0.3 from 11.12.2023
[*] Changed short tags to regular
[*] Add-on standardization
v1.0.2 from 12.05.2023
[*] Licensing