Body: <p>Related to this previous post. But I have created a new post with more information.
  <a href="https://craftcms.stackexchange.com/questions/17639/understanding-eager-loading/17646?noredirect=1#comment24277_17646">Understanding Eager Loading</a></p>
  
  <p>So My template code with Eager Loading looks like this.</p>
  
  <pre><code>{% set articles = craft.entries({
          section: 'blog',
          with: [
              ['bannerImage', { withTransforms: ['cardImage'] } ]
          ]
  }) %}
  
  
  {% block main %}
  &lt;div class="container"&gt;
      &lt;div class="blogPrimary"&gt;
          &lt;h1 class="section__heading // flush-bottom"&gt;&lt;strong&gt;Riaflex&lt;/strong&gt; Blog&lt;/h1&gt;
          &lt;p class="section__msg // margin-bottom"&gt;Latest and featured articles from Riaflex&amp;trade;&lt;/p&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;section class="row"&gt;
  {% for article in articles.featured('1').limit(1)  %}
  {% set array = article.title|split(' ', 2) %}
      &lt;div class="c-card // l-blogCard--featured"&gt;
          &lt;a href="{{ article.url }}"&gt;
              &lt;div class="featuredPost"&gt;
                  &lt;span&gt;Featured&lt;/span&gt;
              &lt;/div&gt;
  
              {# &lt;img src="{{ article.bannerImage.first().getUrl('cardImage') }}" alt="{{ article.title }}" class="c-card__img"&gt; #}
  
              {% set image = article.bannerImage[0] ?? null %}
              {% if image %}
                  &lt;img src="{{ image.getUrl('cardImage') }}" alt="{{ image.title }}"&gt;
              {% endif %}
  
  
              &lt;div class="c-card__bar // js_fitcontent"&gt;
                  &lt;p class="c-card__title"&gt;&lt;strong&gt;{{ attribute(array, 0) }}&lt;/strong&gt; {{ attribute(array, 1) }}&lt;/p&gt;
                  &lt;p class="flush-bottom"&gt;
                      &lt;svg role="img" class="icon // icon-date" title="Date Icon"&gt;
                          &lt;use xlink:href="/assets/img/icons.svg#icon-date"&gt;&lt;/use&gt;
                      &lt;/svg&gt;{{ helpers.date_formatted(article.postDate) }}
                  &lt;/p&gt;
              &lt;/div&gt;
  
              &lt;div class="c-card__over"&gt;
                  &lt;div class="c-card__over-content"&gt;
                      &lt;div class="animate"&gt;
                          &lt;p class="c-card__title"&gt;&lt;strong&gt;{{ attribute(array, 0) }}&lt;/strong&gt; {{ attribute(array, 1) }}&lt;/p&gt;
                          &lt;p class="half-margin-bottom"&gt;
                              {{ article.subHeading }}&amp;hellip;&lt;br /&gt;
                          &lt;/p&gt;
                          &lt;p class="btn // btn--sub"&gt;Read Article&lt;/p&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/a&gt;
      &lt;/div&gt;
  {% endfor %}
  
  {% for article in articles.featured('not 1')  %}
  {% set array = article.title|split(' ', 2) %}
      &lt;div class="c-card // {{ loop.first ? 'l-blogCard--featured' : 'l-blogCard' }}"&gt;
          &lt;a href="{{ article.url }}"&gt;
              {% if  loop.first %}
              &lt;div class="featuredPost // featuredPost--latest"&gt;
                  &lt;span&gt;Latest&lt;/span&gt;
              &lt;/div&gt;
              {% endif %}
  
              {% set image = article.bannerImage[0] ?? null %}
              {% if image %}
                  &lt;img src="{{ image.getUrl('cardImage') }}" alt="{{ image.title }}"&gt;
              {% endif %}
  
              &lt;div class="c-card__bar // js_fitcontent"&gt;
                  &lt;p class="c-card__title"&gt;&lt;strong&gt;{{ attribute(array, 0) }}&lt;/strong&gt; {{ attribute(array, 1) }}&lt;/p&gt;
                  &lt;p class="flush-bottom"&gt;
                      &lt;svg role="img" class="icon // icon-date" title="Date Icon"&gt;
                          &lt;use xlink:href="/assets/img/icons.svg#icon-date"&gt;&lt;/use&gt;
                      &lt;/svg&gt;{{ helpers.date_formatted(article.postDate) }}
                  &lt;/p&gt;
              &lt;/div&gt;
  
              &lt;div class="c-card__over"&gt;
                  &lt;div class="c-card__over-content"&gt;
                      &lt;div class="animate"&gt;
                          &lt;p class="c-card__title"&gt;&lt;strong&gt;{{ attribute(array, 0) }}&lt;/strong&gt; {{ attribute(array, 1) }}&lt;/p&gt;
                          &lt;p class="half-margin-bottom"&gt;
                              {{ article.subHeading }}&amp;hellip;&lt;br /&gt;
                          &lt;/p&gt;
                          &lt;p class="btn // btn--sub"&gt;Read Article&lt;/p&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/a&gt;
      &lt;/div&gt;
  {% endfor %}
  
  
  {# DUMMY TO RPEAT THE CONTENT #}
  {% for article in articles  %}
  {% set array = article.title|split(' ', 2) %}
      &lt;div class="c-card // l-blogCard"&gt;
          &lt;a href="{{ article.url }}"&gt;
  
              {% set image = article.bannerImage[0] ?? null %}
              {% if image %}
                  &lt;img src="{{ image.getUrl('cardImage') }}" alt="{{ image.title }}"&gt;
              {% endif %}
  
              &lt;div class="c-card__bar // js_fitcontent"&gt;
                  &lt;p class="c-card__title"&gt;&lt;strong&gt;{{ attribute(array, 0) }}&lt;/strong&gt; {{ attribute(array, 1) }}&lt;/p&gt;
                  &lt;p class="flush-bottom"&gt;
                      &lt;svg role="img" class="icon // icon-date" title="Date Icon"&gt;
                          &lt;use xlink:href="/assets/img/icons.svg#icon-date"&gt;&lt;/use&gt;
                      &lt;/svg&gt;{{ helpers.date_formatted(article.postDate) }}
                  &lt;/p&gt;
              &lt;/div&gt;
  
              &lt;div class="c-card__over"&gt;
                  &lt;div class="c-card__over-content"&gt;
                      &lt;div class="animate"&gt;
                          &lt;p class="c-card__title"&gt;&lt;strong&gt;{{ attribute(array, 0) }}&lt;/strong&gt; {{ attribute(array, 1) }}&lt;/p&gt;
                          &lt;p class="half-margin-bottom"&gt;
                              {{ article.subHeading }}&amp;hellip;&lt;br /&gt;
                          &lt;/p&gt;
                          &lt;p class="btn // btn--sub"&gt;Read Article&lt;/p&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/a&gt;
      &lt;/div&gt;
  {% endfor %}
  </code></pre>
  
  <p>This results in <strong>38 queries</strong> according to the log in the console.</p>
  
  <p>If I use the original code without Eager Loading:</p>
  
  <pre><code>{% set articles = craft.entries.section('blog').order('postDate desc') %}
  
  {% for article in articles.featured('1').limit(1)  %}
  {% set array = article.title|split(' ', 2) %}
      &lt;div class="c-card // l-blogCard--featured"&gt;
          &lt;a href="{{ article.url }}"&gt;
              &lt;div class="featuredPost"&gt;
                  &lt;span&gt;Featured&lt;/span&gt;
              &lt;/div&gt;
  
              &lt;img src="{{ article.bannerImage.first().getUrl('cardImage') }}" alt="{{ article.title }}" class="c-card__img"&gt;
              &lt;div class="c-card__bar // js_fitcontent"&gt;
                  &lt;p class="c-card__title"&gt;&lt;strong&gt;{{ attribute(array, 0) }}&lt;/strong&gt; {{ attribute(array, 1) }}&lt;/p&gt;
                  &lt;p class="flush-bottom"&gt;
                      &lt;svg role="img" class="icon // icon-date" title="Date Icon"&gt;
                          &lt;use xlink:href="/assets/img/icons.svg#icon-date"&gt;&lt;/use&gt;
                      &lt;/svg&gt;{{ helpers.date_formatted(article.postDate) }}
                  &lt;/p&gt;
              &lt;/div&gt;
  
              &lt;div class="c-card__over"&gt;
                  &lt;div class="c-card__over-content"&gt;
                      &lt;div class="animate"&gt;
                          &lt;p class="c-card__title"&gt;&lt;strong&gt;{{ attribute(array, 0) }}&lt;/strong&gt; {{ attribute(array, 1) }}&lt;/p&gt;
                          &lt;p class="half-margin-bottom"&gt;
                              {{ article.subHeading }}&amp;hellip;&lt;br /&gt;
                          &lt;/p&gt;
                          &lt;p class="btn // btn--sub"&gt;Read Article&lt;/p&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/a&gt;
      &lt;/div&gt;
  {% endfor %}
  
  {% for article in articles.featured('not 1')  %}
  {% set array = article.title|split(' ', 2) %}
      &lt;div class="c-card // {{ loop.first ? 'l-blogCard--featured' : 'l-blogCard' }}"&gt;
          &lt;a href="{{ article.url }}"&gt;
              {% if  loop.first %}
              &lt;div class="featuredPost // featuredPost--latest"&gt;
                  &lt;span&gt;Latest&lt;/span&gt;
              &lt;/div&gt;
              {% endif %}
  
  
              &lt;img src="{{ article.bannerImage.first().getUrl('cardImage') }}" alt="{{ article.title }}" class="c-card__img"&gt;
              &lt;div class="c-card__bar // js_fitcontent"&gt;
                  &lt;p class="c-card__title"&gt;&lt;strong&gt;{{ attribute(array, 0) }}&lt;/strong&gt; {{ attribute(array, 1) }}&lt;/p&gt;
                  &lt;p class="flush-bottom"&gt;
                      &lt;svg role="img" class="icon // icon-date" title="Date Icon"&gt;
                          &lt;use xlink:href="/assets/img/icons.svg#icon-date"&gt;&lt;/use&gt;
                      &lt;/svg&gt;{{ helpers.date_formatted(article.postDate) }}
                  &lt;/p&gt;
              &lt;/div&gt;
  
              &lt;div class="c-card__over"&gt;
                  &lt;div class="c-card__over-content"&gt;
                      &lt;div class="animate"&gt;
                          &lt;p class="c-card__title"&gt;&lt;strong&gt;{{ attribute(array, 0) }}&lt;/strong&gt; {{ attribute(array, 1) }}&lt;/p&gt;
                          &lt;p class="half-margin-bottom"&gt;
                              {{ article.subHeading }}&amp;hellip;&lt;br /&gt;
                          &lt;/p&gt;
                          &lt;p class="btn // btn--sub"&gt;Read Article&lt;/p&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/a&gt;
      &lt;/div&gt;
  {% endfor %}
  
  {# DUMMY TO RPEAT THE CONTENT #}
  {% for article in articles  %}
  {% set array = article.title|split(' ', 2) %}
      &lt;div class="c-card // l-blogCard"&gt;
          &lt;a href="{{ article.url }}"&gt;
  
              &lt;img src="{{ article.bannerImage.first().getUrl('cardImage') }}" alt="{{ article.title }}" class="c-card__img"&gt;
              &lt;div class="c-card__bar // js_fitcontent"&gt;
                  &lt;p class="c-card__title"&gt;&lt;strong&gt;{{ attribute(array, 0) }}&lt;/strong&gt; {{ attribute(array, 1) }}&lt;/p&gt;
                  &lt;p class="flush-bottom"&gt;
                      &lt;svg role="img" class="icon // icon-date" title="Date Icon"&gt;
                          &lt;use xlink:href="/assets/img/icons.svg#icon-date"&gt;&lt;/use&gt;
                      &lt;/svg&gt;{{ helpers.date_formatted(article.postDate) }}
                  &lt;/p&gt;
              &lt;/div&gt;
  
              &lt;div class="c-card__over"&gt;
                  &lt;div class="c-card__over-content"&gt;
                      &lt;div class="animate"&gt;
                          &lt;p class="c-card__title"&gt;&lt;strong&gt;{{ attribute(array, 0) }}&lt;/strong&gt; {{ attribute(array, 1) }}&lt;/p&gt;
                          &lt;p class="half-margin-bottom"&gt;
                              {{ article.subHeading }}&amp;hellip;&lt;br /&gt;
                          &lt;/p&gt;
                          &lt;p class="btn // btn--sub"&gt;Read Article&lt;/p&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/a&gt;
      &lt;/div&gt;
  {% endfor %}
  </code></pre>
  
  <p>This results in <strong>39 queries</strong> according to the log in the console.</p>
  
  <p>Any ideas why this isn't being reduced more and what might be off in my syntax? I have tried to follow the docs as best I can so really not sure where else to turn.</p>
  
Comments.ContentLicense: CC BY-SA 3.0
Comments.CreationDate: 2016-11-11T00:11:06.383Z
Comments.Text: I'd suggest paring the template examples down to only what's relevant to the question... it's difficult to parse the wall of text of completely unrelated HTML attributes and code.  But my guess is that you don't have many `bannerImage` selected. Eager loading is going to show its benefits the more things there are to eager load. There is some initial overhead associated with it you have to overcome.
Comments.UserDisplayName: Brad Bell
Comments.ContentLicense: CC BY-SA 3.0
Comments.CreationDate: 2016-11-11T23:20:02.707Z
Comments.Text: Terry: if your goal is performance, and you are able to do so, you might want to try using the [``{%cache%}``](https://craftcms.com/docs/templating/cache) as well. The fastest SQL in the world is no match for a result already figured out.
Comments.UserDisplayName: RitterKnight
Tags: <performance><eager-loading>
Title: Eager Loading not reducing the queries
ThreadText: # Eager Loading not reducing the queries
  
  (Asked by: username_0 on 2016-11-10)
  
  Related to this previous post. But I have created a new post with more information.
  [Understanding Eager Loading](https://craftcms.stackexchange.com/questions/17639/understanding-eager-loading/17646?noredirect=1#comment24277_17646)
  
  So My template code with Eager Loading looks like this.
  
  ```
  {% set articles = craft.entries({
          section: 'blog',
          with: [
              ['bannerImage', { withTransforms: ['cardImage'] } ]
          ]
  }) %}
  
  {% block main %}
  <div class="container">
      <div class="blogPrimary">
          <h1 class="section__heading // flush-bottom"><strong>Riaflex</strong> Blog</h1>
          <p class="section__msg // margin-bottom">Latest and featured articles from Riaflex&trade;</p>
      </div>
  </div>
  
  <section class="row">
  {% for article in articles.featured('1').limit(1)  %}
  {% set array = article.title|split(' ', 2) %}
      <div class="c-card // l-blogCard--featured">
          <a href="{{ article.url }}">
              <div class="featuredPost">
                  <span>Featured</span>
              </div>
  
              {# <img src="{{ article.bannerImage.first().getUrl('cardImage') }}" alt="{{ article.title }}" class="c-card__img"> #}
  
              {% set image = article.bannerImage[0] ?? null %}
              {% if image %}
                  <img src="{{ image.getUrl('cardImage') }}" alt="{{ image.title }}">
              {% endif %}
  
              <div class="c-card__bar // js_fitcontent">
                  <p class="c-card__title"><strong>{{ attribute(array, 0) }}</strong> {{ attribute(array, 1) }}</p>
                  <p class="flush-bottom">
                      <svg role="img" class="icon // icon-date" title="Date Icon">
                          <use xlink:href="/assets/img/icons.svg#icon-date"></use>
                      </svg>{{ helpers.date_formatted(article.postDate) }}
                  </p>
              </div>
  
              <div class="c-card__over">
                  <div class="c-card__over-content">
                      <div class="animate">
                          <p class="c-card__title"><strong>{{ attribute(array, 0) }}</strong> {{ attribute(array, 1) }}</p>
                          <p class="half-margin-bottom">
                              {{ article.subHeading }}&hellip;<br />
                          </p>
                          <p class="btn // btn--sub">Read Article</p>
                      </div>
                  </div>
              </div>
          </a>
      </div>
  {% endfor %}
  
  {% for article in articles.featured('not 1')  %}
  {% set array = article.title|split(' ', 2) %}
      <div class="c-card // {{ loop.first ? 'l-blogCard--featured' : 'l-blogCard' }}">
          <a href="{{ article.url }}">
              {% if  loop.first %}
              <div class="featuredPost // featuredPost--latest">
                  <span>Latest</span>
              </div>
              {% endif %}
  
              {% set image = article.bannerImage[0] ?? null %}
              {% if image %}
                  <img src="{{ image.getUrl('cardImage') }}" alt="{{ image.title }}">
              {% endif %}
  
              <div class="c-card__bar // js_fitcontent">
                  <p class="c-card__title"><strong>{{ attribute(array, 0) }}</strong> {{ attribute(array, 1) }}</p>
                  <p class="flush-bottom">
                      <svg role="img" class="icon // icon-date" title="Date Icon">
                          <use xlink:href="/assets/img/icons.svg#icon-date"></use>
                      </svg>{{ helpers.date_formatted(article.postDate) }}
                  </p>
              </div>
  
              <div class="c-card__over">
                  <div class="c-card__over-content">
                      <div class="animate">
                          <p class="c-card__title"><strong>{{ attribute(array, 0) }}</strong> {{ attribute(array, 1) }}</p>
                          <p class="half-margin-bottom">
                              {{ article.subHeading }}&hellip;<br />
                          </p>
                          <p class="btn // btn--sub">Read Article</p>
                      </div>
                  </div>
              </div>
          </a>
      </div>
  {% endfor %}
  
  {# DUMMY TO RPEAT THE CONTENT #}
  {% for article in articles  %}
  {% set array = article.title|split(' ', 2) %}
      <div class="c-card // l-blogCard">
          <a href="{{ article.url }}">
  
              {% set image = article.bannerImage[0] ?? null %}
              {% if image %}
                  <img src="{{ image.getUrl('cardImage') }}" alt="{{ image.title }}">
              {% endif %}
  
              <div class="c-card__bar // js_fitcontent">
                  <p class="c-card__title"><strong>{{ attribute(array, 0) }}</strong> {{ attribute(array, 1) }}</p>
                  <p class="flush-bottom">
                      <svg role="img" class="icon // icon-date" title="Date Icon">
                          <use xlink:href="/assets/img/icons.svg#icon-date"></use>
                      </svg>{{ helpers.date_formatted(article.postDate) }}
                  </p>
              </div>
  
              <div class="c-card__over">
                  <div class="c-card__over-content">
                      <div class="animate">
                          <p class="c-card__title"><strong>{{ attribute(array, 0) }}</strong> {{ attribute(array, 1) }}</p>
                          <p class="half-margin-bottom">
                              {{ article.subHeading }}&hellip;<br />
                          </p>
                          <p class="btn // btn--sub">Read Article</p>
                      </div>
                  </div>
              </div>
          </a>
      </div>
  {% endfor %}
  
  ```
  
  This results in **38 queries** according to the log in the console.
  
  If I use the original code without Eager Loading:
  
  ```
  {% set articles = craft.entries.section('blog').order('postDate desc') %}
  
  {% for article in articles.featured('1').limit(1)  %}
  {% set array = article.title|split(' ', 2) %}
      <div class="c-card // l-blogCard--featured">
          <a href="{{ article.url }}">
              <div class="featuredPost">
                  <span>Featured</span>
              </div>
  
              <img src="{{ article.bannerImage.first().getUrl('cardImage') }}" alt="{{ article.title }}" class="c-card__img">
              <div class="c-card__bar // js_fitcontent">
                  <p class="c-card__title"><strong>{{ attribute(array, 0) }}</strong> {{ attribute(array, 1) }}</p>
                  <p class="flush-bottom">
                      <svg role="img" class="icon // icon-date" title="Date Icon">
                          <use xlink:href="/assets/img/icons.svg#icon-date"></use>
                      </svg>{{ helpers.date_formatted(article.postDate) }}
                  </p>
              </div>
  
              <div class="c-card__over">
                  <div class="c-card__over-content">
                      <div class="animate">
                          <p class="c-card__title"><strong>{{ attribute(array, 0) }}</strong> {{ attribute(array, 1) }}</p>
                          <p class="half-margin-bottom">
                              {{ article.subHeading }}&hellip;<br />
                          </p>
                          <p class="btn // btn--sub">Read Article</p>
                      </div>
                  </div>
              </div>
          </a>
      </div>
  {% endfor %}
  
  {% for article in articles.featured('not 1')  %}
  {% set array = article.title|split(' ', 2) %}
      <div class="c-card // {{ loop.first ? 'l-blogCard--featured' : 'l-blogCard' }}">
          <a href="{{ article.url }}">
              {% if  loop.first %}
              <div class="featuredPost // featuredPost--latest">
                  <span>Latest</span>
              </div>
              {% endif %}
  
              <img src="{{ article.bannerImage.first().getUrl('cardImage') }}" alt="{{ article.title }}" class="c-card__img">
              <div class="c-card__bar // js_fitcontent">
                  <p class="c-card__title"><strong>{{ attribute(array, 0) }}</strong> {{ attribute(array, 1) }}</p>
                  <p class="flush-bottom">
                      <svg role="img" class="icon // icon-date" title="Date Icon">
                          <use xlink:href="/assets/img/icons.svg#icon-date"></use>
                      </svg>{{ helpers.date_formatted(article.postDate) }}
                  </p>
              </div>
  
              <div class="c-card__over">
                  <div class="c-card__over-content">
                      <div class="animate">
                          <p class="c-card__title"><strong>{{ attribute(array, 0) }}</strong> {{ attribute(array, 1) }}</p>
                          <p class="half-margin-bottom">
                              {{ article.subHeading }}&hellip;<br />
                          </p>
                          <p class="btn // btn--sub">Read Article</p>
                      </div>
                  </div>
              </div>
          </a>
      </div>
  {% endfor %}
  
  {# DUMMY TO RPEAT THE CONTENT #}
  {% for article in articles  %}
  {% set array = article.title|split(' ', 2) %}
      <div class="c-card // l-blogCard">
          <a href="{{ article.url }}">
  
              <img src="{{ article.bannerImage.first().getUrl('cardImage') }}" alt="{{ article.title }}" class="c-card__img">
              <div class="c-card__bar // js_fitcontent">
                  <p class="c-card__title"><strong>{{ attribute(array, 0) }}</strong> {{ attribute(array, 1) }}</p>
                  <p class="flush-bottom">
                      <svg role="img" class="icon // icon-date" title="Date Icon">
                          <use xlink:href="/assets/img/icons.svg#icon-date"></use>
                      </svg>{{ helpers.date_formatted(article.postDate) }}
                  </p>
              </div>
  
              <div class="c-card__over">
                  <div class="c-card__over-content">
                      <div class="animate">
                          <p class="c-card__title"><strong>{{ attribute(array, 0) }}</strong> {{ attribute(array, 1) }}</p>
                          <p class="half-margin-bottom">
                              {{ article.subHeading }}&hellip;<br />
                          </p>
                          <p class="btn // btn--sub">Read Article</p>
                      </div>
                  </div>
              </div>
          </a>
      </div>
  {% endfor %}
  
  ```
  
  This results in **39 queries** according to the log in the console.
  
  Any ideas why this isn't being reduced more and what might be off in my syntax? I have tried to follow the docs as best I can so really not sure where else to turn.
  
  **Tags:** performance, eager-loading
  
  > **Comments:**
  > **username_1**: I'd suggest paring the template examples down to only what's relevant to the question... it's difficult to parse the wall of text of completely unrelated HTML attributes and code.  But my guess is that you don't have many `bannerImage` selected. Eager loading is going to show its benefits the more things there are to eager load. There is some initial overhead associated with it you have to overcome.  
  > **username_2**: username_0: if your goal is performance, and you are able to do so, you might want to try using the [``{%cache%}``](https://craftcms.com/docs/templating/cache) as well. The fastest SQL in the world is no match for a result already figured out.  
  
  ---
  
  ## 0 answers
  
  