Dash performance bad! HUGE disappointment no clue how to fix?

Hi
it was all going so well. I got my web site doing everything I wanted without ANY problems or mental stress. I’m loading 1.4gb of csv, I’ve got filters/ row selection and plotting all working like a CHAMP BUT all on the local host. The moment I tried to access the same web page from a machine on the same lan it times out!!!

I’ve tested out the mechanism with a simple site. Just loading 10 numbers from a list and plotting two line charts on a machine ( 192.168.1.202) and browsing to it from (192.168.1.212), it’s SLOW but it works eventually. So the comms aspect is working fine. This is a performance issue for sure and to be honest bit of a shock. Everything was going so well until I hit this. After all you can have the best web site on the planet but if no one can use it… I just want to use this on the LAN not hosted. The speeds on the LAN are excellent so it’s not a traffic issue, the machines are ONLY running this application.

Even running the browser on the local machine I get
“a web page is slowing down your browser. What would you like to do?” Stop it Wait

 * Serving Flask app "6 4 20   dash datatable drop select csv" (lazy loading)
 * Environment: production
e[31m   WARNING: This is a development server. Do not use it in a production deployment.e[0m
e[2m   Use a production WSGI server instead.e[0m
 * Debug mode: off
 * Running on http://192.168.1.202:8050/ (Press CTRL+C to quit)
192.168.1.202 - - [05/Jun/2020 14:31:11] "e[37mGET / HTTP/1.1e[0m" 200 -
192.168.1.202 - - [05/Jun/2020 14:31:11] "e[37mGET /_dash-component-suites/dash_renderer/react@16.v1_3_0m1586878729.13.0.min.js HTTP/1.1e[0m" 200 -
192.168.1.202 - - [05/Jun/2020 14:31:11] "e[37mGET /_dash-component-suites/dash_renderer/polyfill@7.v1_3_0m1586878729.8.7.min.js HTTP/1.1e[0m" 200 -
192.168.1.202 - - [05/Jun/2020 14:31:11] "e[37mGET /_dash-component-suites/dash_renderer/prop-types@15.v1_3_0m1586878729.7.2.min.js HTTP/1.1e[0m" 200 -
192.168.1.202 - - [05/Jun/2020 14:31:11] "e[37mGET /_dash-component-suites/dash_renderer/react-dom@16.v1_3_0m1586878729.13.0.min.js HTTP/1.1e[0m" 200 -
192.168.1.202 - - [05/Jun/2020 14:31:11] "e[37mGET /_dash-component-suites/dash_core_components/dash_core_components-shared.v1_9_0m1586878730.js HTTP/1.1e[0m" 200 -
192.168.1.202 - - [05/Jun/2020 14:31:11] "e[37mGET /_dash-component-suites/dash_table/bundle.v4_6_2m1586878730.js HTTP/1.1e[0m" 200 -
192.168.1.202 - - [05/Jun/2020 14:31:11] "e[37mGET /_dash-component-suites/dash_core_components/dash_core_components.v1_9_0m1586878730.min.js HTTP/1.1e[0m" 200 -
192.168.1.202 - - [05/Jun/2020 14:31:11] "e[37mGET /_dash-component-suites/dash_html_components/dash_html_components.v1_0_3m1586878729.min.js HTTP/1.1e[0m" 200 -
192.168.1.202 - - [05/Jun/2020 14:31:11] "e[37mGET /_dash-component-suites/dash_renderer/dash_renderer.v1_3_0m1586878729.min.js HTTP/1.1e[0m" 200 -
192.168.1.202 - - [05/Jun/2020 14:31:11] "e[37mGET /_dash-dependencies HTTP/1.1e[0m" 200 -
192.168.1.202 - - [05/Jun/2020 14:31:11] "e[37mGET /_dash-layout HTTP/1.1e[0m" 200 -
192.168.1.202 - - [05/Jun/2020 14:31:12] "e[37mGET /_dash-component-suites/dash_core_components/async-graph.v1_9_1m1586525729.js HTTP/1.1e[0m" 200 -
192.168.1.202 - - [05/Jun/2020 14:31:14] "e[37mPOST /_dash-update-component HTTP/1.1e[0m" 200 -

Hi @comicpilsen,
I personally never had such an issue. Perhaps it might be related to the fact that you are using the Flask development server…? Try to run your app with some WSGI server, e.g. gunicorn.

Hi @sislvacl thank you for the suggestion, when you say you haven’t hit this issue do you mean that you HAVE used the Flask development server and it’s fine? OR you deploy Dash apps on WSGI servers and all is fine.

I never encountered a significant difference in performance of a dash app when accessing it from local network compared to localhost.

I have experience with a large resource-heavy dash app with many callbacks large portion of which can run in parallel. With this app, I witnessed a huge performance improvement when switching from Flask development server to gunicorn (with 13 workers).

In any case, you should switch to production WSGI server if you want to deploy your app.

1 Like

@sislvacl thank you so much for taking the time. Just to make REALLY sure I understand what you are saying, you deployed your Flask server based app on a local server for development and then just ran a browser on a remote machine on the lan and there was no significant difference between the two?

Also have you ever seen the message?

“a web page is slowing down your browser. What would you like to do?” Stop it Wait

I understand your suggestion about WSGI but if my app performs poorly in the simple form I don’t want to spend any time deploying it elsewhere only to arrive at the same issue.

There is definitely something specific going on here with your app that can be resolved: many people, myself included, have developed Dash apps locally and then deployed them on LANs or even the public internet with no material performance degradation.

Can you share a bit more information about your app, the local and remote machines and the network between the two?

hi there @nicolaskruchten thank you for taking an interest. Starting with the network. Its hardwired ethernet lan with 3 machines on it. all the machines see each other can can ssh into each other. They are all running Ubuntu 18.04 fully updated and upgraded. As is all the python, pandas, plotly et al.

all the app does

loads a 1.5mb csv file into a dataframe
displays the dataframe using

app.layout =  html.Div([
                        html.Div([  
                                   dash_table.DataTable(
                                   id='datatable_id',
                                   columns=[{"name": i, "id": i} for i in df_today.columns],
                                   data=df_today.to_dict('records'),
                                   editable=False,
                                   filter_action="native",
                                   sort_action="native",
                                   sort_mode="multi",
                                   row_selectable="multi",
                                   row_deletable=False,
                                   selected_rows=[],
                     ##            page_action="native",
                     ##            page_current= 0,
                     ##            page_size= 10,
                                   style_cell={'textAlign': 'left','width': '80px'},
                                   fixed_rows={ 'headers': True, 'data': 0 },
                                   style_table={ 'maxHeight': '400px','overflowY': 'scroll' },         # https://dash.plotly.com/datatable/sizing 
                                                       )
                                 ]
                                 ,className='row'),

the users filters the dataframe
then selects which rows to plot.

Does that help at all?

I think there are two important hints, first:

and, second:

Since the amount of data is so small, it can not be the amount of data. Since you are in LAN, it is not the speed of the communication.

Could there be some sort of infinite loop? What I would do is set up some logging (or print statements) to every callback which will be fired after the .csv file upload. Logging with timestamps could show also where the app is slow, or where it does hang.

1 Like

Hi @nicolaskruchten thank you for taking an interest. If the loop exists I can’t see it. The process flow is exactly as written. I agree wholeheartedly that I need to put in logging but first I wanted to make sure that this wasn’t a Dash general problem as some posts seem to indicate that Dash has performance issues. Thanks again for you attention and excellent advice

I’m not sure what’s going on here, but I’m nearly certain it’s not a general problem with Dash :slight_smile:

If you could share the full code of your app, including data (dummy data if necessary) I can try it here to see if I can replicate the issue, but everything here seems like it should work.

You’re certain that the exact same app, with the same data etc, works when hosted on the same machine as the browser? The only difference in this case would be that traffic between browser and host is on the network, which doesn’t explain the message you’re seeing.

Is there anything appearing in the Javascript console in your browser?

2 Likes

hi @nicolaskruchten thank you so much for staying with this. I am certain it’s the same app as all I did was to change the ip address to reflect the remote access. It certainly is the same data as it only exists in one place, I did test that though. The network is completely empty of traffic as I got an old router and put them both on the own cables to make sure ( incidentally I am using two desktops both 8gb ram now an NOT a PI).

I can’t post the code sorry, I would dearly love to but there are reasons.

I have no idea what the Javascript console is? I am not a web person by any stretch of the imagination and one of the main reasons I liked Dash was “no javascript” Can you tell me how to look at the javascript console please?

ALSO I want to just bench check the power of the desktop just in case.
it’s:
ubuntu 18.04.4 lts fully updated and upgraded as is all the libraries
Intel core quad q9550 @ 2.83ghz
8gb ram

You can access the console usually with F12 key in the browser → Console tab.

thank you, I have never looked at that before so new knowledge :slight_smile: So I ran the app ON the local machine through the browser and got these results.

does anything spring out at you please?

Well, others might add into this, but for me it is quite hard anything very astonishing based on the network tab. What you can see that there are multiple HTTP GET requests that are served well (with response 200 OK). It there was something with 4xx or 5xx status, you would like to git into that. The time scale is 1 second, and it seems everything is alright (no requests taking multiple seconds for example).

What takes my attention is actually at very bottom: the Console with error messages: Some callback seems to be missing “Output”.

1 Like

first of all thank you so much for all your help on this. I have dodged anything to do with web development for decades and Dash was my only hope :slight_smile: It is wonderful to know that people like you are out there to guide us on our way and I thank you @nicolaskruchten

as to this issue, you and the others have given me enough to be looking at and I will take it from here. Incidentally the console error message was caused by me removing the entire OUTPUT area as I wanted to see if the delay was caused by the data load and NOT the plotting. Seems that the plot has nothing to do with it as it is still happening. Thank you again
cp

I have experience with a large resource-heavy dash app with many callbacks large portion of which can run in parallel. With this app, I witnessed a huge performance improvement when switching from Flask development server to gunicorn (with 13 workers).

2 Likes

thank you @lukemart great information and I will certainly check it out. Right now I’m going to be talking to the Julia people at MIT to find out how far they are along hiding all things webby from me. Dash is a wonderful approach and I was really happy with how quickly I was able to do what I wanted with minimum code. ESPECIALLY following Adam’s WONDERFUL youtube tutorials , so well presented and informative.

2 Likes

Thanks!

Regards.

A post was split to a new topic: Performance question