How performance audits resulted in creation of our own Image Optimizer with CDN features
Website loading speed is a hot button for eCommerce. Nobody likes to shop on a slow site. Our team regularly receives requests to make performance audits of online stores and marketplaces to find speed and security bottlenecks and give recommendations on how to eliminate them.
Today we want to cover how performance audits resulted in creation of our own Image Optimizer with CDN features for CS-Cart and Multi-Vendor CMS. Spoiler: it really works and figures down below will prove it.
Why load speed matters
In general, online store performance and page load speed are important for three reasons:
- Slow sites lose customers - the longer your website loads, the higher is the desire to go back to the search. Google states that 53% of visits are abandoned if a mobile site takes longer than 3 seconds to load.
- Fast sites are more likely to rank higher in organic (remember moving to Mobile-First indexing). In paid search, slow landing pages lower the Google Ads Quality Score, which means a higher cost per click.
- More and more visitors associate the speed of your website and its overall performance with the quality of your brand in general. In other words, a slow site means slow customer service and slow updates.
Large sites ride it out due to the complex of other factors in addition to performance: brand awareness, the product range, and loyalty programs. If a person is looking for a specific store, they are ready to survive a long loading time.
Small shops or eCommerce newcomers live by different rules. In terms of assortment and service, it is not easy to compete with large stores and marketplaces. But due to the quality - for example, a fast and convenient site - you can keep the client and at the same time improve your position in the local search results.
Why we decided to create our own Image Optimizer with CDN features for CS-Cart and Multi-Vendor CMS
While making the enhanced performance audits for clients who came in with the problem of “slow page loading, especially after imports” we have identified a couple of common problems:
- Long thumbnail generation especially for large original images.
- Additional load on server while generation/regeneration of thumbnails after mass import or synchronization.
- Generated thumbnails require significant storage space.
- Some images are kept in WebP format, some in old formats. Images are not fully optimized for the browser.
Our clients kept asking for a quick solution of these problems without complicated code modifications and expensive plugins which might conflict with their CMS core or overload the capacity of existing servers. When we collected a certain number of such requests from the clients we initiated the internal procedure of solution development.
We did some research and decided to move the thumbnail generation process to our CDN (Content Delivery Network) facilities. This greatly speeded up the work of the projects involved in the testing because the clients’ servers did not generate thumbnails anymore and consequently their capacity didn’t decrease.
Another hypothesis was to store the generated thumbnails on our CDN instead of the clients’ servers. In this case we would save space on the clients’ servers and increase their performance for other critical tasks such as running the database, generating CS-Cart cache, importing and exporting products, and other essential processes. This prevents resource competition between image processing tasks and the other processes necessary for the smooth operation of the project. No need to buy expensive NVMe disks for storing images and thumbnails when the online store grows - isn’t it great?
How it works
Our Image Optimizer solution optimizes website loading time by implementing basic geo-balanced cloud-based image processing and storage. It operates by using the original images that are stored on your server and generating thumbnails in the cloud. This approach eliminates the need for multiple copies of the same image, which can consume valuable disk space. According to our internal statistics, normally 1 image requires generation of 5-10 thumbnails and each product in an online store might have up to 3-7 different images. This means that the ultimate size of generated thumbnails might exceed the original image size by 40-50%. Thumbnails stored on your server can be safely removed, freeing up even more disk space.
For each region there is a connected failover in case there is any problem with the dedicated data center. We understand how valuable your data is and double protect each operation.
But that’s not all. We noticed that in most slow projects images are kept in various formats and they are not optimized for browsers. So our Image Optimizer solution also automatically converts images to WebP format reducing their weight up to 50-80% without loss of quality. This results in up to a 40% reduction in page load time.
Some of our clients expressed concern about the consequences if they abandon usage of this CDN solution. For example, they were afraid to lose the generated thumbnails or even the original pictures. Fortunately, there’s absolutely nothing to worry about. Even if you decide to abandon our CDN service, the thumbnails will simply be generated on your server again, and the site will function as it did before our service. This means that there is no risk involved in using our CDN service and that it provides a flexible and scalable solution for optimizing disk space.
Now it’s time for the promised figures and here they are
It became easier for the browser to process the page, which had a positive effect on the page loading from the browser and the work of JavaScript.
As an overall result, the Cumulative Layout Shift (CLS) was significantly reduced and the total page open time was reduced by 42%.
Summary
Battle for high website performance and quick page loading becomes easier if you use solutions provided by eCommerce experts who deal with thousands of client’s servers and know in detail their performance bottlenecks.
The Scalesta team has developed its own Image Optimizer for CS-Cart online stores and Multi-Vendor marketplaces. This comprehensive and cost-effective optimizing solution with CDN features speeds up the project, removes additional load from the server and saves the disk space on the server.
Feel free to reach our Support team for further assistance and learn how you can enhance user experience without expensive code modifications and leverage market competition in terms of your project performance.
P.S. The Scalests team is open to any suggestions from your side concerning the scope of works included into the Managed eCommerce Hosting service. Our motto is “Leave server worries to professionals” that’s why we continuously improve our current services by including new features in regular plans for your convenience and business growth.