2

I am working on a wholesale website in Magento 2 and have noticed the front-end performance drops off massively when the mini-cart has to render too many items (over say, 20 different SKUs).

I'm sure I can figure out how to hide the cart myself if there are more than a certain number of items but I was wondering if there's an 'official' way to do this?

I found a method in Magento\Checkout\Block\Cart\Sidebar which seems to get a config value for this purpose:

/**
 * Return max visible item count for minicart
 *
 * @return int
 */
private function getMiniCartMaxItemsCount()
{
    return (int)$this->_scopeConfig->getValue('checkout/sidebar/count', ScopeInterface::SCOPE_STORE);
}

However this doesn't seem to have the intended effect.

I've traced it through to vendor/magento/module-checkout/view/frontend/web/js/view/minicart.js where the value is assigned to the mini-cart in initSidebar() but it only seems to adjust the height (CSS) of the mini-cart?

This would obviously have no effect on the performance of the page...

Do I need to come up with my own add-on somewhere in the render chain instead?

  • In Magento by default it shows 10 products in mini cart so in your case all are coming in list? – Charul Tyagi Aug 29 '18 at 11:09
  • @CharulTyagi Yes, it's showing the whole cart, could this be the theme interfering with the default behaviour? – James Aug 29 '18 at 13:00
0

In the interest of completeness, I accomplished this for now by modifying Magento_Checkout/web/template/minicart/content.html in my theme and adding a Knockout if to check item count (not the total item quantity) and display a message if it exceeds the defined limit rather than rendering the items:

<!-- ko if: getCartParam('summary_count') -->
    <strong class="subtitle"><!-- ko i18n: 'Recently added item(s)' --><!-- /ko --></strong>
    <div data-action="scroll" class="minicart-items-wrapper">
        <!-- ko if: getCartParam('items').length < 16 -->
            <ol id="mini-cart" class="minicart-items" data-bind="foreach: { data: getCartParam('items'), as: 'item' }">
                <!-- ko foreach: $parent.getRegion($parent.getItemRenderer(item.product_type)) -->
                    <!-- ko template: {name: getTemplate(), data: item, afterRender: function() {$parents[1].initSidebar()}} --><!-- /ko -->
                <!-- /ko -->
            </ol>
        <!-- /ko -->
        <!-- ko if: getCartParam('items').length > 15 -->
            <p>Please use the link above to view your basket.</p>
        <!-- /ko -->
    </div>
<!-- /ko -->

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.