How to improve rendering speed?

Hello Teachers~! I’m happy to ask all you teachers!

I try to make something like chat app
But when add rows It takes quit long when it already have many rows
Can I get any advice? or It is impossible? …
( Patch() may work this time…?)

from dash import Dash, html, dcc, Input, Output, Patch, callback

app = Dash(__name__)

app.layout = html.Div(
    [
        html.Button('add text ', id='btn'),
        html.Div(id='output_div')
    ]
)

lst = [1] * 10000
@callback(
    Output("output_div", "children"),
    Input("btn", "n_clicks"),
)
def add_rows(n_clicks):
    if not n_clicks :
        return None
    lst.append(n_clicks)
    row = [html.H3(i) for i in lst[::-1]]
    return row


if __name__ == "__main__":
    app.run(debug=True)

As you want to add one item each time, Patch is the best choice.

1 Like

Sir . I think it is not different…!

from dash import Dash, html, dcc, Input, Output,State, Patch, callback

app = Dash(__name__)

lst = [1] * 10000
app.layout = html.Div(
    [
        html.Button('add text ', id='btn'),
        html.Div([html.H3(i) for i in lst[::-1]],id='output_div')
    ]
)

@callback(
    Output("output_div", "children"),
    Input("btn", "n_clicks"),
)
def add_rows(n_clicks):
    p = Patch()
    p.insert(0,{'props': {'children': n_clicks}, 'type': 'H3', 'namespace': 'dash_html_components'})
    return p


if __name__ == "__main__":
    app.run(debug=True)