Use Next.js advanced features on Skyversal without any additional configuration. Discover how Image Optimization, Static Site Generation (SSG), Incremental Static Regeneration (ISR), and Middleware support works.
Modern Next.js applications are more than just React pages. They optimize images, statically generate some pages at build time, and render others on demand. They can also process incoming requests before they reach the application using Middleware.
Next.js runs these features in a standard Node.js runtime environment. Skyversal automatically prepares this environment together with the Nixpacks build infrastructure. You don't need to worry about the Nginx reverse proxy configuration, PM2 process manager setup, or additional system package management that may be required on a VPS. You just develop your application.
Which Architecture is Right for Me?
Choosing the right architecture for your project directly impacts performance and developer experience.
| Use Case | Recommended | Why |
|---|---|---|
| Blog | SSG | Content rarely changes, static HTML is fast |
| Documentation | SSG | Low update frequency, maximum speed |
| Marketing Site | Static Export | No Node.js needed, maximum speed via CDN |
| News Site | ISR | Content updates frequently, full SSR not needed |
| E-Commerce | ISR | Product data updates periodically |
| Dashboard | SSR | Real-time data, user-specific content |
| Landing Page | Static Export | Node.js not even required, minimum latency |
| SaaS Panel | SSR + Middleware | Auth, authorization, and dynamic data combined |
1. Image Optimization (next/image)
next/image is one of Next.js's most important performance features. It is supported by default on Skyversal — no additional configuration required.
What does Skyversal do automatically?
- Resizes images to the requested dimensions
- Preserves Lazy Loading support
- Generates responsive images (adapted for different screen sizes)
- Can automatically use modern formats like WebP or AVIF on supporting browsers
- Automatically applies Cache-Control headers
💡 Tip: If you are working with large volumes or high-resolution images, the sharp package can improve image processing performance: npm install sharp
2. Static Site Generation (SSG)
Statically generated pages are prepared at build time and served to the user as ready HTML. If you use output: 'export' in your next.config.js, Skyversal automatically detects your application as a static site.
If your content is the same for every user (like a blog, documentation, or company site), SSG is usually the fastest and most cost-effective option. HTML files generated at build time can be served directly from a CDN.
In this case:
- No Node.js server runs
- HTML files are served directly
- No cold starts
- Very low latency via CDN
Ideal for:
- Landing Pages
- Blogs
- Documentation sites
- Portfolios
- Company websites
// next.config.js
module.exports = {
output: 'export',
}3. Incremental Static Regeneration (ISR)
You may not want some pages to be regenerated after every deploy. With Next.js ISR, pages are automatically regenerated in the background after a time interval you define. As content updates, users continue to see the previous version. Once the new version is built in the background, it is automatically served going forward.
With this setup, your content updates at your specified interval, so users always see fresh pages:
// app/blog/[slug]/page.tsx
export const revalidate = 300; // Revalidate every 5 minutesSkyversal fully supports the Node.js runtime required for ISR. No additional server configuration is needed.
4. Middleware
Middleware is the first layer that runs before a request reaches your application. Since it runs before your application code, routing, security, and authorization tasks can be managed centrally. Your middleware.ts file is automatically detected and the Next.js execution model is preserved.
Scenarios that work seamlessly on Skyversal:
// middleware.ts
import { NextResponse } from 'next/server'
export function middleware(request) {
const token = request.cookies.get('auth-token')
if (!token) {
return NextResponse.redirect(new URL('/login', request.url))
}
}5. When Might Custom Configuration Be Required?
Most Next.js projects require no additional settings. However, you may need to customize Build & Run settings in the following scenarios:
These settings can be easily changed from the Build & Run section in your Skyversal dashboard.
Skyversal Next.js Feature Support
| Feature | Status |
|---|---|
| App Router | ✅ Supported |
| Pages Router | ✅ Supported |
| next/image | ✅ Supported |
| Image Optimization | ✅ Supported |
| SSG | ✅ Supported |
| ISR | ✅ Supported |
| Middleware | ✅ Supported |
| Route Handlers | ✅ Supported |
| Server Actions | ✅ Supported |
| Static Export | ✅ Supported |
| AVIF / WebP | ✅ Supported |
| Edge Runtime | 🔜 Coming Soon |
Frequently Asked Questions
Do I need to install Sharp for Image Optimization?
Not required for most projects. However, if you're working with large volumes or high-resolution images, the sharp package can improve image processing performance. Skyversal automatically detects Sharp when present.
Is ISR supported?
Yes. Next.js projects using revalidate are fully supported on Skyversal. No additional configuration is needed.
Does Node.js run when I use output: "export"?
No. For projects using static export, the generated static files are served instead of a Node.js application. This results in faster load times and lower resource consumption.
Does Middleware Authentication work?
Yes. Your middleware.ts file is automatically detected and executed. JWT validation, cookie control, and session management scenarios require no additional configuration.
Everything is Ready!
You can now confidently use Next.js's most powerful features on Skyversal. From Image Optimization to Middleware, SSG to ISR — advanced Next.js features are supported without any additional configuration.