Shiny Express: Blending the Best of Shiny and Streamlit for Dashboard Development

<a href="https://appsilon.com/r-shiny-modules/" target="_blank" rel="noopener">Shiny</a> has long stood as a pillar of functionality and flexibility for R-based web applications. Let's explore <strong>Shiny Express</strong> — an emerging Python-centric framework in development that combines the ease of <a href="https://appsilon.com/streamlit-tutorial-rstudio-connect/" target="_blank" rel="noopener">Streamlit</a> with the robustness of Shiny. This article explores the nuances of Shiny Express and what differentiates it from <strong>Classic Shiny</strong> and <strong>Streamlit</strong>. <h3>Table of Contents</h3> <ul><li><a href="#overview-shiny-express">Brief Overview of Shiny Express</a></li><li><a href="#installation">Installation</a></li><li><a href="#example">Example</a></li><li><a href="#comparing-shiny-streamlit">Comparing Shiny Express with Streamlit</a></li><li><a href="#potential-challenges">Potential Challenges</a></li><li><a href="#conclusion">Conclusion</a></li></ul> <blockquote>Ready to Enhance Your Shiny App Prototyping Skills? <a href="https://appsilon.com/prototyping-with-shinyuieditor/" target="_blank" rel="noopener">Explore {ShinyUiEditor}</a>.</blockquote> <h2 id="overview-shiny-express">Brief Overview of Shiny Express</h2> <a href="https://wch.github.io/shiny_express_doc/" target="_blank" rel="noopener noreferrer">Shiny Express</a> is a new, simplified way to write Shiny app prototypes by <a href="https://posit.co/" target="_blank" rel="noopener noreferrer">Posit</a>, offering an easier and quicker development process compared to traditional Shiny. It's akin to <a href="https://streamlit.io/" target="_blank" rel="noopener noreferrer">Streamlit</a> in user-friendliness but with greater potential. Shiny Express includes integrated UI and server code, simplified layout components, and automatic setting of top-level page containers, making it more accessible, especially for beginners. Just like Streamlit, it won’t suit all use cases, but on the contrary will be much easier to refactor into Classic Shiny, with clear UI and server separation, for complex applications. <h2 id="key-features-shiny-express">Key Features of Shiny Express</h2> Here are some key features of Shiny Express: <ul><li><strong>Simplified Code Structure:</strong> It has a simpler code structure with fewer concepts, enhancing accessibility for beginners.</li><li><strong>Integrated UI and Server Code:</strong> Unlike traditional Shiny, Shiny Express does not separate UI and server code, streamlining the development process.</li><li><strong>Layout Components Usage:</strong> It introduces <code>layout.foo()</code> for easy nesting of UI components.</li><li><strong>Automatic Page-Level Container Setting:</strong> Shiny Express automatically sets page-level containers like <code>page_fluid()</code> or <code>page_sidebar()</code> based on the used layout components, simplifying layout management.</li></ul> <h2 id="installation">Installation</h2> <h4>Install Shiny and htmltools:</h4> Shiny Express requires the installation of development <code>shiny</code> and <code>htmltools</code> versions from GitHub. In your terminal, execute the following commands: <pre><code class="language-r"> pip install git+https://github.com/posit-dev/py-htmltools pip install git+https://github.com/posit-dev/py-shiny </code></pre> <h2 id="example">Example</h2> In this Shiny Express example, let's create an interactive app featuring a dynamic histogram plot with an adjustable slider: <pre><code class="language-python"> from shiny import ui, render, reactive from shiny.express import input import numpy as np import matplotlib.pyplot as plt <br># Setting the title of the panel ui.panel_title("PyShiny App") <br># Creating a slider input for number of samples ui.input_slider("n_samples", "N Samples", 10, 100, 50) <br># Creating a dropdown select input for choosing a color ui.input_select('selected_color', "Color", ['red', 'green', 'blue']) <br># Reactive function to generate random numbers # It updates when the slider value changes @reactive.Calc def x():    return np.random.randn(input.n_samples())     # Function to render the histogram plot # It updates when either the slider value or the selected color changes @render.plot def plot():    fig, ax = plt.subplots()    # Histogram of the random numbers with the selected color    ax.hist(x(), color=input.selected_color())    return fig </code></pre> <img class="size-full wp-image-22289" src="https://wordpress.appsilon.com/wp-content/uploads/2023/12/Screenshot-2023-12-06-at-2.30.36 PM.webp" alt="" width="916" height="686" /> PyShiny App This example showcases a Shiny Express app that integrates a slider for adjusting sample size and a dropdown for colour selection, dynamically updating a histogram plot in response to user inputs. This illustrates the power and flexibility of Shiny Express in creating interactive and responsive web application prototypes with minimal and intuitive coding. <h2 id="comparing-shiny-streamlit">Comparing Shiny Express with Streamlit</h2> <h3>Streamlit App</h3> This Streamlit app mirrors the above Shiny Express example. <pre><code class="language-python"> import streamlit as st import numpy as np import matplotlib.pyplot as plt <br># Displaying the title of the Streamlit app st.title("Streamlit App") <br># Creating a slider for number of samples n_samples = st.slider("N samples", 10, 100, 50) <br># Creating a dropdown select box for choosing a color selected_color = st.selectbox("Color", ["red", "green", "blue"]) <br># Generating random numbers based on the selected number of samples x = np.random.randn(n_samples) <br># Creating a matplotlib figure and axis fig, ax = plt.subplots() # Plotting a histogram of the random numbers with the selected color ax.hist(x, color=selected_color) # Displaying the plot in the Streamlit app st.pyplot(fig) </code></pre> <img class="wp-image-22270 size-full" src="https://webflow-prod-assets.s3.amazonaws.com/6525256482c9e9a06c7a9d3c%2F65b00c81b5e5fb20519c86e7_pyshiny-vs-streamlit.webp" alt="" width="1600" height="915" /> PyShiny vs Streamlit <ul><li><strong>Flexibility:</strong> While Streamlit is user-friendly and suitable for quickly creating simple apps, it has limitations when it comes to more complex or customized functionalities. On the other hand, Shiny Express provides a balance between ease of use and the advanced capabilities of Shiny such as the seamless integration of custom CSS and JavaScript, allowing for more complex app development.</li><li><strong>Capabilities:</strong> While Streamlit excels in simplicity and ease of use, it might not be the ideal choice for applications demanding complex user interactions or advanced data manipulations. This observation becomes apparent <a href="https://posit.co/blog/why-shiny-for-python/" target="_blank" rel="noopener noreferrer">when contrasting Streamlit's script execution model with Shiny's reactive graph approach</a>, including Shiny Express. The latter's design not only offers superior scalability but also supports more intricate data processing and user interface dynamics. This makes Shiny, and by extension Shiny Express, more adaptable and suitable for a wider variety of applications, accommodating more complex requirements.</li><li><strong>Learning Curve:</strong> For users familiar with Python and seeking quick app development with minimal learning, Streamlit is often the go-to. Shiny Express, while striving for simplicity, might have a slightly steeper learning curve but leads to a more powerful toolkit, especially beneficial for those wishing to transition to more complex Shiny applications later on.</li></ul> In summary, Shiny Express offers a more flexible and capable alternative to Streamlit, especially for users looking to create more complex web applications while still benefiting from a simplified development process. <blockquote>Discover whether Streamlit or Shiny best suits your data science needs in our comprehensive comparison, <a href="https://appsilon.com/streamlit-or-shiny-for-life-scientists/" target="_blank" rel="noopener">Choosing the Right Data Dashboard Tool: The Unique Strengths of Streamlit and Shiny</a>.</blockquote> <h2 id="potential-challenges">Potential Challenges</h2><ul><li><strong>Risk of Confusion:</strong> Having two distinct ways of writing Shiny apps (Classic and Express) could create confusion, especially for new users.</li><li><strong>Suitability for Use Cases:</strong> Shiny Express is not one-size-fits-all. It's more suitable for simpler applications or for beginners. The traditional Shiny model is more appropriate for complex, large-scale applications, where intricate control and customization are required.</li></ul> <h2 id="conclusion">Conclusion</h2> Shiny Express offers a more accessible entry point for newcomers to Shiny, simplifying the learning curve with its streamlined syntax and integrated UI and server code. Experienced users can benefit from its quick prototyping capabilities while retaining the option to smoothly switch to traditional Shiny for more complex tasks. The choice between Shiny Express, Classic Shiny, and Streamlit depends on the application's complexity and specific requirements. <strong>Streamlit</strong> suits <strong>rapid</strong>, <strong>simple app development</strong>, <strong>Shiny Express</strong> is ideal for <strong>intermediate complexity with greater flexibility</strong>, and <strong>Classic Shiny</strong> is best for <strong>intricate</strong>, <strong>highly customised</strong> applications. Users can evaluate their needs and expertise level to select the most appropriate framework. <blockquote>Enjoying our content? Then you'll love our upcoming event – <a href="https://www.shinyconf.com/shiny-gatherings" target="_blank" rel="noopener">Shiny Gatherings #9: R Shiny Trivia Night</a>! Whether you're a solo player or teaming up with friends and colleagues, this is your chance to showcase your R Shiny knowledge. Get ready for an evening of competition, prizes, and fun. <a href="https://share.hsforms.com/1BGdQEoCORSKeJ53DQyUrLw2rk4g" target="_blank" rel="noopener">Secure your spot today and be part of the excitement</a>.</blockquote> &nbsp;