Hey there, I am Rishi and I'll be talking incremental incremental static regeneration, ISG and ISR layer zero. More about myself I am a solutions engineer at Layer Zero by limelight and I'm also a storyblock ambassador, so feel free to reach out to me in case you're trying any of them. Now let's look at what you can expect from this talk. I'll be covering what is ISD, the benefits of ISG, the drawbacks and how you can implement ISG with Nox, JS and layer Zero. But first, what is Layer Zero? Layer Zero is an all in one Jamstack platform thats you can use to develop, deploy, preview and monitor your front end. Our jam is to bring large and complex websites that serves up to millions of pages into subsecond loads. Now let's look at what is ISG first introduced by next JS developers. Incremental static generation helps you create pages after you have built your site, and it's kind of best of both the worlds because you only create pages that you need but still get that static performance on your dynamically built pages. But the issues that came with next JS ISR is it is dependent on the platform you're hosting your app, and it also requires an integration within the framework. Some platforms still support ISG only with NextJs, but with Layer Zero's general approach you can do ISG with any framework. Now let's look at an example of ISG. This is an official example for next JS, named as static tweet, in which you can create pages based on Tweet ID. With fallback true, you can choose to show a loading placeholder while the data is being fetched. For the first time a user visits an unbuilt page, but in the background that page after is rendered is cached and the data response for that particular page is also cached so that the next time a user visits the same page, they get to see that static build of the page. The other way to do IST is by fallback blocking, which is the preferred method in which if a user visits an unbuilt page, the request is first server side rendered. In this case the data is fetched on the server and then the build page is sent to the client, but the first user is bound to see some loading before the request gets fulfilled. But the next visits would still get that static super fast response. Now let's look at some benefits. With ISD you can create pages on demand, and that's pretty much ISD right? But with that you don't need to redeploy your website anymore. And now you don't need to pre render your pages because you can create pages on demand. With layer zero you can choose to keep cache or invalidate that between deployments. Or if you want to invalidate a specific page, use layer zeros console or the rest API to invalidate cache based on regular expressions. Now let's look at some drawbacks. The first user is bound to see a fallback, whether it's in term of a placeholder or it's being waiting for a request to get fulfilled. And some users might run into stale data. And with ISG you can break immutability. It's kind of dependent on the platform you are hosting your app onto. With layer zero you can choose into opt but of preserving the cache between deployments. So let's look at implementing incremental static generation with nastiers and layer zero. So first let's see that live in action. This is example we have prepared for next year. We chose with static tweet and I prefer medium so I built it within a medium example and now let's pick up a random medium handle. Let's copy this and we just need the user handle in here. So let me pick up this interrupt right and I'll hit this. And this does two things. First, it fetches the data JSON for this page which contains the data title items, the blogs and renders the page. Another thing is that it requests the same page again so that it's cached on the edge. And the next visits see those see the same page super fast. And to demonstrate that I'll reload the page and let's look at some timing. So the timing of this pages was 29 milliseconds and this is a whole lot faster. And in the preview you see that this page is server side render and sent statically that you have looked at ISD. With nux live in action, it's time for the steps. So the first step is to set up API routes with Nux and you can do it by using their server middleware property in nuxtjs config. You can link it to a custom Express server and use that for data fetching. The NextJs step is to set up dynamic pages in nuxtjs and that can be done by just saying pages blog, underscore, slug view and you're done. For data fetching I use async data which will either block the client side navigation or will server side render the request. So that the users only see the page when it's built. With layer zero deployment you get access to can environment variable known as API URL, which you can use to server side fetch the data the next step, and the most critical one in here, is to fetch the same page again when it's mounted. This ensures that the page is built on the edge and is ready to be served staticlike for the future visits. And the last step is to configure layer zeros Edge Js. So for example, you're visiting blog Shishir gen that falls under blog's dynamic username and it will be cached on the edge for an error and the data on the page will be revalidated per second. While it will not be cached on the browser and it will be served from a static folder, and in case it's not there on the edge, it renders it with the app. So for the first time it renders it with the app, but in case you're visiting for the next time it will serve it from the starting. And what do I mean by render with the app is that layer zero will go with nuxtjs and say please render this page for me so that I can save this for future requests. You can follow the same procedure by caching and evaluating the data for the API routes. This is the link for the example and you might want to take a look at that. I'm so excited to inform you that nasty beta is out and they will be soon, including incremental static creation with Naxas. Thank you for having me.