Challenges
As Iconic India’s online catalogue grew, customers began facing friction while browsing collection pages. Infinite scrolling sometimes stopped working, loaded duplicate products or left the loading icon running without displaying anything new.
Filters and sorting could also break after more products were loaded, while mobile users experienced slower scrolling and page lag.
The storefront had other consistency and performance issues as well. Product images appeared in different sizes, promotional badges required repeated product-level updates, and a combination of heavy assets, third-party scripts and inefficient theme code affected page speed.
Customers also experienced a noticeable delay between selecting Add to Cart and seeing the side cart open.
Solution
As a Shopify Experts Agency, Lucent innovation reviewed the complete Shopify browsing and cart experience rather than treating each issue separately. The collection-loading system was rebuilt using the Intersection Observer API, request locking, and better pagination management.
This prevented duplicate requests, improved loading behaviour and helped filters and sorting continue working as more products appeared.
Product images were placed inside responsive containers to create a more consistent collection layout. A collection-based discount-badge system was also developed using Shopify Theme Settings and metafields, allowing the merchandising team to manage promotions without updating every product individually.
Storefront performance work focused on the areas that directly affected customer journeys:
- Images were optimized and lazy loading was introduced.
- Non-critical scripts were deferred and unused CSS and JavaScript were removed.
- Repeated Shopify cart API calls were reduced and the legacy side-cart code was refactored.
Recurring Shopify health checks were then introduced to review website speed, SEO health, application compatibility, mobile layouts and important journeys such as product discovery, Add to Cart and checkout.
