Gadgets: Personal app vibe coding that is actually safe — Kenton Varda, Cloudflare
AI Engineer · 18 min · 204 sentences · from YouTube's caption track
Each timecode opens YouTube at the start of that sentence. Line anchors (#s42) are the cue ids in the WebVTT, and every line carries its start and end seconds. All transcripts has every talk, and the whole corpus as one file.
- 00:01[music]
- 00:23Okay.
- 00:24Hi.
- 00:25All right.
- 00:25I've got a lot to talk about, so I'm going to launch right into it here.
- 00:29Um, so Swix says that you only get to make one point at every talk, uh, one key takeaway.
- 00:35And so I figured I'd just lead with that.
- 00:37My, uh, key point is personal AI codegen breaks traditional cloud infrastructure.
- 00:43And to clarify what I mean about that, the word personal here is, uh, is is doing a lot of work.
- 00:49It's uh, loadbearing as cloud would say.
- 00:52Um my point is that um if we want to see this future where um everyone has personal apps and like can personalize uh the apps that they run um the
- 01:02infrastructure we're using today um for for software in general is is not the right thing and we need something completely different.
- 01:09So to explain what I mean um think about the way that uh uh software is produced and distributed today.
- 01:18You have a developer in an ivory tower who builds an app and then sends it down to the the people the users who use the app and many of them are happy with it but some of them are not.
- 01:31Some of them uh say this app needs uh some additional features for my use case and so they go to the developer and they say oh great developer will you please grant my feature request
- 01:43your app is literally unusable without it.
- 01:46And so then the the developer's representative, the product manager takes these feature requests and files them into Jira where they are never seen again.
- 01:56Um but sometimes sometimes the product manager sees a feature request and says ah I you know I want that too and then that feature request goes onto the road map and the developer
- 02:07um works on it and the developer is implementing all these features features that uh you know each one is only used by a small subset of users and each one is adding all these if statements their code and making things messy
- 02:22and uh they don't like it because the codebase is becoming a mess and each of these features which is really kind of boring to implement.
- 02:28And so the developer says, "Ah, I know what I need to do.
- 02:32We need a rewrite.
- 02:35We need to we need a new architecture that has a plug-in system."
- 02:40And then every one of these features can be a plug-in and it can be nice and clean and easy to build and the core can stay clean.
- 02:48And so the developer goes off and starts working on the the new architecture with the plug-in system.
- 02:53and uh there are still feature requests coming in and the developer says,"Well, we can't do those features yet because uh we need the plug-in system.
- 03:03This will be so much easier once we have the plug-in system.
- 03:06And if we do it now, we're just delaying that and we'll just have to redo it later anyway."
- 03:09And so um the years go by and uh the new architecture is not ready yet and
- 03:17[snorts]
- 03:17none of the features are being implemented and people are saying, "What are they doing?
- 03:21this developer has given up their product and uh everybody is sad.
- 03:27So AI seems to present a new alternative to this.
- 03:34What if uh the developer could create their app, the first version of their app, give it to the users, and the users if they need a new feature could say
- 03:45that could ask their AI agent to write that feature just for them, add it to the app.
- 03:51Um, then everyone gets the features they need.
- 03:54No one is bogged down in everyone else's features.
- 03:57Uh, and the developer gets to keep the the core app nice and clean and beautiful.
- 04:03But there's a there's a problem with this, which is that none of the the infrastructure we build software on today is like remotely designed for this.
- 04:13You've got uh Apple and Google for the past 15 years uh gatekeeping their systems to the point where there's like five companies that can build mobile apps now and uh because everyone else has been banned.
- 04:28Um and it's almost like easier to in the United States to buy a gun than it is to like get access to your own phone to install unsigned software.
- 04:36You go to Google and you say, "I want to install unsigned software."
- 04:38And now they're going to say, "Oh, whoa, hold on, buddy.
- 04:42uh you seem upset.
- 04:44Uh you should uh go home and think about this.
- 04:46Uh if you still want that unsigned software in 24 hours, then you can come back and talk to us.
- 04:54Fortunately, we have a workaround for all of that, which is the web.
- 04:58On the web, everyone can build whatever they want.
- 05:01And it turns out it's fine.
- 05:02It's not the security disaster that Apple and Google keep telling us would happen.
- 05:07So you can build whatever you want on the web but there's a different problem on the web which is that for the past uh 25 years of uh cloud architecture we've been running in the wrong direction.
- 05:21uh when you distribute a web app, you run it on your own server like put it on your server and then users send requests to your server where the one version of your app, the one um you know blessed version runs
- 05:37uh for every single user.
- 05:39And so that's convenient for developers.
- 05:41That's why we've done it is so the developer can make sure things stay updated and everyone's on the same version.
- 05:46But um it obviously means that users cannot customize their apps.
- 05:53So you know last year uh vibe coding comes along and we have all these vibe coding um platforms out there and the most of them are targeting web apps because that's the easy thing to target but they're all targeting this existing infrastructure
- 06:10which is actually like not the right way to do it.
- 06:14Um, we need something entirely different.
- 06:18And hence my point.
- 06:19Do you uh do you like how the word breaks kind of wiggles every now and then?
- 06:25That was uh that was something Claude put in there and it was so stupid I just had to keep it.
- 06:32Um, I want to know where in Claude's training data it uh it learned that you could make words wiggle to give them emphasis because like I you know I understand the red I understand the underline but uh the wiggle like I don't think that's that's from humans.
- 06:48I I think that's an AI original.
- 06:51[laughter]
- 06:53This this is ASI folks.
- 06:55Yeah, it's beyond my puny human brain's ability to comprehend.
- 06:59Um anyway, uh so you might be wondering at this point like who is this this guy who hasn't introduced himself up on stage um giving a Richard Stallman-esque rant about how we should have the freedom to modify our own software
- 07:14and what does he know about cloud infrastructure.
- 07:17So I'm Kenton Varta.
- 07:19I created Cloudflare workers.
- 07:21I started the project um back in 2017 when I joined Cloudflare.
- 07:25I am still the lead engineer today.
- 07:28um it now is uh you know it's a serverless application hosting platform.
- 07:32We have millions of developers.
- 07:33We serve trillions requests per day.
- 07:36But what I'm going to talk to you a little bit about today is uh sort of a side project I've been working on on top of workers which is um
- 07:46designed to is my exploration in how to uh uh solve this problem.
- 07:52So, uh, this thing you're looking at right now is actually a little app that I created in this platform.
- 07:58But, um, we're going to the the front page here.
- 08:04So, you have your your Vibe Code prompt.
- 08:07You know, these things are a diamond dozen.
- 08:09Um, we all seen this before, but I'm just going to put in a little prompt to make to show that it works.
- 08:13Uh, make a silly counter app.
- 08:17Silly Max it silly.
- 08:22All right, but I'm not actually gonna sit here and watch it.
- 08:25Oh no, it said error.
- 08:29Yep, the internet doesn't work.
- 08:31That's okay.
- 08:31That's not the most important part of my talk.
- 08:34So um so what I what I want you to understand about this environment is uh this is not like your typical vibe coding environment where you're deploying apps to a web page.
- 08:52This is um uh you need to think about more like uh like an office suite.
- 08:58So think about Google Docs.
- 08:59You open Google Docs, you have a bunch of documents, hundreds, maybe thousands of documents.
- 09:03You open one, you edit it, you share it with people.
- 09:07This is the same thing except instead of documents, you have gadgets.
- 09:11And each gadget is an application with code.
- 09:14They can all be different code.
- 09:15I have um I have an app here which is like a collaborative whiteboard app.
- 09:21Like this is a oneshot prompt.
- 09:24Um, I have a uh an app here which So, I get a lot of email in Spanish.
- 09:29It's a long story.
- 09:30I don't know Spanish, but I need help like filtering all the Spanish email.
- 09:34So, I made a little app to help me do that.
- 09:36Uh, a gadget.
- 09:37Um, I have a gadget to help me sort uh pull requests that I need to uh review on GitHub.
- 09:44And uh but those are, you know, things that I just like vibe coded from scratch.
- 09:51But we also have this concept over here of blueprints.
- 09:54And um a blueprint is someone made a gadget and they decided that it was useful and they took a a blueprint of it which is just taking the code exporting the code
- 10:04without the data which they can then share with someone else and then other people can uh instantiate gadgets from these blueprints.
- 10:12So um we have like a you know document editor app here, a combon board and um a slide builder.
- 10:19So like you know typical office apps uh I'm going to s so this this slide builder um was built by my colleague Philip here um who's a product manager at Cloudflare and of course these days all product managers are also prolific engineers
- 10:36um so he you know he vibed this in an afternoon I believe but uh if I instantiate this gadget I get this nice little slide deck um you know it has things I can edit it and so on.
- 10:48Yay.
- 10:49And if I shared it, it would well.
- 10:52So an important point here is that when I instantiate this app, it is only for one slide deck.
- 10:59If I want multiple slide decks, I make multiple instances of the gadget uh one for each.
- 11:04And the reason for that is that all gadgets are um sharable and uh you know you can collaborate with other people on them and the sharing model is implemented by the platform instead of by the app itself.
- 11:18So if I click up here, I get sort of a a share dialogue kind of like a Google Docs share dialogue.
- 11:23I can create a share link and send it to people.
- 11:25And uh because each gadget is just the one thing that you want to share, that means that the platform can implement the sharing model and the access control such that the gadget itself can't possibly get that wrong.
- 11:40So I'm going to go over to actually another instance of the same slides app.
- 11:44This is the um the slides I originally wrote for this talk, which yesterday I decided these slides were trash and I threw them all away and rewrote it.
- 11:55Um but the the reason they're bad is is entirely my fault.
- 11:58It's not Philip's fault.
- 12:00It's uh not the software's fault.
- 12:01Um but this this can still serve as an example uh to to demonstrate some of what you can do on this platform.
- 12:10So if I uh click on here, I can see the conversation.
- 12:13And you know, of course, I didn't edit the slides myself by hand.
- 12:16I asked the agent to make them for me, right?
- 12:19Um, and every app in this platform automatically integrates with agents so that you can do that.
- 12:26And so what I did is I gave Claude a link to this document, this Google doc where I had described all of the gadgets that I wanted or all the the slides that I wanted in my um
- 12:39in my presentation.
- 12:41And crucially though, this is the interesting point.
- 12:44I said, if you need uh if you need to add any new features to the slides app itself to support some of these slides, feel free to do so.
- 12:54And it did.
- 12:55Um Claude read all the code for the app and read my doc and said, "Yes, actually, let's see.
- 13:02Slide three needs a uh strikethrough formatting.
- 13:05That's not implemented."
- 13:06Um we can add that.
- 13:08Um, some of the slides require things to be centered.
- 13:11And you know, I guess Philip's design taste is too good for centering text.
- 13:16Uh, but my more pedestrian taste called for some centering.
- 13:20And that's okay.
- 13:21Cloud can add that.
- 13:23Um, more interestingly, slides uh five and six here.
- 13:27So, I asked for this like really crappy diagram of the cloud, right?
- 13:32And the the app um didn't support sort of like arbitrary diagrams.
- 13:38It supported, you know, uh box diagrams and arrows and such, but not an arbitrary drawing like this.
- 13:44And so Claude said, "Okay, that's okay.
- 13:46We can add a feature.
- 13:47We'll add a feature that allows uh you to insert a bunch of SVG.
- 13:52Just paste it into this box here.
- 13:54And now it becomes uh part of the slide."
- 13:56And now that's not very useful for any human, but it was perfectly useful for Claude who then generated the SVG.
- 14:03Now, at this point, you might be looking at this and saying, "That's a little scary.
- 14:07SVG can contain JavaScript.
- 14:10Uh, are there XSS bugs here?"
- 14:13And the answer to that is, uh, it doesn't really matter because of the way this environment is set up.
- 14:18So the UI that you see for the app here is running inside a null origin iframe sandbox um with content security policy set so that it basically cannot talk to anything any of the rest of the world can't access any cookies so on
- 14:35um the only thing it can do is post message to the parent frame and through that post message channel we set up a a captain web RPC uh session
- 14:47which forwards onto the server and all the way back to the server code for this gadget which is uh this code here which is written as a a durable object on Cloudflare workers
- 15:01and uh basically that means so so this this server code runs in a dynamic worker sandbox uh on the server side where it too is prevented from talking to any of the rest of the world.
- 15:13So now we've set up this environment where there's a vibecoded client and a vibecoded server.
- 15:17They can only talk to each other and produce the UI uh for the user.
- 15:23And so if you have an XSS bug, it actually doesn't end up mattering because these can't leak anything.
- 15:29Um they're prevented from doing so.
- 15:31And it basically there is no security bug you can have in this code that matters.
- 15:37Um, and that makes it safe to, you know, go and do things.
- 15:44So, uh, I, uh, there's a whole lot that I would like to talk about that I won't have time for here, unfortunately.
- 15:53So the um uh so there there like for instance the uh we created a whole system by which these apps can talk to external services in a safe way but I could give you know two more talks about that.
- 16:11Um we created um there's a lot of stuff here.
- 16:18the the points that I want to make in the time that I have left though is so everything you see here is uh is built on everything except for the LLM
- 16:28is built on Cloudflare workers.
- 16:30Um a lot of people don't know this but you can actually build complex apps on workers.
- 16:35There are no containers involved here.
- 16:37There's just dynamic workers.
- 16:39There are no there's no database involved.
- 16:41It just uses durable objects.
- 16:44Um, and furthermore, all of this is actually running locally on my laptop, which is why it doesn't matter that uh the internet didn't work because uh so this is all running on
- 16:54workerd, which is our open source runtime.
- 16:57A lot of people don't know this.
- 16:58The Cloudflare workers runtime is open source.
- 17:01You can self-host it.
- 17:03And I'm excited about that because we have in here a uh Home Assistant uh connector and a Spotify connector.
- 17:11And I want to run this in my basement and uh use it to do home automation tasks.
- 17:17Um so
- 17:19[sighs]
- 17:20this is where though I have to give a little bit of an apology.
- 17:23Um so a couple of months ago when I submitted the the uh the proposal for this talk.
- 17:30This was like a side project I was working on and the plan was I was going to come here and I was going to present it and then I was just at the end of the talk going to ye it onto GitHub
- 17:39so that everyone could go and download and play with it themselves.
- 17:43In the last couple of weeks um there's been a lot of excitement inside Cloudflare and this has become a more serious project.
- 17:50And so last Thursday Dne our CTO pulled me uh into a room and said Kenton I don't think you should yeet this.
- 17:59I don't think this is yeet material.
- 18:01I think we need a uh we need to be more careful and disciplined and intentional about how we release this.
- 18:08So, let's hold it off for a few weeks.
- 18:09And I was pretty upset about that because I promised in the abstract that I was going to open source it, but sorry.
- 18:17Uh that's not happening today.
- 18:18It will happen soon though.
- 18:21Um, and I wish the silly counter worked because GPT makes some silly counters, but um oh well, it's not a big deal.
- 18:31And that's uh that's all I got.
- 18:34[applause]
- 18:51[music]