New library: stlite, a port of Streamlit to Wasm, powered by Pyodide

Show the Community!
63

Thank you so much this works perfectly.

Just one point, in my case the <link> or loading from network using js does indeed work. the only case when it does not is if I try to access the network from inside the stlite script.

For example, this code works fine with Github pages, even though it requests the network:
<link type="text/css" rel="stylesheet" href="../src/styles.css">

In this case, is there any way to read the file that was loaded in the html header from stlite ? (for example in this case reading that styles.css file)

A bonus question:
Wouldnā€™t be nice to be able to use separately defined python files instead of including all the files in the html file ?
for example:

<link href="../code/main.py">
<link href="../code/tools.py">

then

stlite.mount(
  {...
    files: {
"code/main.py": loadFile("main.py"), 
},

this way it would be so much easier to maintain and edit the python code instead of doing so inside the html.

64

Very interesting.
I wonder, is it possible to do object tracking solution that could work on top of stlite?
Smooth video UX is not so important for this app, but Iā€™d like to make nearly real time calculation of objects and object co-ordinates in the webcam video frame.

65

@pahotari Hi, thanks!
Iā€™m not sure if a suitable object-tracking algorithm working on stlite/Pyodide is available,
but this real-time image processing demo app with scikit-image image filters may be the starting point:

In this app, in addition to stlite, the real-time video I/O relies on streamlit-fesion custom component, which is still in beta though.

66

@Abdelgha_4 thank you.

the only case when it does not is if I try to access the network from inside the stlite script .

Thatā€™s interesting, as I thought network access from an stlite script is the same as normal JS network access such as fetch() or XMLHttpRequest.
It makes sense if <link> works and JS doesnā€™t, as the network access with <link> may include some credentials to access secured resources. If it is this case, adding the same cookie to the request header from stlite scripts (pyfetch()) could be a solution.

is there any way to read the file that was loaded in the html header from stlite

I think itā€™s not possible.

A bonus question:

Makes sense, and the same approach using encodeB64ToArrayBuffer works for Python files for this purpose.
The discussion in the following issue may also help.

1 Like
67

Is there any functionality about setting custom theme? It seems to be stlite could not adapt config.toml during the build of desktop app.

68

Hi, Iā€™m a beginner at coding. I built a streamlit app and used PyInstaller to package my application into an .exe file. However, I ran into some issues while trying to open my exe file (main.exe). If I click on the .exe file, I get the following error: Session state does not function when running a script without streamlit run

When I try to run streamlit run main.exe on my terminal, it still doesnā€™t work, because streamlit run can only operate with .py files and not .exe files. I am using st.session_state to change the values and keys of my st.text_input at st.file_uploader.

I was referred to using st lite to resolve my issue, however Iā€™m not too sure how st lite can replace st.session_state? Or is there a way I can somehow use .getElementByID() to change the value and keys of my st.text_input and st.file_uploader?

69

@Hikmet Hi, I answered it in Feature Request: support some streamlit configuration (at least Theming) Ā· Issue #997 Ā· whitphx/stlite Ā· GitHub. Please refer to it.
tl;dr:

  • If you are using @stlite/mountable, use stlite.mount()'s streamlitConfig option.
  • Stlite Sharing and @stlite/desktop doesnā€™t support it for now.
70

@kk09 Looks like itā€™s mixture of different problems.
For the first problem, does your code work on normal Streamlit? I recommend you to ask it in a different thread as a general question.
For other questions, the answers are no.

71

I registered here just to give a massive thank you to Yuichiro @whitphx for creating stlite!

I use streamlit at work to test and create apps for risk management in geoscience and the possibility to make windows executables that my manager and coworkers can play with (without having to install python etc) is just great.

(a small aside: in my latest project I had to change st.segmented_control() to st.radio() otherwise the app wouldnt workā€¦ also tested st.pills() but it also failedā€¦ is there a list of streamlit components that are not ā€œportedā€ to stlite yet?)

72

Hi @aadm thank you for the message!

st.segmented_control()and st.pills were introduced in Streamlit==1.40.0 and Stlite== 0.73.0 ported it. Plz update the Stlite version to >=0.73.0.

1 Like