In the product page of a configurable product, the product swatch (Magento_Swatches/*/renderer.js) will only execute after all JS complete loading, and it also shows a loading spinner while loading, which blocks user interactivity and causes the layout shift (CLS). This makes a very bad score on Google PageSpeed test, and of course, bad user experience.

Does anyone know a technique, hint or extension that can improve this swatch renderer?

  • You could set a min-height css for the swatch block for CLS score. Overall, it's performance is dire.
    – elfling
    Jan 9 at 13:38


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.