How to stop 'Loading...' from showing up

I am getting a lot of flickering in some circumstances. In the right situation, it can cause the user to be rerouted to a few pages, each one showing ‘Loading…’ for a fraction of a second.

This is for a multi-page app that has ‘flask login’ implemented, and a few redirects.

Any input is greatly appreciated!

What situation causes them to be rerouted several times? Is there any way to avoid that?

Sometimes you will run into caps on how many redirects can happen before it will give a too many redirects issue. This can happen if something breaks in your chain.

What I do is actually have the loading as a div by itself, and tell it when to show and when to hide. Because I also encountered this issue.

Edit:
I believe I ran into issues with off canvas and other stuff being inside the page inside the spinner.

@jinnyzor what I am referring to is the ‘Loading…’ that appears in the top left corner when a new page is visited or when the app is initialized, or when the page is manually refreshed.

I don’t have this as a string in a div, and it is not a component

Even if the rerouting was done differently, It would be nice to know if disabling this or changing the text is possiblee.

Ah, what’s your app.layout like?

The main layout:

import dash
from dash import html, dcc


def main_layout(app):
    app.layout = html.Div([
        dcc.Location(id='redirect'),
        dcc.Store(id="successful_login_storage", storage_type="session"),
        html.Div([dash.page_container]),
    ])

@anarchocaps,

Add this to your css file:

._dash-loading {
  display: none;
}

This will make it not display at all though, so use it cautiously.

Based upon:

1 Like