I have a question: When I use next-on-pages for my NextJS app. I have some API Route Handlers in my

I have a question: When I use next-on-pages for my NextJS app. I have some API Route Handlers in my next app. is it correct that next-on-pages will create a seperate worker for each API route handler when I deploy my nextjs app to Pages using next-on-pages?

Tthanhle I have a question: When I use next-on-pages for my NextJS app. I have some API R...

Hello, I’m Allie!•3/27/24, 8:46 AM

No. next-on-pagesnext-on-pages will bundle them into a single file, and then deploy it as a single entity to Pages

TTaylor So I was interested in using Hono as my api handler instead of using nextjs but ...

Pat Branchaud•3/27/24, 11:53 AM

I asked that previously, you can read Dario’s answer it’s not needed with next-on-pages

HHello, I’m Allie!No. `next-on-pages` will bundle them into a single file, and then deploy it as a...

thanhleOP•3/27/24, 1:30 PM

bundle everything into a file and seperate, do you think it will affect the performance?

Tthanhle bundle everything into a file and seperate, do you think it will affect the per...

Hello, I’m Allie!•3/27/24, 1:31 PM

No, since none of the code is actually executed unless that route is triggered

thanhleOP•3/27/24, 1:37 PM

thank you

HHello, I’m Allie!No. `next-on-pages` will bundle them into a single file, and then deploy it as a...

Dario•3/27/24, 2:19 PM

it's not all bundled into a single file but yeah all into a single worker

DDario it's not all bundled into a single file but yeah all into a single worker 🙂

Hello, I’m Allie!•3/27/24, 2:20 PM

Oh interesting, it does dynamic imports?

DDario it's not all bundled into a single file but yeah all into a single worker 🙂

thanhleOP•3/27/24, 2:21 PM

Hi Dario. do you think if I use Nextjs API route handler or I write and deploy the seperate worker for each APi route handler. do you think which one is more performance and cost-saving.

HHello, I’m Allie!Oh interesting, it does dynamic imports?

Dario•3/27/24, 2:22 PM

yes!

https://github.com/cloudflare/next-on-pages/blob/main/docs/technical/lazy-loading.md

GitHub

next-on-pages/docs/technical/lazy-loading.md at main · cloudflare/n...

CLI to build and develop Next.js apps for Cloudflare Pages - cloudflare/next-on-pages

Tthanhle Hi Dario. do you think if I use Nextjs API route handler or I write and deploy t...

Dario•3/27/24, 2:25 PM

a separate worker for each api route handler seems very very cumbersome to maintain, and it would likely incur more cold starts than a single next-on-pages worker

so I would not go that route personally

performance-wise it should be practically almost the same (besides the issue mentioned by @juanferreras above (https://discord.com/channels/595317990191398933/1135899572141568050/threads/1221910415169294518), which can add some minor slight slowdowns

)

cost-saving I can't imagine there being any difference

Discord

Discord - A New Way to Chat with Friends & Communities

Discord is the easiest way to communicate over voice, video, and text. Chat, hang out, and stay close with your friends and communities.

thanhleOP•3/27/24, 2:31 PM

Thank you very much Dario

Dario•3/27/24, 3:27 PM

no problem

Taylor•3/27/24, 4:15 PM

Hello, so I'm trying to integrate Turso DB and I just wanted to ask about best practices as all the examples I've found are really specific how to setup an individual worker with turso. I know functions are workers under the hood but I guess I'm getting a bit confused of the best practice to fetch data. Should I be creating api endpoints in the /api folder OR /functions? or _worker ?

James•3/27/24, 4:53 PM

If you want to use @cloudflare/next-on-pages@cloudflare/next-on-pages, your api endpoints should Next.js API routes

Taylor•3/27/24, 5:35 PM

perfect, thanks

stillmotion•3/27/24, 9:48 PM

hi! Is there a way to get next-on-pages to generate source maps of its webpack files? ie. __next-on-pages-dist__/webpack/62d6966c94b522734ceb09853b489431.js__next-on-pages-dist__/webpack/62d6966c94b522734ceb09853b489431.js. I can only seem to generate sourcemaps for the layer before it, ~/_next/static/chunks/1249.d9777ee89355e4b6.js~/_next/static/chunks/1249.d9777ee89355e4b6.js, which is not reported in stack traces when an error is thrown.

Sstillmotion hi! Is there a way to get next-on-pages to generate source maps of its webpack f...

Dario•3/27/24, 11:42 PM

no, sorry the source maps next-on-pages story is unfortunately very weak at the moment

stillmotion•3/27/24, 11:43 PM

Crying, but James made a good case why https://github.com/cloudflare/next-on-pages/issues/724

GitHub

[⚡ Feature]: Generate source maps · Issue #724 · cloudflare/next-on...

Description Unclear to me if this is supported or not at the moment, but wanted to flag it in case not. My error handler, Sentry, needs source maps to map the minified stacktraces to my repo source...

Dario•3/27/24, 11:44 PM

yes that's a good summary of it

Dario•3/27/24, 11:45 PM

I can't really say that it'd be impossible, but most definitely quite the effort

stillmotion•3/27/24, 11:47 PM

Most of my next js endpoints are a separate trpc package, so I think I’ll just wrap them in a separate worker and point my app to a separate subdomain to improve error reporting (I have mobile clients too using the next APIs)

Taylor•3/27/24, 11:47 PM

So, I'm wanting to use Drizzle + Turso DB. Are there any specific gotchas I need to be aware of with cloudflare pages or can I just initialize the db, query it in the api route as if it was a next app NOT on pages?

Dario•3/27/24, 11:48 PM

I can appreciate that not having it is a significant impairment for development... maybe we should investigate it more in the future, I would likely not try to do that before we start adopting the turbo output (after vercel buildvercel build supports it, that's it), as that will most likely force us to make changes in how we build the worker, so we wouldn't want to have to (try to) solve the source map twice

stillmotion•3/27/24, 11:50 PM

Yeah it’s a significant issue for my use case. Pretty hard to debug production at the moment. Also not having Logpush on pages is hard.

Wu•3/28/24, 1:38 PM

it seems there is problem on deployment today, first i got "Deployment complete! Take a peek over at https://*****", but when i visit the url, I got "Nothing is here yet. If the project exists, it may not be ready yet. Please check back later". The depolyment is failed without any detail information

vamshinenu•3/28/24, 4:40 PM

got a silly question, that i dont see any answer, in the web, why there is a static sites, everywhere, on the cloudflare, pages, does this not work if i have a SAAS product that will interact with workers, and generate SSR page.? its in sveltekit btw im confused,

Vvamshinenu got a silly question, that i dont see any answer, in the web, why there is a *st...

Isaac McFadyen•3/28/24, 5:03 PM

There's 2 main types of sites (and some are a combination of both):

Client side rendered, also known as CSR. This is raw HTML/CSS/JS. The browser uses JavaScript to "hydrate" the content of the page, or loading things on the page (i.e. like an ecommerce store with filters for products or a counter incrementing when the user clicks the button).
Server side rendered, also known as SSR. In this case the server (Cloudflare Pages in this case) renders out the HTML based on the request, so that by the time the response arrives at the browser it's already rendered and complete. Pages only supports SSR with JavaScript, not with any other server like C#, and only with specific frameworks like SvelteKit or Astro.

In the case of SvelteKit, it's both static and SSR'd. The server (Pages) renders out the HTML but then you can modify the HTML or change the page after it's already reached the client, like for example a counter.

Isaac McFadyen•3/28/24, 5:05 PM

Another example would be Amazon. You'll notice that as soon as you load the page the products are visible (SSR) but then when you change a filter the products change without a full page reload (with JavaScript on the browser).

vamshinenu•3/28/24, 5:05 PM

so bascially no client side js right...?

Vvamshinenu so bascially no client side js right...?

Isaac McFadyen•3/28/24, 5:06 PM

Client side JS is fully possible.

Isaac McFadyen•3/28/24, 5:06 PM

SvelteKit will automatically convert your .svelte.svelte files to JS for you though.

Isaac McFadyen•3/28/24, 5:06 PM

So you just write Svelte as normal.

Isaac McFadyen•3/28/24, 5:07 PM

A static site just means not server-side rendered. It can still be interactive and have client-side JS.

vamshinenu•3/28/24, 5:08 PM

so basically, a full*** sveltekit app should work on page and all the apis goes into workers... and thanks

Vvamshinenu so basically, a full*** sveltekit app should work on page and all the apis goes ...

Isaac McFadyen•3/28/24, 5:08 PM

Exactly, but even beyond that, SvelteKit will automatically convert your endpoints and other server stuff to Pages Functions for you (which is basically Workers).

vamshinenu•3/28/24, 5:08 PM

if thats the case, i dont know why people chosing vercel yikes

Isaac McFadyen•3/28/24, 5:08 PM

So you don't need a separate Workers API. It's of course possible, but it's optional because Pages will do it for you.

vamshinenu•3/28/24, 5:08 PM

really

vamshinenu•3/28/24, 5:09 PM

wow,,... thats even easier...

vamshinenu•3/28/24, 5:09 PM

but question, again, the bandwith is unlimited are you kidding me....

vamshinenu•3/28/24, 5:11 PM

well, ummm like if some one just need to use workers, that creates a sveltekit app with nothing on the routes, but only apis... does that mean he gets unlimted requests tho NotLikeThis

Vvamshinenu well, ummm like if some one just need to use workers, that creates a sveltekit a...

Isaac McFadyen•3/28/24, 5:11 PM

Yes, anything static will be unlimited requests for free.

vamshinenu•3/28/24, 5:11 PM

or pages will make them as workers, for us...

Isaac McFadyen•3/28/24, 5:12 PM

You might want to use @sveltejs/adapter-static@sveltejs/adapter-static to make sure nothing server-side is generated though.

vamshinenu•3/28/24, 5:12 PM

yep already have everything setup....

Isaac McFadyen•3/28/24, 5:12 PM

(rather than the default @sveltejs/adapter-auto@sveltejs/adapter-auto)

vamshinenu•3/28/24, 5:12 PM

i should say bye bye vercel poggies

codewansh•3/28/24, 5:33 PM

Hey Guys, I am stuck on this issue while using next-on-pages next-dev module, not able to get local bindings working, (I am currently in process of using t3 stack with next-on-pages & d1 as database)

Screenshot_2024-03-28_at_11.01.35_PM.png

stillmotion•3/28/24, 6:41 PM

Is it possible to get a flag like wrangler dev's --remote--remote on the next.js dev server? Doing any sort of integration testing with R2 bindings, for example, is really hard at the moment.

James•3/28/24, 6:42 PM

Afraid not, the bindings in next dev are emulated using miniflare, so it's local only

I have a question: When I use next-on-pages for my NextJS app. I have some API Route Handlers in my

Similar Threads

Similar Threads

Similar Threads