MD Downloads: reduce the amount of dom-ifs to speed Polymer up

chrome/browser/resources/md_downloads/item.html

 <link rel="import" href="chrome://resources/html/action_link.html">
 <link rel="import" href="chrome://resources/html/cr.html">
 <link rel="import" href="chrome://resources/html/load_time_data.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/polymer/polymer.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-material/paper-material.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-progress/paper-progress.html">
 <link rel="import" href="chrome://downloads/action_service.html">
 <link rel="import" href="chrome://downloads/constants.html">
 <link rel="import" href="chrome://downloads/throttled_icon_loader.html">
 
 <dom-module id="downloads-item">
   <template>
-    <template is="dom-if" if="[[!hideDate]]">
-      <h3 id="date">[[computeDate_(data_.since_string, data_.date_string)]]</h3>
-    </template>
+    <h3 id="date" hidden$="[[hideDate]]">[[computeDate_(data_.since_string, data_.date_string)]]</h3>
 
     <paper-material id="content" on-dragstart="onDragStart_"
         elevation$="[[computeElevation_(isActive_)]]"
         class$="[[computeClass_(isActive_, isDangerous_, showProgress_)]]">
       <div id="file-icon-wrapper" class="icon-wrapper">
         <img class="icon" id="file-icon" alt="" hidden$="[[isDangerous_]]">
         <div class="icon" id="warning" hidden$="[[!isDangerous_]]"></div>
       </div>
 
       <div id="details">
         <div id="title-area"><!--
           Can't have any line breaks.
           --><a is="action-link" id="file-link" href$="[[data_.url]]"
               on-click="onFileLinkClick_"
               hidden$="[[!completelyOnDisk_]]">[[data_.file_name]]</a><!--
           Before #name.
           --><span id="name"
               hidden$="[[completelyOnDisk_]]">[[data_.file_name]]</span>
           <span id="tag">[[computeTag_(data_.state, data_.last_reason_text, data_.file_externally_removed)]]</span>
         </div>
 
         <a id="url" target="_blank" href$="[[data_.url]]">[[data_.url]]</a>
 
         <div id="description">[[computeDescription_(data_.state, data_.danger_type, data_.file_name, data_.progress_status_text)]]</div>
 
-        <template is="dom-if" if="[[showProgress_]]">
-          <paper-progress id="progress"
-              indeterminate$="[[isIndeterminate_(data_.percent)]]"
-              value$="[[data_.percent]]"></paper-progress>
-        </template>
+        <paper-progress id="progress" hidden$="[[!showProgress_]]"
+            indeterminate$="[[isIndeterminate_(data_.percent)]]"
+            value$="[[data_.percent]]"></paper-progress>
 
         <div id="safe" class="controls" hidden$="[[isDangerous_]]">
           <a is="action-link" id="show" i18n-content="controlShowInFolder"
               on-click="onShowClick_" hidden$="[[!completelyOnDisk_]]"></a>
-          <template is="dom-if" if="[[data_.retry]]">
-            <paper-button id="retry"
+          <template is="dom-if" if="[[!completelyOnDisk_]]">
+            <paper-button id="retry" hidden$="[[!data_.retry]]"
                 on-click="onRetryClick_">[[i18n_.retry]]</paper-button>
-          </template>
-          <template is="dom-if" if="[[isInProgress_]]">
-            <paper-button id="pause"
+            <paper-button id="pause" hidden$="[[!isInProgress_]]"
                 on-click="onPauseClick_">[[i18n_.pause]]</paper-button>
-          </template>
-          <template is="dom-if" if="[[data_.resume]]">
-            <paper-button id="resume"
+            <paper-button id="resume" hidden$="[[!data_.resume]]"
                 on-click="onResumeClick_">[[i18n_.resume]]</paper-button>
-          </template>
-          <template is="dom-if" if="[[showCancel_]]">
-            <paper-button id="cancel"
+            <paper-button id="cancel" hidden$="[[!showCancel_]]"
                 on-click="onCancelClick_">[[i18n_.cancel]]</paper-button>
           </template>
           <span id="controlled-by"><!-- Text populated dynamically. --></span>
         </div>
 
         <template is="dom-if" if="[[isDangerous_]]">
           <div id="dangerous" class="controls">
             <!-- Dangerous file types (e.g. .exe, .jar). -->
-            <template is="dom-if" if="[[!isMalware_]]">
-              <paper-button id="discard" on-click="onDiscardDangerous_"
-                  class="discard">[[i18n_.discard]]</paper-button>
-              <paper-button id="save" on-click="onSaveDangerous_"
-                  class="keep">[[i18n_.save]]</paper-button>
-            </template>
+            <paper-button id="discard" on-click="onDiscardDangerous_"
+                class="discard" hidden$="[[isMalware_]]">[[i18n_.discard]]</paper-button>
+            <paper-button id="save" on-click="onSaveDangerous_"
+                class="keep" hidden$="[[isMalware_]]">[[i18n_.save]]</paper-button>
 
             <!-- Things that safe browsing has determined to be dangerous. -->
-            <template is="dom-if" if="[[isMalware_]]">
-              <paper-button id="danger-remove" on-click="onDiscardDangerous_"
-                  class="discard">[[i18n_.remove]]</paper-button>
-              <paper-button id="restore" on-click="onSaveDangerous_"
-                  class="keep">[[i18n_.restore]</paper-button>
-            </template>
+            <paper-button id="danger-remove" on-click="onDiscardDangerous_"
+                class="discard" hidden$="[[!isMalware_]]">[[i18n_.remove]]</paper-button>
+            <paper-button id="restore" on-click="onSaveDangerous_"
+                class="keep" hidden$="[[!isMalware_]]">[[i18n_.restore]</paper-button>
           </div>
         </template>
       </div>
 
       <div id="remove-wrapper" class="icon-wrapper">
         <paper-icon-button id="remove" icon="clear"
             i18n-values="title:controlRemoveFromList"
             style$="[[computeRemoveStyle_(isDangerous_, showCancel_)]]"
             on-click="onRemoveClick_"></paper-icon-button>
       </div>
 
       <div id="incognito" i18n-values="title:inIncognito"
           hidden$="[[!data_.otr]]"></div>
     </paper-material>
 
   </template>
   <link rel="import" type="css" href="chrome://resources/css/action_link.css">
   <link rel="import" type="css" href="chrome://downloads/shared_style.css">
   <link rel="import" type="css" href="chrome://downloads/item.css">
   <script src="chrome://downloads/item.js"></script>
 </dom-module>