After my foray into serveless-nextjs I happily used it for personal projects for the last few years. However, Next.js moves fast and the project seems to have stalled, so I had to look into alternatives.
I've already used Cloudflare as a CDN and domain host, so I was happy to find Next-on-pages, which is a way to run Next.js serverlessly on Cloudflare Pages.
Setting up a new test project is easy, using the guide and specifically just running:
npm create cloudflare@latest test-app -- --framework=next
The interactive questions take are of everything and result in a nice development experience.
However, porting an existing site/app was a bit more of a hassle.
First I had to upgrade to the latest next.js release, since the one I'd been using with sls-next was too old. Luckily there wasn't anything too bad.
Next step was replacing sls
with @cloudflare/next-on-pages
, rewriting next.config.js
and changing the runtime from serverless to edge. The last was a bit confusing, since documentation never spelled out how different things are between the app and pages routers:
The only way I managed to make work was using:
export const runtime = 'experimental-edge'
On every page.
After many an invocation of npx @cloudflare/next-on-pages
I managed to make everything build. (Note! You need a "build" command in package.json which only runs next build
, mine was left over from sls-next and did... other things.) Deploying was easy using Cloudflare Dashboard
Once everything was provisionally working I of course wanted to use all the new features from next.js so it was another porting operation from pages/ to app/. Luckily that's reasonably well documented.
All in all my experience is so far positive. Deployments are especially pleasant: every git push is built and deployed to a temporary url and a bot posts status reports and links to pull requests.
OTOH: next.js caching is increasingly confusing with all the new features.