Fixing 10 second slow-down caused by dynamic page listing

Loops & Logic
1

Hey y’all,

I recently noticed a substantial slow-down on my blog page. I’m fairly new to Wordpress, so do take my findings with a grain of salt, but it does look like using the Loops & Logic plug-in on my front-page - when logged-in to wordpress - causes a massive slow-down. We’re talking over 10 seconds (or 10.24s to be exact) for the page to load. Consistently.

Having recently written my second blog post, I thought the issue correlated with it, but after a bit of investigating, turning the loops and logic plug-in off, reduces the load time to about 215 ms. I’ve turned it on and off 3 times and always matched the slow-down/speed-up with the event.

Surprisingly, this only seems to happen when I’m logged in and I see the WP bar up top. If I just visit the website as a guest, things go fast.

Anything I can do to help confirm or further narrow down, what precisely is causing this?

My template code I use on the page, looks as follows:

<div class="tt-loop">
  <!-- By default, child/nested pages aren't looped.
  Id 142 is the Projects page, which has all projects as child pages.
  -->
  <Loop type=Page parent=142 include_children=true orderby=date order=desc>
    <div class="tt-item {Field post_class}">
      <a href="{Field url}" class="tt-item-wrapper tt-item-link tt-card">
        <div class="tt-item-image-panel">
          <!-- Below we have some conditional logic that checks whether field=image exists (which is the name of the post's featured image field). If the field contains anything, the featured image gets displayed, if not, a placeholder gets displayed. The placeholder is an asset and can be found in the Assets tab above. -->
          <If field=image>
            <img src="{Field image_url size=medium}" class="{Field image_post_class}" alt="{Field image_alt}" srcset="{Field image_srcset}" sizes="{Field image_sizes}">
            <Else />
            <img src="{Get asset=hero_wip field=url}" />
          </If>
        </div>
        <div class="tt-item-content">
          <!-- Below is a taxonomy term loop nested within our post loop. WordPress only saves taxonomy term IDs within a post's fields so if we want to display other data from the taxonomy term (like its title or some custom fields), we need to create a taxonomy term loop to grab that data. -->
          <Loop type=taxonomy_term post=current taxonomy=category count=1>
            <div class="badge"><Field title /></div>
          </Loop>
          <h2 class="tt-item-title"><Field title /></h2>
          <!-- Currently, the div below just displays some plain text on each post. If your posts have a short custom text field on them, try swapping out this text with a tag like <Field my_custom_post_field_name /> to display that custom field. -->
          <!-- <div class="tt-item-meta">Some custom field</div> -->
          <div class="tt-item-description"><Field excerpt auto=true words=25 />...</div>
        </div>
        <div class="tt-item-footer">
          <button tabindex="-1">Read more</button>
        </div>
      </a>
    </div>
  </Loop>
</div>

Thanks in advance,
Gazoo

2

Thank you for reporting the site performance issue. That does sound strange, and I appreciate that you confirmed it by de/activating the plugin.

This only seems to happen when I’m logged in… If I just visit the website as a guest, things go fast.

Good to know, that’s some kind of clue. From what I can see, the template code is not doing anything unusual or even related to user login status.

Could you install the Query Monitor plugin and see if it provides any insight - for example, slow database queries?

Another angle: you could look in the browser’s developer console, under the Network tab, and see if any network request such as images could be causing the slow down.

Also - just in case it’s caused by the L&L template, you could try removing parts of it to narrow down which specific line may be responsible.

1 Like
3

Are you using a caching plugin? Usually, they will disable optimisations for admins so that may be part of what is occurring here.

2 Likes
4

One thing you can try is using the timer tag to see if a specific bit of your L&L code is causing the issue:
https://docs.loopsandlogic.com/83/timer?category_id=63

1 Like
5

Appreciate everyone’s response on the topic.

For reasons I cannot explain, the massive performance difference has vanished. I’m now instead seeing more “reasonable” times of ~800-1000ms of loading times with L&L activated, and about 300ms with it turned off.

@eliot I tried the developer console and unfortunately the 12 second delay always kicked in at the very beginning, i.e. the tab would literally just sit for about 12 seconds, and then everything loaded in, giving little insight into what precisely was slowing everything down.

Having installed Query Monitor, I see that L&L uses 109 database queries for the loop template I’ve built. Although I imagine the backend can help cache that a lot, 109 queries still seems excessive to me. Any ideas of how I might reduce this?

@Rips - Good point - Breeze is installed, but 12 seconds is a colossal amount of time, where even without any caching, it shouldn’t be taking that long I’d say.

Tangibleinc (I’d mention you but apparently as a new user I can only mention 2 other users) - Appreciate the heads up for the timer call. I’ll keep that in mind moving forward. As noted in the beginning of this post, the excessive 12 second delay has vanished, and the individual loop portions look decent, now I’m currently hoping that I can reduce the ~500 additional ms that it appears to add.

Cheers,
Gazoo