How many components are too many?

I’m building an app using Twitter Bootstrap. I’ve started to wrap similar structures as ember components that primarily simply represent Bootstrap HTML structure and CSS classes. For example, I have one page that starts out like:

{{#pages.main-content fixedWidth=false}}
  {{#pages.panel-with-sidebar expanded=displayFilters title="Industries"}}
    {{#pages.sidebar-block}}
      {{filters.industry-filters params=model paramsChanged=(action 'setParam')}}
    {{/pages.sidebar-block}}
....

Any thoughts? Is this a long-term performance problem?

I would package up those components as an addon.

Then you could keep your project codebase cleaner, put the components on GitHub so that others can help improve them, and track git changes for the factored-out components separately.