#3667 HTML WASM stand-alone HTML page with CDN assets (no need to serve)

Description

Hi!

I love that there's two great alternatives in exporting WASM runnable apps:

Stand-alone HTML bundle that needs to be served
Running script or B64-string on marimo.app

But comparing to stlite (which misses 1st option) they opted to implement HTML file export as a non-offline option where they utilize CDN to load JS parts. I think this makes a clean HTML file, and a HTML file that doesn't need to be served. It's a great alternative to your existing 2 ones, as all have their use-case. To me this would make "deploying simple team tools" a tad bit cleaner, by simply sharing a HTML file that contains all. People can open that HTML file without knowing Marimo and get ready to work. And no need to serve it.

See their HTML export (copied and reduced from edit.stlite.net:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, shrink-to-fit=no"
    />
    <title>Stlite app</title>
    <link
      rel="stylesheet"
      href="https://cdn.jsdelivr.net/npm/@stlite/[email protected]/build/style.css"
    />
  </head>
  <body>
    <div id="root"></div>
    <script type="module">
import { mount } from "https://cdn.jsdelivr.net/npm/@stlite/[email protected]/build/stlite.js"
mount(
  {
    requirements: [],
    entrypoint: "streamlit_app.py",
    files: {
"streamlit_app.py": `import streamlit as st

st.title("Stlite Sharing: Serverless Streamlit app platform")

col1, col2 = st.columns(2, vertical_alignment="center", gap="large")
with col1:
    st.image("data/logo.png", use_container_width=True)
with col2:
    st.image("https://streamlit.io/images/brand/streamlit-mark-color.svg", use_container_width=True)
""")

st.header("Streamlit Component Samples")
st.markdown("""
    All these features are working on your browser!
""")

name = st.text_input("Your name?")
st.write("Hello,", name or "world", "!")

value = st.slider("Value?")
st.write("The slider value is", value)
`,
"data/logo.png": Hu(<base_64_png_string>),
"pages/_subpage.py": `import streamlit as st

st.title("Sub page")

st.markdown("""
_Stlite_ supports **Multi Page Apps (MPA)**, of course!

Create \`pages/*.py\` like this file to add new pages.

If you are new to MPA, read the official tutorial about it [ here](https://docs.streamlit.io/library/get-started/multipage-apps)
""")
`,

},
  },
  document.getElementById("root")
)

function Hu(e){const t=window.atob(e),n=t.length,r=new Uint8Array(n);for(let i=0;i<n;i++)r[i]=t.charCodeAt(i);return r}
    </script>
  </body>
</html>

Alternative

The current options aren't leaving us stranded, this would simply be an improvement

Additional context

No response

HTML WASM stand-alone HTML page with CDN assets (no need to serve)

Description

Suggested solution

Alternative

Additional context