Skip to content

Performance on massive form #635

Open
@akunno

Description

@akunno

I have a form with ~20 tabs and ~15 questions per tab. Some questions are in repeaters/arrays.

The performance on rendering the page seems to be very slow, unfortunately. It currently takes ~3 seconds on a 3ghz machine, but more than 20 seconds on a machine with a 1.5ghz to 2ghz processor. I've tried disabling all of the various plugins for schema form, but it doesn't change much (if anything).

Profiling in chrome has come back with a lot of calls to scope events which are causing the slow down, but I can't pin it on anything in particular unfortunately.

On my fast machine (3 seconds to render the page):
regularInterceptedExpression is called 438 times @ 0.005 ms totalling 2 seconds.
{{form.key.slice(-1)[0] }} is 333 times totalling 1.8 seconds
showTitle() is 160 times @ 1.3 seconds

and so on..... nothing I can obviously just 'change' in how I've constructed the form to fix quickly (AFAIK).

I've attempted numerous times to snapshot the rendered form and just output the relevant HTML to avoid re-processing (i.e., render it into HTML with ng-* expressions) but the form either doesn't show on page, or if I hijack the render(schema, form) method then I just get

<form class="schema-form-ignore"><bootstrap-decorator form="schemaForm.form[0]" class="ng-scope"></bootstrap-decorator><bootstrap-decorator form="schemaForm.form[1]" class="ng-scope"></bootstrap-decorator><bootstrap-decorator form="schemaForm.form[2]" class="ng-scope"></bootstrap-decorator><bootstrap-decorator form="schemaForm.form[3]" class="ng-scope"></bootstrap-decorator><bootstrap-decorator form="schemaForm.form[4]" class="ng-scope"></bootstrap-decorator></form>
Do you have any suggestions or hints on how to boost performance based on my hopefully brilliant description of the problem (;p) OR know of any tricks to force the bootstrap-decorators to also get processed in order to capture the form output as a pre-rendered form which I then just link to the model?

I'm not brilliant with angular, having only dealt with it for a few months, so I may be missing something obvious.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions