I’m using the latest version of mmenu.js, and I’ve noticed that when I try to display too many items in the mmenu, it malfunctions. The page flickers(glitchers) and slows down significantly. Interestingly, I’ve only observed this issue on Android devices using the Chrome browser.
I’ve mocked up 2 versions on Codepen:
The first version is the buggy one, with 417 items in the mobile menu:
Buggy Version – Codepen
The second version is identical to the first, but with only 224 items. This one works fine:
Working Version – Codepen
Initialization:
document.addEventListener('DOMContentLoaded', function () {
//Mmenu initialize
const menu = new Mmenu( "#js-mobile-nav", {
"offCanvas": {
"position": "left-front"
},
"counters": {
"add": true
}
}, {
offCanvas: {
page: {
selector: ".main-content"
}
}
});
const api = menu.API;
//Hamburger menu click event
document.querySelector("#js-hamburger-icon").addEventListener(
"click", (evnt) => {
evnt.preventDefault();
api.open();
}
);
document.querySelector(".js-close-menu").addEventListener(
"click", (evnt) => {
evnt.preventDefault();
api.close();
}
);
});
Devices I’ve tested on and encountered the issue:
Real device:
Xiaomi 11T – Android 14 UP1A.231005.007
Chrome 125.0.6422.72
Browserstack:
Samsung Galaxy S22 v12.0 – Android 12
Chrome 123.0.6312.40
I’ve also recorded a video demonstrating the buggy behavior.
What could be causing this issue? Is there a way to solve it? Am I correct in assuming that the large number of items is causing the problem?
Thank you for your help!
What I Tried:
I initially loaded my menu with 417 items using the latest version of mmenu.js. I expected the menu to handle the large number of items smoothly, as it does with fewer items.
What I Expected:
I expected the mmenu to display all items without causing any performance issues, such as flickering or slowing down the entire page.
What Actually Happened:
When I loaded the menu with 417 items, the page started to flicker and slow down significantly. This issue only occurred on Android devices using Chrome. However, when I reduced the number of items to 224, the menu worked perfectly without any glitches.