Vercel Gave Up On Edge

big news y'all versel just gave up on edge not clickbait I didn't think this day would come but the more I've thought about it the more it kind of makes sense before we go too deep into this giant Le Rob tweet I want to do a little bit of Story Time believe it or not I actually built one of the first big projects going all in on app router server components for sell and Edge and it was upload thing when you navigate upload thing most of those routes are still being served on edge they're a regional Edge which we'll talk a little bit about later but I know I was first because it didn't really work initially we filed a bunch of issues and they got fixed the weekend before launch which was also the

weekend before their big chip week at the time and it ended up coming out really good and I've been really happy with the performance we've had on edge even though there have been a lot of catches random packages not working random dependencies having weird behaviors we don't expect generally annoying things to deal with as a developer when you install a package and it works on your machine and then you ship it up to the server you expect it to work there and that's not always been the case when using Edge there's also weird issues you have to deal with around the size of the bundles that can be shipped to Edge they're limited to if I recall 1 megab as such a lot of people just kind of want to use but the cold

start problem with node means that it takes a long time to see something we solved that by moving to Edge they've solved it different ways and I want to go over those ways and how we can move past Edge to make sure our users still get the best experience while also making sure that our Dev experience is consistent so yeah let's take a look at this tweet and then dive in so versell reverted all Edge rendering back to node.js you wanted to correct the record here is it's something I've advocated for in the past and share what I've learned since then also the edge naming has been a bit confusing so let's clear that up here as well oh no are we going

to start the edge runtime thing again yeah let's start with that what is Edge this question seems very simple sadly it is not I very much wish I could give you a quick Edge is this but Edge generally refers to two specific things Edge location which is the main one people think of which is that rather than a server running in a specific location like if we have the world and we have a random node in this world we'll say this is West 2 make the font smaller so this is usable so we have this West two

server and we have a user Make user squares and this user lives really close to West two so I'm located close to the server I send a request I get a response the further away you go the worse that performance gets and that's not great especially if you're waiting to go from like the empty white page of loading to actually seeing your site this just isn't Pleasant so Edge is the idea that maybe instead of these massive servers we should have a lot of much smaller ones so instead we just have these little tiny servers all over the place

like literally thousands of them in thousands of different places and now your location doesn't really matter because you'll almost always be near one of these Solutions so that's the edge location is the idea that your traffic resolves to the thing that's close to you instead of resolving to some crazy far away server that you have one of somewhere in the world there's a lot of catches to Edge location like where is your database if I'm trying to make a connection to let's say I'm in like Australia or some and I connect to this and it can immediately respond on cool but what if

this has to go to my database and what if my database is all the way over here then this guy has to go to here but then has to go back and then finally you can send the response to the user this sucks I want to be very clear like as as cool as it is that your server is closer to the user if your database is somewhere else the benefits go away very quick now you're just adding a hop for almost no reason there are benefits here though especially once you introduce things like streaming because if on this Edge I can start sending a response immediately and then wait for the server to send in

the rest using suspense things get really magical if you haven't already taken a look at my tutorial I recommend it tldr in my tutorial it is a super minimal Gallery app for taking a look at a bunch of images and uploading them so if you're curious what I'm referring to here right now this whole page will block until all of the images have loaded because this component renders images the component and then images blocks by waiting for get my images so this whole page comes down as one thing if I wanted to get the shell and all these other pieces first before images was done it's actually pretty simple