Problem/Motivation

Large menus (100+) items with various nesting levels are very difficult to manage via drag and drop.
e.g. re-ordering can freeze the UI rendering for 10+ seconds.

I found #1972462: Redesign drag and drop interactions, and nested menu items, for all devices that aims to tackle the whole interaction for all devices.

#2742371: Drag and drop interfaces can break either browsers or exceed PHP server limits for forms and #1565704: Core interfaces can go over max_input_vars also become a problem with large menus.

Proposed resolution

There is https://www.drupal.org/project/bigmenu for D7, with an initial D8 port at https://github.com/becw/bigmenu.

Arguably this should be tackled in core as it is not uncommon to have large menus that are managed by non-technical users that rely on the drag and drop functionality.

At the very least, it should be possible to collapse the menus to a certain level and change how weights are calculated post drop.

Remaining tasks

TBD

User interface changes

TBD

API changes

N/A?

Data model changes

N/A

Comments

zerolab created an issue. See original summary.

cilefen’s picture

cilefen CreditAttribution: cilefen as a volunteer commented
Component: javascript » menu system
Category: Feature request » Task
Issue tags: +JavaScript
droplet’s picture

droplet CreditAttribution: droplet commented

IE/EDGE, right?

#2876224: Make Drupal.tableDrag.restripeTable 10x faster

zerolab’s picture

zerolab CreditAttribution: zerolab at Torchbox for The Chartered Society of Physiotherapy commented
Related issues: +#2867451: Improve tabledrag.js performance

I see this behaviour in latest Chrome/FF.

But #2867451: Improve tabledrag.js performance sounds related

droplet’s picture

droplet CreditAttribution: droplet commented

Large menus (100+) items

Can I have more details on the menu trees? Started from 100 is too little for Chrome.

(I agreed a redesign is required but we still need some quick tweaks for now if we can.)

zerolab’s picture

zerolab CreditAttribution: zerolab at Torchbox for The Chartered Society of Physiotherapy commented

Hi droplet,

You are right, 100 items are easily handled by Chrome. In this case it is 1243 items. You can see the behaviour at https://youtu.be/rZXbKzavlxQ
Will give https://www.drupal.org/files/issues/improve-tabledrag-performance.patch / https://www.drupal.org/files/issues/tabledrag_js_reduce-1571814-34.patch a try and see if it improves anything.

Version: 8.5.x-dev » 8.6.x-dev

Drupal 8.5.0-alpha1 will be released the week of January 17, 2018, which means new developments and disruptive changes should now be targeted against the 8.6.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

Version: 8.6.x-dev » 8.7.x-dev

Drupal 8.6.0-alpha1 will be released the week of July 16, 2018, which means new developments and disruptive changes should now be targeted against the 8.7.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

Version: 8.7.x-dev » 8.8.x-dev

Drupal 8.7.0-alpha1 will be released the week of March 11, 2019, which means new developments and disruptive changes should now be targeted against the 8.8.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

Version: 8.8.x-dev » 8.9.x-dev

Drupal 8.8.0-alpha1 will be released the week of October 14th, 2019, which means new developments and disruptive changes should now be targeted against the 8.9.x-dev branch. (Any changes to 8.9.x will also be committed to 9.0.x in preparation for Drupal 9’s release, but some changes like significant feature additions will be deferred to 9.1.x.). For more information see the Drupal 8 and 9 minor version schedule and the Allowed changes during the Drupal 8 and 9 release cycles.

Version: 8.9.x-dev » 9.1.x-dev

Drupal 8.9.0-beta1 was released on March 20, 2020. 8.9.x is the final, long-term support (LTS) minor release of Drupal 8, which means new developments and disruptive changes should now be targeted against the 9.1.x-dev branch. For more information see the Drupal 8 and 9 minor version schedule and the Allowed changes during the Drupal 8 and 9 release cycles.

Version: 9.1.x-dev » 9.2.x-dev

Drupal 9.1.0-alpha1 will be released the week of October 19, 2020, which means new developments and disruptive changes should now be targeted for the 9.2.x-dev branch. For more information see the Drupal 9 minor version schedule and the Allowed changes during the Drupal 9 release cycle.

Version: 9.2.x-dev » 9.3.x-dev

Drupal 9.2.0-alpha1 will be released the week of May 3, 2021, which means new developments and disruptive changes should now be targeted for the 9.3.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

Version: 9.3.x-dev » 9.4.x-dev

Drupal 9.3.0-rc1 was released on November 26, 2021, which means new developments and disruptive changes should now be targeted for the 9.4.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

Version: 9.4.x-dev » 9.5.x-dev

Drupal 9.4.0-alpha1 was released on May 6, 2022, which means new developments and disruptive changes should now be targeted for the 9.5.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

Version: 9.5.x-dev » 10.1.x-dev

Drupal 9.5.0-beta2 and Drupal 10.0.0-beta2 were released on September 29, 2022, which means new developments and disruptive changes should now be targeted for the 10.1.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

Version: 10.1.x-dev » 11.x-dev

Drupal core is moving towards using a “main” branch. As an interim step, a new 11.x branch has been opened, as Drupal.org infrastructure cannot currently fully support a branch named main. New developments and disruptive changes should now be targeted for the 11.x branch, which currently accepts only minor-version allowed changes. For more information, see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.