Beta 1.7 - Using Several Shortcodes Bug

Not sure if this is the right spot to report Beta bugs.

Hope everyone is having a great holiday. Thank you for offering the beta, the Shortcode option is just what we needed for our current project. However I’m running into a few issues that is breaking the pages.

Here is what we have done to recreate this:

  1. We have created several global rows (full width, full content width) that use 3 or 2 column layout, all with simple text fields. Each filled with basic HTML/content such as a heading and ul list.
  2. These rows are all used individually on a specific set of pages, they work fine there.
  3. Next we have created an index page and loading several of the rows, 26 of them, using the Shortcode method as follows (number is only for reference): 1 [fl_builder_insert_layout slug="summit-rock-results"] 2 [fl_builder_insert_layout slug="quarry-turkey-results"] 3 [fl_builder_insert_layout slug="nitro-turkey-results"] 4 [fl_builder_insert_layout slug="diablo-trail-adventure-results"] 5 [fl_builder_insert_layout slug="lets-go-510-results"] 6 [fl_builder_insert_layout slug="rocky-ridge-results"] 7 [fl_builder_insert_layout slug="tarantula-run-results"] 8 [fl_builder_insert_layout slug="drag-n-fly-results"] 9 [fl_builder_insert_layout slug="trail-hog-results"] 10 [fl_builder_insert_layout slug="bear-creek-results"] 11 [fl_builder_insert_layout slug="summer-breeze-results"] 12 [fl_builder_insert_layout slug="bad-bass-results"] 13 [fl_builder_insert_layout slug="dirty-dozen-results"] 14 [fl_builder_insert_layout slug="trailquake-results"] 15 [fl_builder_insert_layout slug="nitro-trail-results"] 16 [fl_builder_insert_layout slug="wildcat-results"] 17 [fl_builder_insert_layout slug="western-pacific-results"] 18 [fl_builder_insert_layout slug="diablo-trails-challenge-results"] 19 [fl_builder_insert_layout slug="hellyer-results"] 20 [fl_builder_insert_layout slug="badger-cove-results"] 21 [fl_builder_insert_layout slug="bay-breeze-results"] 22 [fl_builder_insert_layout slug="coyote-hills-results"] 23 [fl_builder_insert_layout slug="new-years-day-results"] 24 [fl_builder_insert_layout slug="new-years-eve-results"] 25 [fl_builder_insert_layout slug="brazen-goonies-results"] 26 [fl_builder_insert_layout slug="double-dipsea-results"]

    Nothing else is added to the page, this is in a normal full width template (we are using BB theme).

  4. Issues that are happening:
    1. If loading more than 13 up to 24 rows, the content of each row loads, BUT the page breaks, almost as if its run out of resources to load everything properly.
    2. If loading more than 24 rows, only part of the last row loads and the rest of the page does not load.
    3. Firefox is not even rendering anything from the page.
  5. If I reduce the amount of short codes to 13 or fewer, then the page loads fine and everything works. The threshold seems to be 12 or so, maybe its dependent on the quantity of code or content.

I’ve double checked the html code that was inserted into each of text containers within each row. All tags are closed and formatted correctly.

Here are some test pages. To login to the dev server: [access details redacted]

  1. Dev 1: Loading 24 Rows - http://yumbao.com/dev/
    • Things that are breaking: Rows and content stop going full width, other parts of the page stop loading correctly such as the WP admin bar, sticky header/menu, footer widgets #2 and #3, and Javascript stops working.
    • Loads in Safari and Chrome, does not load at all in FF
  2. Dev 2: Loading all 26 Rows (will need more) - http://yumbao.com/dev2/
    • Things that are breaking: Only the last Shortcode row is loading, only partially. Then footer does not load at all, WP admin bar, sticky header/menu not loading.
    • Loads in Safari and Chrome, does not load at all in FF
  3. Dev 3: Loading only 13 Rows - http://yumbao.com/dev3/
    • Not breaking, everything is displaying corretly once fully loaded. As the page is loading it appears to be having similar issue as #1, but once it loads then the rows adjsut and remaining content loads. Dev 1 and Dev 2 should look like this with all rows loading.
    • Loads fine in Safari and Chrome, does not load at all in FF
  4. Dev 4: Loading only 1 Row - http://yumbao.com/dev4/
    • Not breaking, everything is displaying corretly. Dev 1 and Dev 2 should look like this with all rows loading.
    • Loads fine in Safari and Chrome, and now loading fine in FF
  5. So I’m thinking this might be some type of limitation or resource issue that is causing this to breakdown once a certain amount of content is loaded. Not sure if this is specifically tied to the limits of WP or the BB Plugin or Theme.
    Would really appreciate some help here on how to get this resolved. We really want to use these global rows so that when we do update them they are updated in all locations instead of each location manually.

    Thank you so much for taking the time to dive into this and help. Really appreciate your response.

Hey Sam,

I’ve already assigned another member of the team to assist you with your concern. :slight_smile:

Thanks!

KC

Thank you so much, please keep us posted. We are checking this thread regularly for any updates on a possible solution.

Hey Sam,

This indeed sounds like a resource issue. Do you mind sending both admin access to the site as well as FTP access so we can check? You can just post the details here using the private reply option below.

Ben

[Content Hidden]

[Content Hidden]

Hey Sam,

Does the same problem happen when you switch themes? Have you tried deactivating all plugins except BB and see if you get the same issue? Have you tried adding the same content 24 times on one page using the shortcode and see if you get the same issue? What is the memory limit set on your WP installation? Have you tried increasing it?

Ben

Hey Ben,

Sorry I’ve been out most of the day. I have not tried changing themes or deactivating the other plugins.

This is a new site being developed so there isn’t any legacy code, however there are a handful of plugins being used. No major changes to the child theme yet.

In the interim, I have copy and pasted the actual HTML code for each of those rows (using the Article tag and entire contents) and inserted them into our Race Results page. This works fine, loading 26 of those rows when using HTML code (not shortcode). You can see the rows when you click on each event.

http://yumbao.com/races/results/

I’ll try deactivating plugins and maybe changing the theme.

Hey Sam,

That should work fine since you’re simply loading static content. What happens when you use the BB shortcode is that it loads each CSS/JS file for each of the page you’re trying to pull content from, i.e., 26 CSS and 26 JS files to be loaded. That may be where the problem happens. Do let us know once you’ve tried the suggestions above and we’ll take it from there.

Ben

So last night and this morning I did some testing with the plugins and after deactivating several plugins I was able to get the pages to load just fine which shows the BB shortcodes working. Now I’m not sure if it is a specific plugin or just the overall load as the issues come back when activating any combination of plugins. I’ve tested it by toggling the following.

Redirection
Yoast SEO
WP Rocket
Analytify PRO
Microthemer
Sililoquy
wpDataTables
Ubermenu
Updraft Plus
NinjaFirewall
Gravity Forms

I loaded Query Monitor (https://wordpress.org/plugins/query-monitor/) to help debug more and see what is happening on the DB end. Interestingly after loading it Dev pages 1, 2, 3 won’t even load past the title and fl-post-content div. Even after deactivating all the plugins except Beaver Builder and Query Monitor. So something is a bit fishy there that should be looked at. I’ve used Query Monitor before to debug and optimize, so I find this surprising.

I’ve also set the Memory limit to 128M in the config file as this is a multisite install that is going to have several sites on it.

The main purpose of this was to achieve having each of these rows in the Results page (click on an event to see the row appear). As well as on the individual event result pages which are normal pages built with BB. This works fine with the HTML code inserted into the events as they are now, but when using the shortcode, is when it breaks once a certain amount are loaded.
http://yumbao.com/races/results/

For now I think we’ll have to determine an alternate solution to get the desired results. Either load the HTML code manually which means they won’t get updated automatically when changed, or break up the event results page into a multiple pages.

This is a bummer. If anything does come up then I’ll post here, otherwise I’m going to assume this can’t be resolved with the current setup.

Hey Sam,

I’ve already advised our lead dev of this. We’re currently swamped right now but rest assured this is already on the list. Do you think you can keep the login and the page where the issue is happening active? Also, we’d really appreciate it if you let us know of anything that comes up on your end. :slight_smile:

Ben

Thanks. Yeah we’ll keep the Dev site going and leave those Dev test pages up for the next few weeks before we launch. Thanks again for digging deeper into this and thanks for the awesome tools. Really love Beaver Builder!

No worries! And thanks for the kind words! :slight_smile:

Ben

Hi Sam,

Thanks for the detailed info on this issue. I did some research and testing this weekend and it looks like using the shortcode in this case might not be the optimal solution. Is there any reason that global rows wouldn’t work for you here?

The issue with the shortcode is that using it this many times causes a lot of queries to the database since the data for each layout needs to be pulled. Also, for the layouts to be rendered appropriately, the CSS/JS for each layout needs to be loaded (that’s 52 additional requests on a page with 26 shortcodes).

When you use global rows, those rows are actually part of the main layout, so you don’t need separate queries for the data and separate assets to render them.

Let me know if you have any questions about that. I’d be happy to continue the discussion to find the optimal solution that works for you.

Justin