diff --git a/docs/pages/common_issues.mdx b/docs/pages/common_issues.mdx index 804ad542e..74e94d773 100644 --- a/docs/pages/common_issues.mdx +++ b/docs/pages/common_issues.mdx @@ -14,4 +14,10 @@ If you are using sentry, API routes returns empty body. You could try configurin #### My ISR page has this cache-control header `s-maxage=2, stale-while-revalidate=2592000` -Given how ISR works, while waiting for the revalidation to happen, the page will be served using this cache control header. This prevent your server from being overloaded by a lot of requests while the revalidation is done. You can read more about it [here](/inner_workings/isr). \ No newline at end of file +Given how ISR works, while waiting for the revalidation to happen, the page will be served using this cache control header. This prevent your server from being overloaded by a lot of requests while the revalidation is done. You can read more about it [here](/inner_workings/isr). + +#### Unzipped size must be smaller than 262144000 bytes + +AWS Lambda has an unzipped size limit of 250MB. If your app is over this limit, then it is most likely using a node_module library that is too large for serverless or there is a large dev dependency getting bundled. +For example, `pdfjs` has `canvas` optional dependency which takes up 180MB. For more details, [read me](/common_issues/bundle_size). +Note: a large bundle size will increase cold start significantly. \ No newline at end of file diff --git a/docs/pages/common_issues/bundle_size.mdx b/docs/pages/common_issues/bundle_size.mdx new file mode 100644 index 000000000..e391df396 --- /dev/null +++ b/docs/pages/common_issues/bundle_size.mdx @@ -0,0 +1,55 @@ +import {Callout} from 'nextra/components' + + +#### Reducing Bundle Size + +Next will incorrectly trace dev dependencies to be included in the output `node_modules`, which will significantly increase the lambda bundle. For example, the @swc/core-\* binary is ~33MB! + +Add this to your next.config.js to help minimize the lambda bundle size: + +```typescript + outputFileTracingExcludes: { + '*': [ + '@swc/core', + 'esbuild', + 'uglify-js', + 'watchpack', + 'webassemblyjs', + 'sharp' + ], + }, +``` + + + NextJS currently doesn't expose `outputFileTracingExcludes` as an environmental variable so `open-next`cannot programmatically set this like it does for`output`and`outputFileTracingRoot`. + Currently, next uses `webpack` to trace server actions, so you shouldn't add `webpack` to the excludes list, otherwise it will break server actions. + + +#### Unzipped size must be smaller than 262144000 bytes + +To identify the module that's taking up too much space (and isn't serverless friendly): + +```bash +du -hs .open-next/server-function/node_modules/* | sort -rh +``` + +If your app requires the offending library, then consider moving your business logic of the `api` to its own lambda, eg: `/api/v2` => `Api Lambda` + + + There is a [PR](https://github.com/sst/open-next/pull/242) to remove some dev dependency from the output node_modules but that requires more testing before it can merge. + + +#### Common issues + +##### Sharp + +`sharp` is not needed outside of the `Image Optimization` function so you should not have it as a dependency. But if you are depending on `sharp`, be sure to install it with the correct flags for your lambda. +eg: `--arch=arm64 --platform=linux --target=18 --libc=glibc` + +##### pdfjs + +If you need to use pdfjs, you should install it with `npm i pdfjs-dist--no-optional` because the optional dep: `canvas` takes about 180MB. + +##### Others + +Please open an issue or let us know on discord if there are any other modules that are causing issues. \ No newline at end of file diff --git a/packages/tests-e2e/README.md b/packages/tests-e2e/README.md index a08931f98..799ba1c36 100644 --- a/packages/tests-e2e/README.md +++ b/packages/tests-e2e/README.md @@ -10,9 +10,9 @@ The 3 permutations are: Their respective `tests/` folders are: -1. [appDirOnly](./tests/appDirOnly) -2. [pagesOnly](./tests/pagesOnly) -3. [appDirAndPages](./tests//appDirAndPages) +1. [appRouter](./tests/appDirOnly) +2. [pagesRouter](./tests/pagesOnly) +3. [appPagesRouter](./tests//appDirAndPages) Their respective `packages/` are located at: @@ -22,9 +22,25 @@ Their respective `packages/` are located at: The GitHub actions will trigger the [e2e test](/.github/workflows//e2e.yml), which deploys the app in the [Example](/example/) folder. The deploy command is: -``` +### Running the tests against the deployed app + +1. Deploy the app +```bash +cd examples/sst npx sst deploy --stage e2e ``` +2. Export the URLS +```bash +export APP_ROUTER_URL=$(jq -r '.["e2e-example-AppRouter"].url' .sst/outputs.json) +export PAGES_ROUTER_URL=$(jq -r '.["e2e-example-PagesRouter"].url' .sst/outputs.json) +export APP_PAGES_ROUTER_URL=$(jq -r '.["e2e-example-AppPagesRouter"].url' .sst/outputs.json) +``` +3. Run the test +```bash +cd ../packages/tests-e2e +npm run e2e:dev +``` + ## Gotchas