Structuring Modular content of different type

For a site each page can have any number of "boxes" to display and also any number of "tabs". Using the modular page concept, each tab and each box would be a modular subpage.

What is the best way to distinguish between the two types of modular content when building the templates. If both, boxes and tabs are on the same directory level then the collection is flat and would iterate over both types unable to distinguish if they are a box or a tab. However I like to iterate first over the boxes and later the tabs. I tried using a two-level modular hierarchy like below and then use page.collection|first and page.collelction|last to access tabs and boxes in the template and then have sub-templates processing the respective collection.
- some-page _tabs _tab1 _tab2 _boxes _box1 _box2 -
This works, but I wonder whether this is a sensible way of categorising modular subcontent or is there a better or recommended way were we can keep the modular pages flat rather in an hierarchy.

Do you really need to break tabs out into separate modular pages? This looks fine, but seems like a bit of overkill to me.

I would probably break tabs out into a single page and separate each tab with some character string or something.

There's no wrong way to do these things, I just usually lean towards the simplest approach with the least amount of pages as possible. The less pages there are, the faster things will run. And I usually prefer speed over almost all other metrics :)

Thanks for the comments. I probably stick to the structure shown above for now. The tabs are modular pages because most of them have collections of their own, so there is a reason for the more complex structure. My questions was mostly related to the best way of separating the two different types of modular pages for processing purposes. Another way which came to my mind was implementing a template name filter and then iterating the collections this way:
page.collection|template('_box')
and
page.collection|template('_tab')

You can't really change templates with a filter, however you can accomplish this with a simple include:

{% include 'boxes.html.twig' with {'collection':page.collection} %}

and

{% include 'tabs.html.twig' with {'collection':page.collection} %}

Then in each of these templates, simply loop over the collection items in the collection and display them as you wish.