如何在网页中快速加载 Plotly 图表？

Question

我正在使用 Django 创建我的第一个网站。我有一些用 Plotly 制作的复杂图，它们作为 html 传递给渲染函数（使用

to_html

函数保存）。例如：

def sample_plot():
    import numpy as np
    import pandas as pd
    import plotly.graph_objects as go

    fig = go.Figure()

    fig.add_trace(go.Barpolar(
        r=[77.5, 72.5, 70.0, 45.0, 22.5, 42.5, 40.0, 62.5],
        name='11-14 m/s',
        marker_color='rgb(106,81,163)'
    ))
    fig.add_trace(go.Barpolar(
        r=[57.5, 50.0, 45.0, 35.0, 20.0, 22.5, 37.5, 55.0],
        name='8-11 m/s',
        marker_color='rgb(158,154,200)'
    ))
    fig.add_trace(go.Barpolar(
        r=[40.0, 30.0, 30.0, 35.0, 7.5, 7.5, 32.5, 40.0],
        name='5-8 m/s',
        marker_color='rgb(203,201,226)'
    ))
    fig.add_trace(go.Barpolar(
        r=[20.0, 7.5, 15.0, 22.5, 2.5, 2.5, 12.5, 22.5],
        name='< 5 m/s',
        marker_color='rgb(242,240,247)'
    ))

    fig.update_traces(text=['North', 'N-E', 'East', 'S-E', 'South', 'S-W', 'West', 'N-W'])
    fig.update_layout(
        title='Wind Speed Distribution in Laurel, NE',
        font_size=16,
        legend_font_size=16,
        polar_radialaxis_ticksuffix='%',
        polar_angularaxis_rotation=90,

    )
    return fig.to_html(config={'displayModeBar': False})

渲染如下：

sample_plot = sample_plot() 
context = {'plot':sample_plot, ... other stuff ... } 
return render(request, 'webpage.html', context)

只需将此图传递到网页（包括在

context

中）即可将加载时间增加 2.1 秒（使用本地服务器和相同条件进行比较）。我有一些像这个一样复杂的图，所以加载时间使网页无法使用。

这种行为是预期的吗？有没有比使用 to_html 渲染 Plotly 图表更好的方法？还是 Plotly 不是网页绘图的入门者？对不起，如果这是一个基本错误，这是我的第一个网站。

Answer 1

只需缓存渲染图的视图。

from django.views.decorators.cache import cache_page

@cache_page(60 * 15)
def my_view(request):
    ...

仔细阅读Django 的缓存文档。缓存很有用且功能强大，但它们很复杂，配置错误会导致难以调试的后果。

Answer 2

您可以尝试使用 Plotly express，因为它是 Plotly 的高级包装器，为了更快地加载图形，您可以使用缓存或使用 Javascript 包装器嵌入 plotly，这通常会缩短加载时间。