Fast image slide show

🎈 Using Streamlit
#1

Summary

Hi, all. I’m trying to create an image slide show using st.slider and st.pyplot, code like:

# create a bunch of figures 
figs = [plt.figure() for _ in range(10)]
# use st.pyplot
st.pyplot(figs[index])
# use st.slider to select
index = st.slider('figure index', 0, 10)

It works fine but too slow. It takes about 2~3 seconds to switch to the next figure after each sliding.
Is there any solution to accelerate this slideshow.

Thanks a lot.

#2

You can use caching to prevent rebuilding plots.

Also, you may want to look at tabs as an alternative. That will cause all charts to render up front and just switch views without being interpreted as a change in value by Streamlit.

Expanding on the pyplot example from the Streamlit Documentation:

import streamlit as st
from matplotlib import pyplot as plt
import numpy as np

@st.experimental_memo
def get_numbers():
    sets = []
    for i in range(10):
        sets.append(np.random.normal(1,1,size=100))
    return sets

sets = get_numbers()

@st.experimental_memo
def get_plot(i):
    fig, ax = plt.subplots()
    ax.hist(sets[i], bins=20)
    return fig

# create a bunch of figures 
figs = [get_plot(i) for i in range(10)]

with st.expander('Using a slider'):

    plot = st.container()

    # use st.slider to select
    index = st.slider('figure index', 1, 10)

    # use st.pyplot
    with plot:
        st.pyplot(figs[index-1])

with st.expander('Using tabs'):
    tabs = st.tabs(list(np.array(range(1,11)).astype(str)))

    for i in range(10):
        tabs[i].pyplot(figs[i])
2 Likes
#3

Thank you so much for the awesome solutions!
Tabs is even faster than the caching solution. :+1:

2 Likes