Как оптимизировать мой код для большей производительности?

Question

Мой вопрос более концептуальный. Я был read guide, API on the site и посмотрел some slides, но я не уверен в своем решении. Я сделал компонент, но, похоже, это может быть лучше.

Я беспокоился о многих тегах <script id="metamorph-73-end" type="text/x-placeholder"></script>

Вопрос 1: Как я могу уменьшить его?

Вопрос 2: Верно, что подсчетные числа == подсчитывают прослушиватели событий?

Спасибо!

Шаблоны:

<script type="text/x-handlebars" data-template-name="components/bootstrap-select"> 
    <a class="btn dropdown-toggle btn-mini" data-toggle="dropdown" href="#"> 
     {{selected_name}} <span class="caret"></span> 
    </a> 
    <ul class="dropdown-menu"> 
     {{#each items}} 
      <li {{action "chosen" this.id this.name on="click" }}><a href="#">{{this.name}}</a></li> 
     {{/each}} 
    </ul> 
</script> 

<script type="text/x-handlebars" data-template-name="components/filter-offers"> 
     <span class="label_filter">Фильтр </span> 
      {{bootstrap-select name="filter_day" data=App.CONSTANTS.DAYS_OF_WEEK selected=0}} 
      {{bootstrap-select name="filter_city" data=App.CONSTANTS.CITIES selected=2}} 
      {{bootstrap-select name="filter_section" data=App.CONSTANTS.SECTION selected=1}} 
     </div> 
</script> 

JavaScript:

App.BootstrapSelectComponent = Em.Component.extend({ 
    tagName: 'div', 
    classNames: ['ember-view', 'btn-group'], 
    // custom fileds 
    name: '', 
    data: [], 
    items: function(){ 
     return this.get('data').map(function(row){ 
      return Em.Object.create({id: row[0], name: row[1]}); 
     }); 
    }.property('data'), 
    selected: NaN, 
    selected_name: function(){ 
     var id = this.get('selected'), 
      item = this.get('items').filter(function(item, index){ 
       if (item.id == id) return true; 
      }); 
     if (item[0] && 'name' in item[0]) 
      return item[0]['name']; 
     else 
      return ''; 
    }.property('selected'), 
    // setup actions 
    action_name: function(){ 
     var name = 'select_updated_' + this.get('name'); 
     return name.camelize(); 
    }.property(), 
    actions: { 
     chosen: function(value, name) { 
      // save to memory 
      this.set('selected', value); 
      // bubble action 
      this.sendAction('action_name', 
          this.get('selected'), 
          this.get('selected_name')); 
     } 
    } 
}); 

App.FilterOffersComponent = Em.Component.extend({ 
    init: function() { 
     this._super(); 
    }, 
    templateName: 'filter-offers', 
    didInsertElement: function(){ 
     //console.log(this.get('childViews').mapProperty('selected'));  
    }, 
    // setup actions 
    action: function(){ 
     // by default filterOffersUpdated 
     var name = this.get('templateName') + '_updated'; 
     return name.camelize(); 
    }.property('templateName'), 
    actions: { 
     selectUpdatedFilterDay: function(){ 
      this.sendAction('action'); 
     }, 
     selectUpdatedFilterCity: function(){ 
      this.sendAction('action'); 
     }, 
     selectUpdatedFilterSection: function(){ 
      this.sendAction('action'); 
     } 
    } 
}); 

Answer 1

Я хотел бы сказать, что ваша проблема не является необходимым. Количество тегов не обязательно означает количество слушателей действий. Некоторые теги - это слушатели, некоторые - нет. У вас есть только правильная сумма: 1 на элемент.

Это то, что вы искали?