This page is pre-rendered at build time with optimized static CSS. All styles are computed and embedded during the build process for maximum performance.
All CSS calculations done at build time
Minified CSS with unused styles removed
Static assets served from edge locations
quia et suscipit suscipit recusandae consequuntur expedita et cum reprehenderit molestiae ut ut quas totam nostrum rerum est autem sunt rem eveniet architecto
est rerum tempore vitae sequi sint nihil reprehenderit dolor beatae ea dolores neque fugiat blanditiis voluptate porro vel nihil molestiae ut reiciendis qui aperiam non debitis possimus qui neque nisi nulla
et iusto sed quo iure voluptatem occaecati omnis eligendi aut ad voluptatem doloribus vel accusantium quis pariatur molestiae porro eius odio et labore et velit aut
ullam et saepe reiciendis voluptatem adipisci sit amet autem assumenda provident rerum culpa quis hic commodi nesciunt rem tenetur doloremque ipsam iure quis sunt voluptatem rerum illo velit
repudiandae veniam quaerat sunt sed alias aut fugiat sit autem sed est voluptatem omnis possimus esse voluptatibus quis est aut tenetur dolor neque
📁 .next/ ├── 📁 static/ │ ├── 📄 chunks/ │ │ ├── main-[hash].js # Core React bundle │ │ ├── webpack-[hash].js # Webpack runtime │ │ └── pages/ssg-[hash].js # Page-specific code │ └── 📄 css/ │ └── [hash].css # Optimized styles ├── 📁 server/ │ └── 📄 pages/ │ └── ssg.html # Pre-rendered HTML └── 📄 build-manifest.json # Asset mapping
✅ Zero runtime processing - Everything pre-computed at build time
const staticColors = {
primary: '#8b5cf6',
secondary: '#a855f7',
accent: '#c084fc',
gradient: 'linear-gradient(135deg, #8b5cf6 0%, #a855f7 50%, #c084fc 100%)'
};
// Generated at build time:
.static-gradient {
background: linear-gradient(135deg, #8b5cf6 0%, #a855f7 50%, #c084fc 100%);
animation: staticGlow 4s infinite;
}/* Minified and optimized */
.static-gradient{
background:linear-gradient(135deg,
#8b5cf6 0%,#a855f7 50%,#c084fc 100%);
background-size:200% 200%;
animation:staticGlow 4s ease-in-out infinite
}
@keyframes staticGlow{
0%,100%{background-position:0% 50%}
50%{background-position:100% 50%}
}CDN static serving
Immediate content
All content ready
Fast hydration
| Aspect | Build Time | Runtime |
|---|---|---|
| Data Fetching | ✅ API calls made | ❌ No API calls |
| CSS Processing | ✅ Optimized & minified | ❌ Pre-processed |
| HTML Generation | ✅ Complete HTML created | ❌ Static file served |
| Server Load | ⚡ High (one-time) | ✅ Minimal |