Make image panes fast

[MarcSkovMadsen]

The Image panes like GIF are slow. The main reason being the images are downloaded, base64 encoded and sent to the client.

I understand that this embedding might be useful for some users. I've never had that use case though. And what I see is that a lot of data app beginners use a lot of Markdown and a lot of pictures. It should be easy and fast.

Before the 1.0 release I believe you can change and improve some of the default settings of Panel. This would include changing embed to False. Furthermore you could consider support caching when you embed. I don't have a use case where you want to re-download the picture when ever a new user arrives.

One more thing is that on my side I often get SSH errors when the picture are requested/ downloaded because of security restrictions in my environment. Again this is friction and something some users would not be able to solve or accept.

Example

In the below app 80% of the time on the server is spent on the GIF and the total time before the user sees the app is 1.75 secs.

# home.py
import panel as pn

pn.extension(sizing_mode="stretch_width")

SECTION = """
Panel works really well with the visualization tools you already know and love like [Altair/ Vega](https://panel.holoviz.org/reference/panes/Vega.html), [Bokeh](https://panel.holoviz.org/reference/panes/Bokeh.html), [Datashader](https://datashader.org/), [Deck.gl/ pydeck](https://panel.holoviz.org/reference/panes/DeckGL.html), [Echarts/ pyecharts](https://panel.holoviz.org/reference/panes/ECharts.html), [Folium](https://panel.holoviz.org/reference/panes/Folium.html), [HoloViews](https://holoviews.org/), [hvPlot](https://hvplot.holoviz.org), [plotnine](https://panel.holoviz.org/reference/panes/Matplotlib.html), [Matplotlib](https://panel.holoviz.org/reference/panes/Matplotlib.html), [Plotly](https://panel.holoviz.org/reference/panes/Plotly.html), [PyVista/ VTK](https://panel.holoviz.org/reference/panes/VTK.html), [Seaborn](https://panel.holoviz.org/gallery/styles/SeabornStyle.html) and more. Panel also works with the [ipywidgets](https://panel.holoviz.org/reference/panes/IPyWidget.html) ecosystem.
"""

IMAGE = pn.pane.GIF("https://user-images.githubusercontent.com/42288570/211983400-3315ad0a-866a-4916-8809-6fc38eca34d9.gif", alt_text="Pythons DataViz works with Panel", link_url="https://panel.holoviz.org/reference/index.html#panes", height=400)

component = pn.Column(
    SECTION, IMAGE
)

NAVIGATION = """
## Navigation

[home](home)
[dashboard](dashboard)
"""

pn.template.FastListTemplate(
    site="Panel", site_url="https:\\panel.holoviz.org",
    title="Home", main=[component], sidebar=[NAVIGATION],
    main_max_width="900px",
).servable()

[MarcSkovMadsen]

Update. I can see embed is False by default. But still the image is downloaded to the server and a lot of time is spent.

[philippjfr]

The requirement to download the image is needed to determine the image size and aspect ratio. When we update to Bokeh 3.0 the new layout engine will handle this gracefully and that will no longer be needed.