First page loading transition

Dash Python
1

Hi Dashers.

I finally have a better transition for loading the first page, I want to share some tips:

I added a html.Div with the “Wellcome message” using style={‘height’: ‘100vh’, ‘width’: ‘100vw’} to show only that in the first place. Thanks @tcbegley for this Tip. :grinning:

With a dcc.Interval I managed to hide the html.Div “Wellcome message” after the page is ready to be showed (also could be better using dcc.Loading).

I also use a very nice Lottie file to animate the message. Lottie has a lot of interesting animations and thanks to @Emil work you can implement it in Dash very easy (Lottie animations in a Dash app):smiley:

Here you can see the transition without any of the common loading issues:
https://companyanalysis.herokuapp.com/

2 Likes