This is the final implementation for the tree menu I'm using for a Symfony application.
The first approach wrote the JSON for the menu store into the template. This was a little awkward and as the application grew, the amount of content increased.
Next, I had an idea that I could create a multi-tiered tree which would have a static top tier, but include content in the lower levels. The value of this was that the user could navigate directly to content, for example the details of a client. Lazy loading was used to limit the number of requests and size of responses. It worked. But it was slow. And I realized that as the amount of data increased, it would get slower. In addition, navigating through three or more levels on a tree is inefficient. So, I wanted something that was faster and streamlined.
The first change I made was to add an autocomplete search box, which allows the user enter the name of the item they need. It could be the name of a person, a barcode or a company. The search code isn't complete.
Then I rewrote the JsonRenderer and the MenuStoreController such that there is only a static menu delivered via Ajax.
These are the service configurations.
The MenuStoreController calls the KnpMenuBuilder, then the JsonRenderer and delivers the result as JSON to the client.
The JsonRenderer iterates through the menu and creates the data for the dijit/Tree.
menu.js requests the menu data and renders it on the page.