Skip to content
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

feat(vercel): streaming #8879

Merged
merged 8 commits into from
Nov 7, 2023
Merged
Show file tree
Hide file tree
Changes from 7 commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 7 additions & 0 deletions .changeset/tricky-clocks-end.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
---
'@astrojs/vercel': major
lilnasy marked this conversation as resolved.
Show resolved Hide resolved
---

The Vercel adapter now streams responses!

This brings better performance to your visitors by showing them content as it is rendered. The browser can also start loading the required stylesheets and scripts much sooner, which ultimately results in faster full page loads.
Copy link
Member

@sarah11918 sarah11918 Nov 6, 2023

Choose a reason for hiding this comment

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

Suggested change
This brings better performance to your visitors by showing them content as it is rendered. The browser can also start loading the required stylesheets and scripts much sooner, which ultimately results in faster full page loads.
This brings better performance to your visitors by showing them content as it is rendered. The browser can also start loading the required stylesheets and scripts much sooner, which ultimately results in faster full page loads.
Read more about [HTML streaming](https://docs.astro.build/en/guides/server-side-rendering/#html-streaming) in the Astro docs.

Up to you! Since there are warnings involved with streaming, it couldn't hurt to send to the new docs. BUT, since this doesn't break anything, not really needed anymore. (Was added when I was afraid that enabling this changed the Response headers behaviour)

NOTE: Depending on how quickly this merges, I have a PR that would add the anchor link above but currently the URL is only #streaming. If this is to merge soon, I can pre-emptively update existing docs to that link now, even before the new page is published.

Copy link
Member

Choose a reason for hiding this comment

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

Withdrawing this suggestion! With that docs page about to change, it's maybe a little too disruptive at this exact moment.

3 changes: 2 additions & 1 deletion packages/integrations/vercel/src/serverless/adapter.ts
Original file line number Diff line number Diff line change
Expand Up @@ -341,7 +341,7 @@ interface CreateFunctionFolderArgs {
NTF_CACHE: any;
includeFiles: URL[];
excludeFiles?: string[];
maxDuration?: number;
maxDuration: number | undefined;
}

async function createFunctionFolder({
Expand Down Expand Up @@ -381,6 +381,7 @@ async function createFunctionFolder({
handler,
launcherType: 'Nodejs',
maxDuration,
supportsResponseStreaming: true,
});
}

Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
import { defineConfig } from 'astro/config';
import vercel from '@astrojs/vercel/serverless';

export default defineConfig({
output: "server",
adapter: vercel()
});
10 changes: 10 additions & 0 deletions packages/integrations/vercel/test/fixtures/streaming/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
{
"name": "@test/vercel-streaming",
"version": "0.0.0",
"private": true,
"dependencies": {
"@astrojs/vercel": "workspace:*",
"astro": "workspace:*"
}
}

Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
<html>
<head>
<title>One</title>
</head>
<body>
<h1>One</h1>
</body>
</html>
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
<html>
<head>
<title>Two</title>
</head>
<body>
<h1>Two</h1>
</body>
</html>
15 changes: 8 additions & 7 deletions packages/integrations/vercel/test/static-assets.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,10 @@ describe('Static Assets', () => {

const VALID_CACHE_CONTROL = 'public, max-age=31536000, immutable';

async function build({ adapter, assets }) {
async function build({ adapter, assets, output }) {
fixture = await loadFixture({
root: './fixtures/static-assets/',
output,
adapter,
build: {
assets,
Expand Down Expand Up @@ -38,31 +39,31 @@ describe('Static Assets', () => {
}

describe('static adapter', async () => {
const adapter = await import('@astrojs/vercel/static');
const { default: vercel } = await import('@astrojs/vercel/static');

it('has cache control', async () => {
await build({ adapter });
await build({ adapter: vercel() });
checkValidCacheControl();
});

it('has cache control other assets', async () => {
const assets = '_foo';
await build({ adapter, assets });
await build({ adapter: vercel(), assets });
checkValidCacheControl(assets);
});
});

describe('serverless adapter', async () => {
const adapter = await import('@astrojs/vercel/serverless');
const { default: vercel } = await import('@astrojs/vercel/serverless');

it('has cache control', async () => {
await build({ adapter });
await build({ output: "server", adapter: vercel() });
checkValidCacheControl();
});

it('has cache control other assets', async () => {
const assets = '_foo';
await build({ adapter, assets });
await build({ output: "server", adapter: vercel(), assets });
checkValidCacheControl(assets);
});
});
Expand Down
21 changes: 21 additions & 0 deletions packages/integrations/vercel/test/streaming.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
import { loadFixture } from './test-utils.js';
import { expect } from 'chai';

describe('maxDuration', () => {
/** @type {import('./test-utils.js').Fixture} */
let fixture;

before(async () => {
fixture = await loadFixture({
root: './fixtures/streaming/',
});
await fixture.build();
});

it('makes it to vercel function configuration', async () => {
const vcConfig = JSON.parse(
await fixture.readFile('../.vercel/output/functions/render.func/.vc-config.json')
);
expect(vcConfig).to.deep.include({ supportsResponseStreaming: true });
});
});
9 changes: 9 additions & 0 deletions pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Loading