4 years of Next.js Lessons Learned
summary
Four years of Next.js evolution presented as specific milestones: initial n4 template experiment rewrites into a file-based React pages system, adoption by large sites including TikTok, and a shift to a hybrid static+SSR model with mid‑2019’s automatic static optimization and May 2020’s static generation features. Concrete APIs are named: getStaticProps/getStaticPaths/getServerSideProps, build outputs HTML plus lambda functions so pages choose static CDN delivery or per-page server rendering, and the platform Vercel automates worldwide caching and deployment for both static and dynamic sites.
AI-written summary · about
chapters (30)
- 0:00Intro
- 0:304 years of Next.js: lessons learned What Vercel has learned building a React framework for everyone
- 0:49React at a Vue.js conference?
- 1:46choose your next framework
- 2:10build your next framework
- 2:42Why Next.js?
- 3:24Next.js and Vue
- 7:06was amazing to build our pages with
- 7:53Lesson: dogfood your project
- 8:24Wait. There's more...
- 9:15Vue was a huge inspiration to n4
- 9:56PHP-like templates with inline JS
- 10:57Collocated (SFC)
- 12:04So, what happened to n4?
- 12:33Create Apps with No Configuration
- 12:59Dan Abramov enters the chat
- 15:56We ditched templating to play better with the React ecosystem
- 16:29Lesson: be adaptible
- 19:40Lesson: big markets are big
- 23:14Lesson: stick to your guns
- 23:33Lesson: stick to the physics
- 23:48One small problem: servers
- 25:12Static sites: serverless, cheap, reliable, scalable
- 25:44No computation Computation
- 26:20Automatic CDN caching and purging Fiddling with Cache- Control
- 26:53Edge Region
- 27:18Thus, Next.js became Hybrid
- 27:40First, via automatic static optimization
- 30:58Lesson: learn from everyone!
- 31:24Lesson: give back
related talks
27mAn introduction to Next.js and what's to come in 2021
30m50 shades of React rendering with Next.js
39mKeynote on Next.js and Serverless future
30mWhen NOT to Use Next.js
27mSSR & SSG in NextJS
36mBuilding Static Sites with React
36mNext.js by Example
45mNext js: Build a State of the Art E commerce in Fullstack React