This website uses cookies to anonymously analyze website traffic using Google Analytics.
Code Sandbox

How HeroUI Chat launched 10x faster with Together Code Sandbox

  • 10x faster

    product development

  • 98% lower

    preview cold starts

Executive Summary

HeroUI faced challenges with infrastructure complexity and slow app previews, delaying their AI-powered product launch.

Switching to Together Code Sandbox provided managed infrastructure and instant preview environments. As a result, HeroUI accelerated its go-to-market by over 4 months, reduced preview launch times from 2 minutes to 2 seconds, and shifted resources fully toward product innovation.

AI-driven coding tools have taken the developer world by storm, fundamentally transforming the way software gets built. React developers, in particular, have embraced these innovations to simplify UI development workflows and enhance productivity.

HeroUI—a popular React component library—recognized this momentum and decided to build HeroUI Chat, an intuitive text-to-app builder that leverages AI to instantly generate beautiful, ready-to-use React applications.

But translating AI-generated code into a running app in seconds required more than clever prompts. HeroUI quickly hit infrastructure roadblocks: WebContainers proved unreliable and browser-limited, custom AWS infrastructure ballooned in cost and complexity, and cold-start times stretched to over two minutes—breaking the fast feedback loop essential for an AI-native product.

That’s when they turned to Together Code Sandbox—a managed platform for executing code in secure, scalable environments. By switching, HeroUI cut their go-to-market timeline from five months to two weeks, reduced cold-starts to two seconds, and freed up their team to focus on building product—not infrastructure.

A Hero in the React community

HeroUI started as an open-source React component library aimed at simplifying web design. With over 76,000 developers and 600,000 monthly downloads, HeroUI has become one of the most beloved UI libraries in the React community. 

As text-to-app builders became increasingly popular, HeroUI saw a big opportunity to leverage LLMs to make it even easier for their users to build beautiful sites with their library. However, they faced a big challenge: due to a recent product overhaul, existing AI models weren’t trained on HeroUI’s unique components and design guidelines.

HeroUI Chat was born out of this gap—a platform designed specifically to translate user prompts or even screenshots into fully functional HeroUI-powered applications in minutes.

Wrestling with infrastructure

In HeroUI Chat, users provide a prompt or a screenshot as input, and the platform uses some of the best coding LLMs to write code and display the running application to the user, who can then share it with others. This presented a key challenge: executing the LLM-generated code and rendering it instantly on the user’s browser.

HeroUI's initial approach was to leverage WebContainers to execute user-generated code directly using the browser’s resources. However, WebContainers were difficult to implement and its browser runtime meant that users with lower-spec devices wouldn’t be able to use HeroUI Chat. Browser compatibility issues also emerged, as WebContainers didn't run smoothly outside of Chrome, further complicating the user experience.

“WebContainers sounded promising at first, but the complexity, limited browser support and device requirements quickly made it clear we needed a better solution.” — Junior Garcia, Founder and CEO of HeroUI

This led HeroUI's small team to shift gears and build their own infrastructure using AWS services like EKS, CodeBuild, and CodePipeline. They envisioned a setup that could spin up Docker containers instantly and handle complex dependency management. However, each step became increasingly complicated. From container orchestration to network security, the tasks were resource-intensive and pulled their focus away from product innovation.

"It felt like we were creating a whole new business just to support our main product. Our team was spending more time troubleshooting infrastructure than building the features our users really needed." — Junior Garcia, Founder and CEO of HeroUI
Overview of the original architecture of HeroUI Chat's preview service.

Cost management also became problematic as expenses ballooned due to the complex combination of AWS services required. And despite the team’s efforts in optimizing their in-house Firecracker infrastructure, their cold-start times remained too high, taking over two minutes to launch a Docker container.

"We estimated that building and optimizing our own infrastructure from here would take months of engineering time, which we couldn't afford to lose." — Junior Garcia, Founder and CEO of HeroUI

Moving to Together Code Sandbox

While looking for alternative solutions that solved for the challenges they had encountered so far, HeroUI discovered Together Code Sandbox.

The decision to pivot was quick and impactful. Out of the box, Together Code Sandbox provided a streamlined, managed solution for executing AI-generated code. The built-in code execution, preview API, and git source control allowed HeroUI’s team to quickly configure a solution to spin up sandbox environments almost instantly.

“With Together Code Sandbox, we had an MVP running in a couple of hours. We could finally test the result of HeroUI Chat, instead of waiting for months to see the result in a preview environment.” — Junior Garcia, Founder and CEO of HeroUI
Overview of the architecture of HeroUI Chat's preview service deployed on Together Code Sandbox.

HeroUI Chat leverages Together Code Sandbox for storage, version control, and real-time previews. Additionally, the team also found they could use the integrated git system within the sandbox to provide versioning, allowing users to manage changes and roll back to previous versions seamlessly.

A product accelerator

By providing all the tooling and managed infrastructure that HeroUI’s team needed out of the box, Together Code Sandbox drastically reduced HeroUI’s development timeline.

The team no longer had to worry about the infrastructure, so they shifted their focus back to product development and user experience enhancements. This significant reduction in development time allowed HeroUI to launch HeroUI Chat much earlier than anticipated, giving them a competitive edge.

Apart from accelerating the product roadmap, Together Code Sandbox significantly increased the performance of spinning up preview environments, with cold-start times dropping from two minutes to two seconds on average. Users can now see their AI-generated applications almost instantly, which is a crucial piece of the performance-centric experience honed by HeroUI Chat.

“We spent a lot of time making HeroUI Chat as fast as possible, so it feels instant to the user. Now imagine a user enters a prompt, gets the code really fast, and then has to wait for minutes for the preview to render. It wouldn’t fly. Together Code Sandbox solved this because we can now show a complete environment running the application in a couple of seconds.” — Junior Garcia, Founder and CEO of HeroUI

Building together

Ultimately, moving to Together Code Sandbox accelerated HeroUI Chat’s roadmap. More than providing an immediate solution to their infrastructure challenges, it delivered a robust, fully managed infrastructure that freed the team to focus on product innovation.

"Now, Together Code Sandbox is the core of HeroUI Chat; it is the platform that allows us to run the projects. Without it, we don't have a way to show you the result of the AI." — Junior Garcia, Founder and CEO of HeroUI

And as the team witnesses their user base grow, they can rest assured that Together AI's dedicated team of engineers is continuously scaling and improving the infrastructure—ensuring HeroUI can smoothly handle the transition from thousands to millions of monthly users.

"We can now focus completely on our core product, knowing our infrastructure is continuously improving and evolving. It feels like having a dedicated infrastructure team right alongside us." — Junior Garcia, Founder and CEO of HeroUI

If you’d also like to scale your AI development platform with Together Code Sandbox, integrate it in minutes by following our Docs. And in case you have a more complex setup or would like to discuss a custom deployment, reach out to us!

Use case details

Products used

Highlights

  • Cold-start: 2 minutes → 2 seconds
  • Go-to-market: 5 months → 2 weeks
  • Browser support: Chrome-only → Any device
  • Dev focus: 80% infra → 90% product

Use case

Running AI-generated web apps on the end-user’s browser.

Company segment

AI-Native Startup

Start building your success story today