DEV Community

lsustc
lsustc

Posted on

AI Browser Development Story: How a Failed Project Found New Life

#ai #webdev #agents #programming

"Sometimes the best products come from projects that were never supposed to exist."

Hey everyone, I'm the author of AI Browser.

Today, I want to share the story behind this open-source project — its birth was actually an accident.

I. The Beginning: A Performance-Driven Exploration

The story starts with my day job.

As the frontend lead for AI initiatives at my company, I spent the first half of 2024 maintaining a lukewarm AI project. If you're also a working professional, you know the drill: to get good performance reviews, you need to work on standout projects.

So, my colleague (let's call him Tan), who was the product manager for AI applications, and I embarked on a two-month exploration.

Tan wasn't entirely sure what he wanted at first. His requirements were quite "grand":

"Forget past constraints, envision the future! Our product must wow the boss!"

After reviewing many competitor apps, we settled on a concept: Jarvis from Iron Man.

User asks a question, the agent autonomously gathers information, calls different tools, and delivers the answer.

I initially benchmarked against Fellou (learning from the best, you know). This AI browser's interactions and UI were truly impressive and caught my eye.

And so, the first phase of exploration began.

II. Technical Research: Lessons Learned from $200+

The Challenge: How to Make AI Control a Browser?

The core problem was: How to programmatically control a browser to automate web tasks.

We immediately abandoned the company's ancient C++ client. As someone with a frontend background, I went straight for Electron for desktop app development.

I found many browser automation tools, like browser-use. The popular Manus was using browser-use, so I tried to integrate browser-use into Electron.

But ultimately, I failed.

The Insane Cursor Credit Burn

Looking back, the scene was quite surreal.

Back then, Cursor hadn't "shot itself in the foot" yet, and Claude Code (CC) wasn't popular. I used Tan's Cursor subscription to start the research, confidently asking:

"Can Electron + browser-use + Playwright be integrated into one application?"

Cursor replied: "Yes!"

Then I kept trying... Soon, Tan's subscription ran out.

I gritted my teeth and subscribed to a $20/month plan, which lasted less than half a day.

I gritted my teeth again and got a $200 Max subscription! Surely that'd be enough, right?

One day. Just one day. The entire $200 credit was gone, and I still didn't have a working demo.

A Harsh Lesson

I felt crushed.

Since I didn't deeply understand Electron, browser-use, or Playwright's underlying principles, I had no idea what to do. That's when I learned:

AI can greatly accelerate work in domains you already know — you can tell it what to do.

But if you're doing something you don't understand yourself, AI probably won't succeed either. Unless many people have done it before and it's well-documented.

This lesson cost $200+.

III. The Turning Point: Light After Deep Learning

Since AI couldn't help, I had to rely on myself.

I dove deep into the documentation and source code of Electron, browser-use, and Playwright. After a few days, I concluded:

  • Electron can build desktop apps (no problem there)
  • browser-use is an independent Python service
  • Playwright is another independent application

Integrating these three into one app was basically impossible.

Finding Alternatives

So I started looking for alternatives.

First, I found the Eko framework open-sourced by the Fellou team. After careful study, I realized:

Using Eko in Electron is feasible! It's just a matter of compatibility work.

Next, I wanted to embed a local frontend service in Electron. I chose Next.js (because it's popular).

I spent a few more days getting Cursor to help me load a Next.js service in Electron. Honestly, I thought it'd be simple, but Cursor let me down again.

No choice, I had to dig into Next.js docs myself.

Eventually, I successfully embedded Next.js in Electron using a custom server — similar to the approach used in the open-source project bolt.diy.

The technical approach finally worked!

IV. Development Phase: Learning From Scratch

After solving the Electron + Next.js problem, I entered the actual development phase.

Learning React and Electron

Since my previous tech stack was Vue, I spent a weekend learning React fundamentals for this project.

Meanwhile, I kept reading Electron's official documentation, learning about main processes, renderer processes, IPC communication, etc.

Adapting the Eko Framework

Next was making the Eko framework compatible with Electron to control web pages in view windows.

This work sounds simple but is all about details: window management, view switching, browser control... every step required care.

Implementing Various Agents

After completing these basic capabilities, I started implementing various Agents:

  • BrowserAgent: Control web pages, execute automated tasks
  • FileAgent: Handle file read/write and management
  • ClientAgent: Control the company's client application

In the first version, I even learned from Fellou to use screen sharing, theoretically allowing simultaneous control of multiple windows. But the window positions could never be moved off-screen. Even after Claude Code generated several macOS low-level capability extension files, the cost felt too high, so I abandoned that approach.

We also tried fully voice-driven input/output, but the results weren't ideal.

Eventually, we built a "Frankenstein" demo — not perfect, but with working BrowserAgent, FileAgent, and ClientAgent.

Two months later, we finally had something!

V. The Crash: When It Got Rejected

I excitedly went to demo it, expecting the boss to be impressed.

The result? For various indescribable reasons, the project was rejected.

It felt like spending two months preparing for a confession, only to hear: "You're a nice person."

The project was shelved, and I was pulled to work on other company-level AI initiatives. That demo just sat in some corner of my hard drive.

VI. Rebirth: A Weekend Open-Source Project

A month later, I suddenly thought:

"Are there others exploring similar capabilities — controlling web pages within an application?"

If so, would they encounter the same struggles I did?

So, I used Claude Code to rebuild a clean open-source version over a weekend, based on Electron + Eko + Next.js.

This time, no company baggage, no KPI pressure — just pure technical exploration.

I cleaned up the code and published it to GitHub:

👉 https://github.com/DeepFundAI/ai-browser

Then, in my spare time, I started refining my earlier vision:

  • ✅ History task playback
  • ✅ Human interaction capability
  • ✅ Voice input support
  • ✅ Multi-language internationalization
  • ✅ Agent configuration system
  • ✅ Scheduled tasks
  • ✅ Toolbox page

Every feature was completed during late nights and weekends after work.

VII. Reflections: The Value of a Failed Project

Looking back, I have a few insights:

1. The Boundaries of AI Tools

AI isn't omnipotent. It can accelerate work in familiar domains, but it can't replace your understanding of underlying principles.

That $200 Cursor subscription didn't buy me code — it bought me a lesson: When facing unfamiliar tech, you still need to learn it yourself.

2. Failed Projects Can Be Reborn

The internal company project was rejected, but the technical knowledge remained.

Rather than letting it gather dust on my hard drive, why not open-source it to help others?

Maybe someday, someone will find it useful, or even build something better based on it.

3. The Meaning of Open Source

Open source isn't just about sharing code — it's about sharing experience and ideas.

I hope this project helps those exploring similar paths — at least they won't have to burn $200 verifying "whether Electron + browser-use + Playwright can be integrated."

VIII. The Future: Join Us

Now, AI Browser is a relatively mature open-source project.

But it's far from perfect. Many features are still waiting to be implemented:

  • 🎨 Theme customization (dark mode)
  • 🔌 Plugin marketplace (MCP tool ecosystem)
  • 📊 Visual workflow editor
  • 🌐 More Agent support (Shell, Email, Notion...)

If you're interested in this project, please give us a Star on GitHub ⭐

👉 Repository: https://github.com/DeepFundAI/ai-browser

Stars not only encourage us but help more people discover this tool.

If you're a developer, feel free to file issues, submit PRs, or join discussions.

If you're a user, download it, try it out, and give us feedback.

Closing Thoughts

From an internal performance-driven project, to getting rejected and shelved, to rebuilding it as open source over a weekend — this failed project ultimately found its value.

Perhaps that's the charm of open source:

No KPI constraints, just pure technology.

No commercial pressure, just the joy of sharing.

I hope this project shines someday and helps those who are exploring just like we did.

If this story resonates with you, please give us a Star ⭐

Quick Links

opensource #aibrowser #techstartup #developerlife #electrondev

Follow me for more stories about building AI tools and lessons learned from failures.

See you next time!

Top comments (0)