Issue with layout shift while loading

  • Resolved blue

    (@life2)


    11 months, 3 weeks ago

    Hi,

    The content inside the form shifts significantly just before being fully loaded (after the loading icon disappears).

    I tried to make the form height fixed to minimize this issue but it’s not resolved completely. PageSpeed Insights speed test still gives a bad performance score due to layout shifting.

    Can you advice on how to resolve this problem?

    Thanks.

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author codepeople

    (@codepeople)

    Hello @life2,

    Thank you very much for using our plugin.

    With the commercial plugin distributions, you can enable the form cache option in the plugin settings. It stores a rendered copy of the form on the server. If you are using the free version, the alternative would be to assign a fixed height to the form or the tag containing it.

    Best regards.

    Thread Starter blue

    (@life2)

    Hi,

    Thank you for your response.

    I did assign a fixed height to the form, but the layout shift still happens to the text inside the form (right after the loading icon disappears).

    May I know how to prevent this shifting?

    Thanks.

    Plugin Author codepeople

    (@codepeople)

    Hello @life2

    The free plugin distribution renders the form on the client side, the browser. So, the shift will occur inside the form, but if you assign a height to the form or its container, it will not affect other page areas. Another alternative would be to assign the height to the element where you inserted the shortcode and include the iframe attribute in the form shortcode. Ex.

    [CP_CALCULATED_FIELDS id="1" iframe="1"]

    Best regards.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Issue with layout shift while loading’ is closed to new replies.