I think you're probably overly worrying about size, I have an astro react site + others just plain r

I think you're probably overly worrying about size, I have an astro react site + others just plain react and many internal/public sites of ours are react which all are good

SSR or CSR you should be fine with proper dependency management and tree shaking you should be good.

You can split into multiple Workers though, if it makes sense for you to do that then I'd say go ahead

ethereon•8/29/24, 7:32 PM

I would prefer to stay as 1 repo and tightly couple the logic together

WWalshy I think you're probably overly worrying about size, I have an astro react site +...

ethereon•8/29/24, 7:33 PM

I'm still kind of newish to web dev so by dependency management you mean like what goes in regular dependencies vs devDependencies right?

Eethereon I'm still kind of newish to web dev so by dependency management you mean like wh...

Hello, I’m Allie!•8/29/24, 8:08 PM

More that you only add dependencies you actually need

datashaman•9/1/24, 3:30 PM

I have a NuxtJS project hosted on Cloudflare Pages. I have the need for an advanced mode Worker function (it requires access to the Stream API). I've created the _worker.js file with the required code. My problem is this: where do I put the file in my source repository for it to be deployed and compiled into the pages code? I see mention of the _worker.js being noticed in the output folder (in deployment logs). But... nothing works, function isn't called, the route I expect it to handle returns a 404...
I've tried the root of the repo and putting it into public. Neither work.

Ddatashaman 👋 I have a NuxtJS project hosted on Cloudflare Pages. I have the need for an ad...

Hello, I’m Allie!•9/1/24, 5:24 PM

When using #next-on-pages, you have to use Next’s API routes, you can’t use Functions yourself

HHello, I’m Allie!When using #next-on-pages, you have to use Next’s API routes, you can’t use Func...

datashaman•9/1/24, 5:43 PM

i went for a beer and realized that the nuxt adapter (or whatever) must be using _worker.js to do its work. I remember seeing a whole _worker.js/ folder being generated. So either I need an escape hatch in Nuxt, I need to change frameworks, or I must create a separate worker which does the dirty work. Thanks for the reply! I think I know how to proceed now.

Hello, I’m Allie!•9/1/24, 6:23 PM

Oh, Nuxt

Hello, I’m Allie!•9/1/24, 6:23 PM

Oops, sorry

Ddatashaman i went for a beer and realized that the nuxt adapter (or whatever) must be using...

Hello, I’m Allie!•9/1/24, 6:24 PM

Wait, remind me again why you need Advanced Mode?

HHello, I’m Allie!Wait, remind me again why you need Advanced Mode?

datashaman•9/1/24, 7:06 PM

i am streaming OpenAI responses from AssistantStream, reflecting them into a ReadableStream to give to the browser.
this code works fine on local, but when I run it via Cloudflare, the response given back doesn't seem streamy. Contains

[Object object]

[Object object]

response instead of doing the SSE thing.
so i reckon something in the way nuxt works or in the marshalling of the events is not working correctly.
my read of the docs led to the mention of Stream API use in Page functions which mentions that it only works in Advanced Mode.
https://developers.cloudflare.com/workers/runtime-apis/streams/#common-issues

Ddatashaman i am streaming OpenAI responses from AssistantStream, reflecting them into a Re...

Hello, I’m Allie!•9/1/24, 7:20 PM

Am I missing something? That just says the Request context, not specifically Advanced Mode

HHello, I’m Allie!Am I missing something? That just says the Request context, not specifically Adv...

datashaman•9/1/24, 7:25 PM

the way i read it is it can only be run inside a fetch handler function, which you can only do in advanced mode.
without advanced mode it's /functions based routing which does not support streaming? idk...

Ddatashaman the way i read it is it can only be run inside a fetch handler function, which y...

Isaac McFadyen•9/2/24, 12:46 AM

Functions based routing is still inside a

fetch

fetch

handler.

Isaac McFadyen•9/2/24, 12:47 AM

They just say that to mean that you can't do it outside of the fetch handler, like in the global scope. But a Nuxt API route should be inside the

fetch

fetch

handler generated internally by Pages.

IIsaac McFadyen They just say that to mean that you can't do it *outside* of the fetch handler, ...

datashaman•9/2/24, 3:51 AM

thanks for the help, I managed to get it working with a server route!

jjjrmy•9/3/24, 9:26 PM

if I'm getting this error, what should I do?

Cannot bundle Node.js built-in "crypto" imported from "../node_modules/oauth/lib/oauth.js". Consider disabling ssr.noExternal or remove the built-in dependency.

Cannot bundle Node.js built-in "crypto" imported from "../node_modules/oauth/lib/oauth.js". Consider disabling ssr.noExternal or remove the built-in dependency.

I'm using Astro, if I add

crypto

crypto

in my

vite.ssr.externals

vite.ssr.externals

, then it doesn't error on build but then says the export is missing when I try to use it.

jjjrmy•9/9/24, 10:34 PM

[commonjs--resolver] [plugin vite:resolve] Cannot bundle Node.js built-in "util" imported from "../node_modules/knex/lib/dialects/sqlite3/index.js". Consider disabling ssr.noExternal or remove the built-in dependency.

[commonjs--resolver] [plugin vite:resolve] Cannot bundle Node.js built-in "util" imported from "../node_modules/knex/lib/dialects/sqlite3/index.js". Consider disabling ssr.noExternal or remove the built-in dependency.

jjjrmy•9/9/24, 10:34 PM

https://blog.cloudflare.com/more-npm-packages-on-cloudflare-workers-combining-polyfills-and-native-code/

Samantas5855•9/13/24, 5:11 PM

is rust more performant than js for pages functions?

James•9/14/24, 12:31 AM

It depends what kind of work you're doing, but generally not for most things, no. Workers (and therefore Pages) run V8, so there's always going to be some minor overhead when running anything other than JS.

James•9/14/24, 12:31 AM

For most things, that overhead will be minimal, and Rust can make some more CPU-heavy operations easier to manage. But for your average web request/response handling, I'd stick with JS unless you have a good reason to use Rust.

paulcq6173•9/16/24, 2:05 PM

Is cloudflare pages function work with Next.js? I set up /functions/api/test.ts at the root of my Next.js project, then use wrangler to preview, on router /api/test only got 404.

Ppaulcq6173 Is cloudflare pages function work with Next.js? I set up /functions/api/test.ts ...

Hard@Work•9/16/24, 2:07 PM

Are you using #next-on-pages? If so, you need to use Nextjs's server actions thing

paulcq6173•9/16/24, 2:09 PM

Yes, I am using @Cloudflare/next-on-pages with my project.

Ppaulcq6173 Yes, I am using @Cloudflare/next-on-pages with my project.

Hard@Work•9/16/24, 2:10 PM

Yeah then you want to use https://nextjs.org/docs/pages/building-your-application/routing/api-routes

Routing: API Routes | Next.js

Next.js supports API Routes, which allow you to build your API without leaving your Next.js app. Learn how it works here.

paulcq6173•9/16/24, 2:14 PM

I am using App Router mode, so this is the reason that cause pages function not work?

Ppaulcq6173 I am using App Router mode, so this is the reason that cause pages function not ...

Hard@Work•9/16/24, 2:15 PM

I don't think so. If you use SSR of any kind with Next, then you need to use Next's API system instead of Functions

paulcq6173•9/16/24, 2:17 PM

ok, thank you for reply.

Ricky U•9/17/24, 11:06 AM

How do enable the compatibility flag using pages functions so i can use jsonwebcrypto? And is it the same using wrangler pages dev ./dist in local env?

WalshyOP•9/17/24, 11:10 AM

wrangler.toml or dash

Ricky U•9/17/24, 11:15 AM

does the wrangler.toml sit in the root /functions dir ?

Ricky U•9/17/24, 11:16 AM

I get an error :

MiniflareCoreError [ERR_FUTURE_COMPATIBILITY_DATE]: Compatibility date "2024-09-23" is in the future and unsupported

MiniflareCoreError [ERR_FUTURE_COMPATIBILITY_DATE]: Compatibility date "2024-09-23" is in the future and unsupported

when running 'npx wrangler pages dev ./dist --compatibility-date=2024-09-23'

WalshyOP•9/17/24, 11:19 AM

As the error says, that's in the future

WalshyOP•9/17/24, 11:19 AM

wrangler.toml sits in root (same as workers)

Ricky U•9/17/24, 11:20 AM

the docs : https://blog.cloudflare.com/more-npm-packages-on-cloudflare-workers-combining-polyfills-and-native-code/
say that in order top use new modules such as jsonwebtoken (which i am trying to do) i need a compat date of 2024-09-23 or later.

WalshyOP•9/17/24, 11:21 AM

Or set the compat flag -

nodejs_compat_V2

nodejs_compat_V2

WalshyOP•9/17/24, 11:21 AM

The compat date just changes the behaviour of

nodejs_compat

nodejs_compat

flag

Ricky U•9/17/24, 11:24 AM

compatibility_date = "2024-09-17"
compatibility_flags = ["nodejs_compat_v2"]

That seemed to have done it. thanks.

Ricky U•9/17/24, 11:26 AM

woohoo jsonwebtoken now on cloudflare!

�

🍋 Pandeo 🍋•9/19/24, 2:09 PM

Hello, i have a nextjs app and i want to host using Cloudflares Pages and i was figuring that the SSR part is consuming pages functions resources. And that resources is limited to 10m requests per month (and after it's 0.5$/m requests).
In the case where someone try to http flood me and generate 100m requests in 10 minutes, did i will be billed for those requests ?
And if yes, how can i avoid this problem by caching the pages functions or doing something else ?

�🍋 Pandeo 🍋Hello, i have a nextjs app and i want to host using Cloudflares Pages and i was ...

hfcRed•9/20/24, 1:53 PM

ddos protections run before your site and functions, so attacks are stopped before they even hit your service

hfcRed•9/20/24, 1:53 PM

some requests will still get through ofc but the attacker will get blocked loooooong before 100m requests

�

🍋 Pandeo 🍋•9/20/24, 1:54 PM

kk. Because i have tested it with the free tier and after my 100k request i have stopped my test to not block me for 10 days

�

🍋 Pandeo 🍋•9/20/24, 1:54 PM

https://media.discordapp.net/attachments/1252404589861277842/1286357950725886148/image.png?ex=66ee4672&is=66ecf4f2&hm=f364dffb2bfb1d7fa395dd08e107e7565599f4f034da1f95a44be8f547d4fbd1&=&format=webp&quality=lossless

�

🍋 Pandeo 🍋•9/20/24, 1:55 PM

But it's "only" 100k requests so idk if it's the same with a real attack

Rennology•9/20/24, 11:12 PM

Hey guys, I've spent the last two days trying to figure this out and still scratching my head..

I setup a clean install of an astro site with wrangler. Enabled directory mode and added a simple endpoint in functions/api/index.js. When I run

npm run preview

npm run preview

and I try to hit that endpoint using the server URL I just get a 404 error. Where am I going wrong here?

I uploaded my project on github for reference https://github.com/OptimizeAd/astro-cloudflare-functions

GitHub

GitHub - OptimizeAd/astro-cloudflare-functions

Contribute to OptimizeAd/astro-cloudflare-functions development by creating an account on GitHub.

RRennology Hey guys, I've spent the last two days trying to figure this out and still scrat...

Hello, I’m Allie!•9/20/24, 11:13 PM

When using the Astro Adapter, you must use Astro’s Server Endpoints, not Functions

Rennology•9/20/24, 11:16 PM

ok so build out the API in src/pages/api instead?

Andrei•9/21/24, 10:37 PM

Hey everyone! Anybody encountered slow functions response times?

Recently finished a migration to CF Pages of one of my Remix apps. The issue is that "Waiting for server response" timing is much slower than the whole duration of the function itself.

The

total

total

timing from the Worker is 284 ms while

Waiting for server response

Waiting for server response

from the DevTools is at 885 ms—more than 3 times slower.

Here's how I measure

total

total

export async function onRequest(
  context: EventContext<unknown, string, unknown>,
) {
  const start = performance.now()
  const response = await createPagesFunctionHandler({ build, getLoadContext })(
    context,
  )
  const end = performance.now()
  response.headers.append("Server-Timing", `total;dur=${end - start}`)
  return response
}

export async function onRequest(
  context: EventContext<unknown, string, unknown>,
) {
  const start = performance.now()
  const response = await createPagesFunctionHandler({ build, getLoadContext })(
    context,
  )
  const end = performance.now()
  response.headers.append("Server-Timing", `total;dur=${end - start}`)
  return response
}

Can't figure out where's the issue here. Is it the code, or network issues?

[commonjs--resolver] [plugin vite:resolve] Cannot bundle Node.js built-in "util" imported from "../node_modules/knex/lib/dialects/sqlite3/index.js". Consider disabling ssr.noExternal or remove the built-in dependency.

export async function onRequest( context: EventContext<unknown, string, unknown>, ) { const start = performance.now() const response = await createPagesFunctionHandler({ build, getLoadContext })( context, ) const end = performance.now() response.headers.append("Server-Timing", `total;dur=${end - start}`) return response }

I think you're probably overly worrying about size, I have an astro react site + others just plain r

Similar Threads

Similar Threads

Similar Threads