Meta Box

Flash of Unstyled Content

Support › MB Conditional Logic › Flash of Unstyled Content

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • January 22, 2018 at 11:07 PM #8294
    meta_geckometa_gecko
    Participant

    When using any of the metabox plugins that make use of javascript for the styling in some way, there is always a flash of unstyled content on initial loading of the post edit screens in the backend.

    If I use conditional logic to hide a field unless a condition is met, then when the post edit screen is first loaded, all fields are visible for about 25 to 50ms before the MB scripts load and apply the classes that are used for hiding the fields.

    It is the same for all of the Select2 fields. Initially the normal Select field displays, and only after the MB scripts finish loading do the styles kick in.

    This is extremely unprofessional looking. It looks as if the problem is because the WP styles are loading first, followed by the MB scripts, so we get this FOUC.

    How can I fix this?

    thanks

    Guy

    January 22, 2018 at 11:25 PM #8295
    meta_geckometa_gecko
    Participant

    Ok.. I can sort this out for the conditional logic with a bit of custom CSS by targeting the data attributes, which isn't really ideal.

    I guess I could try the same to make the Select2 fields behave properly too..

    This should work out the box in my opinion, it's a lot of additional coding for no really good reason, so if there is a better way of doing it I'd love to know how to fix it properly.

    Thanks

    January 23, 2018 at 8:59 AM #8300
    Anh TranAnh Tran
    Keymaster

    Hi,

    The script need to wait until DOM ready (like jQuery(document).ready()) to apply the conditions on elements. So, all elements must be loaded in order to run. I'm trying to optimize the JS part to make it runs faster to reduce the delay time.

    In the meantime, I think your CSS solution is good. CSS is loaded before JS and applied very early.

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)
  • The topic ‘Flash of Unstyled Content’ is closed to new replies.