Skip to content

feat: add support for Edge Functions #1310

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 22 commits into from
Apr 19, 2022
Merged

feat: add support for Edge Functions #1310

merged 22 commits into from
Apr 19, 2022

Conversation

ascorbic
Copy link
Contributor

Summary

Adds beta support for Netlify Edge Functions. This includes support for deploying middleware to the edge, but also running the full site using edge runtime. To enable this during the beta, set NEXT_USE_NETLIFY_EDGE in the UI or cli.

Test plan

  1. Visit the deploy previews for the middleware and server-components demos (coming soon)

Relevant links (GitHub issues, Notion docs, etc.) or a picture of cute animal

loads of capybaras in the sun

Standard checks:

  • Check the Deploy Preview's Demo site for your PR's functionality
  • Add docs when necessary

🧪 Once merged, make sure to update the version if needed and that it was published correctly.

@netlify
Copy link

netlify bot commented Apr 19, 2022

Deploy Preview for netlify-plugin-nextjs-nx-monorepo-demo ready!

Name Link
🔨 Latest commit f6c2a7e
🔍 Latest deploy log https://app.netlify.com/sites/netlify-plugin-nextjs-nx-monorepo-demo/deploys/625e8efe59ead20009316208
😎 Deploy Preview https://deploy-preview-1310--netlify-plugin-nextjs-nx-monorepo-demo.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

@netlify
Copy link

netlify bot commented Apr 19, 2022

Deploy Preview for netlify-plugin-nextjs-static-root-demo ready!

Name Link
🔨 Latest commit f6c2a7e
🔍 Latest deploy log https://app.netlify.com/sites/netlify-plugin-nextjs-static-root-demo/deploys/625e8efe1d165b0008ddaf1b
😎 Deploy Preview https://deploy-preview-1310--netlify-plugin-nextjs-static-root-demo.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

@ascorbic ascorbic marked this pull request as draft April 19, 2022 09:15
@netlify
Copy link

netlify bot commented Apr 19, 2022

Deploy Preview for netlify-plugin-nextjs-export-demo ready!

Name Link
🔨 Latest commit f6c2a7e
🔍 Latest deploy log https://app.netlify.com/sites/netlify-plugin-nextjs-export-demo/deploys/625e8efeb7c4f30008567004
😎 Deploy Preview https://deploy-preview-1310--netlify-plugin-nextjs-export-demo.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

@netlify
Copy link

netlify bot commented Apr 19, 2022

Deploy Preview for netlify-plugin-nextjs-demo canceled.

Name Link
🔨 Latest commit f6c2a7e
🔍 Latest deploy log https://app.netlify.com/sites/netlify-plugin-nextjs-demo/deploys/625e8efeb1f995000826f7e7

@github-actions github-actions bot added the type: feature code contributing to the implementation of a feature and/or user facing functionality label Apr 19, 2022
@cypress
Copy link

cypress bot commented Apr 19, 2022



Test summary

2 0 0 0


Run details

Project netlify-plugin-nextjs-nx-monorepo-demo
Status Passed
Commit 03b1d24 ℹ️
Started Apr 19, 2022 10:33 AM
Ended Apr 19, 2022 10:34 AM
Duration 01:10 💡
OS Linux Ubuntu - 20.04
Browser Chrome 100

View run in Cypress Dashboard ➡️


This comment has been generated by cypress-bot as a result of this project's GitHub integration settings. You can manage this integration in this project's settings in the Cypress Dashboard

@ascorbic ascorbic force-pushed the mk/edge branch 3 times, most recently from db21504 to c6725c5 Compare April 19, 2022 09:39
@cypress
Copy link

cypress bot commented Apr 19, 2022



Test summary

7 0 0 0


Run details

Project netlify-plugin-nextjs-static-demo
Status Passed
Commit 03b1d24 ℹ️
Started Apr 19, 2022 10:32 AM
Ended Apr 19, 2022 10:33 AM
Duration 01:17 💡
OS Linux Ubuntu - 20.04
Browser Chrome 100

View run in Cypress Dashboard ➡️


This comment has been generated by cypress-bot as a result of this project's GitHub integration settings. You can manage this integration in this project's settings in the Cypress Dashboard

@cypress
Copy link

cypress bot commented Apr 19, 2022



Test summary

2 20 0 0


Run details

Project netlify-plugin-nextjs-default-demo
Status Failed
Commit 03b1d24 ℹ️
Started Apr 19, 2022 10:31 AM
Ended Apr 19, 2022 10:33 AM
Duration 01:42 💡
OS Linux Ubuntu - 20.04
Browser Chrome 100

View run in Cypress Dashboard ➡️


Failures

i18n.spec.ts Failed
1 Localization > should use sub routing to determine current locale
2 Localization > should use the NEXT_LOCALE cookie to determine the default locale
3 Localization > should use the NEXT_LOCALE cookie over Accept-Language header to determine the default locale
rewrites-redirects.spec.ts Failed
1 Rewrites and Redirects > rewrites: points /old to /
2 Rewrites and Redirects > redirects: redirects /redirectme to /
images.spec.ts Failed
1 next/images > should show static image from /public
2 next/images > should show image using next/image
trailing-slash.spec.ts Failed
1 Trailing slash enabled > should put a trailing slash when there is none, i.e. points /old to /old/
default.spec.ts Failed
1 Default site > loads home page
2 Default site > sets NODE_ENV
This comment includes only the first 10 test failures. See all 20 failures in the Cypress Dashboard.

This comment has been generated by cypress-bot as a result of this project's GitHub integration settings. You can manage this integration in this project's settings in the Cypress Dashboard

@ascorbic ascorbic marked this pull request as ready for review April 19, 2022 10:02
@ascorbic ascorbic requested a review from a team April 19, 2022 10:02
@netlify
Copy link

netlify bot commented Apr 19, 2022

Deploy Preview for next-plugin-edge-middleware ready!

Name Link
🔨 Latest commit f6c2a7e
🔍 Latest deploy log https://app.netlify.com/sites/next-plugin-edge-middleware/deploys/625e8efeb1f995000826f7ec
😎 Deploy Preview https://deploy-preview-1310--next-plugin-edge-middleware.netlify.app/
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

@netlify
Copy link

netlify bot commented Apr 19, 2022

Deploy Preview for next-plugin-rsc-demo failed.

Name Link
🔨 Latest commit f6c2a7e
🔍 Latest deploy log https://app.netlify.com/sites/next-plugin-rsc-demo/deploys/625e8efe71056c0008a432c0

orinokai
orinokai previously approved these changes Apr 19, 2022
Copy link
Contributor

@orinokai orinokai left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks awesome to me! Just that minor docs issue and image format question.

if (process.env.NEXT_USE_NETLIFY_EDGE) {
console.log(outdent`
✨ Deploying to ${greenBright`Netlify Edge Functions`} ✨
This feature is in beta. Please share your feedback here: https://ntl.fyi/next-netlify-edge
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This link seems to just point to the Netlify homepage

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We'll create this when we launch. There's a bullet in the launch checklist

const handler = async (req: Request, context: Context) => {
const { searchParams } = new URL(req.url)
const accept = new Accepts(req.headers)
const type = accept.types(['avif', 'webp'])
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just AVIF and WEBP?

Copy link
Contributor Author

@ascorbic ascorbic Apr 19, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah. If they don't support either of those then we don't enforce a type, and let ipx serve the original format


if (type) {
modifiers.push(`f_${type}`)
}
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

...here is where we add the modifier if they support a modern format

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Got it, thanks 👍🏼

@ascorbic ascorbic requested a review from orinokai April 19, 2022 10:37
Copy link
Contributor

@orinokai orinokai left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚢

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
automerge type: feature code contributing to the implementation of a feature and/or user facing functionality
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants