I want to implement a menu on the site that, when I hover over it, will expand the subcategories. Planned 3 levels of nesting. The site is bilingual. I want to change the names of menu items when changing the language.
Considered 2 ways to implement.
Uploading the main categories to the model when rendering the page. I also use Thymeleaf. Further, when you hover the cursor over the main menu item, an ajax request is triggered, which transmits subcategories and so on. Found some cons:
when you hover the query is triggered 2 times;
It is necessary to check for the presence of already unloaded subcategories;
constant requests to the server when navigating the menu.
Unload at once all the main categories, subcategories of level 1, subcategories of level 2. All parsed and shoved on the desired tags on the client. Here, as a minus, there is a certain complexity of implementation in the processing of a large data set, since it is necessary to transfer objects with id and name, and even triple nesting.
Advise which of the options is more correct or maybe there are other ways to implement such a menu.
Thank you in advance.
