I have created a simpler “SSR emulation repository” and I think I have managed to make it work https://github.com/luisherranz/netlify-ssr-test
– This only means we may be able to make Frontity work on Netlify, but it is not working yet.
This is the live site: https://flamboyant-euclid-90b896.netlify.com/
This is the toml file:
[build]
command = "npm run build"
publish = "build/static"
functions = "build"
[[redirects]]
from = "/static/*"
to = "/:splat"
status = 200
[[redirects]]
from = "/*"
to = "/.netlify/functions/server"
status = 200
The server.js
lambda is taking care of all the urls with the /*
redirection:
https://flamboyant-euclid-90b896.netlify.com/
https://flamboyant-euclid-90b896.netlify.com/some-blog-post
https://flamboyant-euclid-90b896.netlify.com/category/some-category
And the static
files are properly served with the other /static/*
redirection.
https://flamboyant-euclid-90b896.netlify.com/static/static.js
For some reason adding [[headers]]
to /*
doesn’t work for lambdas:
[[headers]]
for = "/*"
[headers.values]
X-Custom-Toml = "Toml"
The _headers
file is also not working for lamdbas:
/*
X-Custom-Root: Root
Both of these work fine for the static file. I don’t know if I’m doing something wrong or that is a bug.
They only work if they are returned by the lambda:
exports.handler = (event, context, callback) => {
setTimeout(() => {
callback(null, {
statusCode: 200,
body: `Dynamic page. Path: ${event.path}. Random: ${Math.random()}`,
headers: {
"Cache-Control": "public, s-maxage=15, stale-while-revalidate=300"
}
});
}, 3000);
};
This lambda simulates a SSR request with a setTimeout
of 3 seconds.
The CDN works, and it is honoring the s-maxage
directive. It serves the cached version for 15 seconds.
But the CDN is ignoring the state-while-revalidate
directive. After 15 seconds, it doesn’t serve a the stale version of the cache, it serves a new asset, making the user wait 3 seconds again.
Things we need to add/modify in Frontity to make it work:
- Add support for AWS lambdas.
- Release a
@frontity/cache-control
package to add the proper headers.
- Probably try to move
/static/server.js
to its own folder, so Netlify doesn’t think all the static js files are also lambdas.