1

UPADTE: I've been awarded a Tumbleweed badge for this question (Asked a question with no votes, no answers, no comments, and low views for a week). My gut feeling is this is about optimizing Drupal to speed up page loads, but maybe it's something else?

I have a form divided into five fieldsets. The sets are displayed on my page using vertical tabs, like this:

// Form element: vertical tabs.
$form['vertical_tabs'] = array(
    '#type' => 'vertical_tabs',
);

// Form elements: fieldset tree.
$form['Fruits'] = array(
    '#title' => t('Type'),
    '#type' => 'fieldset',
    '#tree' => TRUE,
    '#collapsible' => TRUE,
    '#group' => 'vertical_tabs',
);

...etc.

When the page loads, initially just the plain form appears. It takes about 2-3 seconds for the vertical tabs 'styles' to be applied to the form. In other words, it takes a significant time to load the finished page. Has anyone else had this problem and figured out how to stop/arrest this behaviour?

I am using Zen theme, if that makes any difference. Thanks.

  • 2
    Vertical Tabs are applied via javascript. Use Chrome, Firefox + Firebug, or other tool like that and try to tell us what's wrong on "network" and "console" tabs. If you don't see anything wrong, provide screenshots. And don't get discouraged by tumbleweed, it just means your case is tricky. – Mołot Jul 4 '13 at 9:35
  • 1
    I have form with more than 100 fields divided via fieldsets - work without any problem and no speed issues. Can you show your form page somewhere? Only debugging script can help to view what happen, possibly conflicts of js-es... – Nikit Jul 7 '13 at 6:47
2
+25

I'm almost 100% certain this problem is related to slow-loading javascript; As Mołot mentioned in his comment on the question, you should investigate whether something is holding up the JS from loading and/or processing when the page loads, using browser tools.

There might be some other JS that's being added on the page that's blocking the vertical tabs JS from loading/running. Do you have any 3rd-party (Facebook, Google, Twitter, analytics, etc.) libraries loaded on the page? There are some good tips for getting these things to not block the rest of the page load here: Non-Blocking Loading Of 3rd Party Scripts In Drupal.

Otherwise, do you have a module enabled or some custom code that's hindering/slowing the progress of the page load on that form? This is less likely, but sometimes if a module does something that requires a lot of CPU time (like looping through an entire taxonomy tree to build a form element or do something fancy to it) either with PHP or JS, that can cause the page load to take a really long time.

Vertical tab rendering (as well as fieldset collapsibility rendering) is usually one of the last things to load when a page loads. Something is blocking the page load/render progress, and if you can figure out what that is, you'll find the source of the problem. Good luck!

  • Thanks. What you say in paragraph three resonates because it is a very large form. I'd say there are over 300 input boxes. – 24ma13wg Jul 13 '13 at 23:36
  • In that case, there could be some JS that's looping through all those input boxes and tying up the browser. Try using Chrome's profiling tools to see if you can spot the offending script, and good luck! – geerlingguy Jul 14 '13 at 2:56

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.