Enable streaming

This commit is contained in:
Dan Abramov
2021-11-11 18:53:49 +00:00
parent 719aa3c377
commit 3498bff710
2 changed files with 48 additions and 53 deletions

View File

@@ -10,8 +10,7 @@ module.exports = {
pageExtensions: ['jsx', 'js', 'ts', 'tsx', 'mdx', 'md'],
experimental: {
plugins: true,
// TODO: this doesn't work because https://github.com/vercel/next.js/issues/30714
// concurrentFeatures: true,
concurrentFeatures: true,
scrollRestoration: true,
},
async redirects() {

View File

@@ -3,64 +3,60 @@
*/
import * as React from 'react';
import Document, {Html, Head, Main, NextScript} from 'next/document';
import {Html, Head, Main, NextScript} from 'next/document';
class MyDocument extends Document {
render() {
// @todo specify language in HTML?
return (
<Html lang="en">
<Head />
<body className="font-sans antialiased text-lg bg-wash dark:bg-wash-dark text-secondary dark:text-secondary-dark leading-base">
<script
dangerouslySetInnerHTML={{
__html: `
(function () {
function setTheme(newTheme) {
window.__theme = newTheme;
if (newTheme === 'dark') {
document.documentElement.classList.add('dark');
} else if (newTheme === 'light') {
document.documentElement.classList.remove('dark');
}
export default function Document() {
// @todo specify language in HTML?
return (
<Html lang="en">
<Head />
<body className="font-sans antialiased text-lg bg-wash dark:bg-wash-dark text-secondary dark:text-secondary-dark leading-base">
<script
dangerouslySetInnerHTML={{
__html: `
(function () {
function setTheme(newTheme) {
window.__theme = newTheme;
if (newTheme === 'dark') {
document.documentElement.classList.add('dark');
} else if (newTheme === 'light') {
document.documentElement.classList.remove('dark');
}
}
var preferredTheme;
var preferredTheme;
try {
preferredTheme = localStorage.getItem('theme');
} catch (err) { }
window.__setPreferredTheme = function(newTheme) {
preferredTheme = newTheme;
setTheme(newTheme);
try {
preferredTheme = localStorage.getItem('theme');
localStorage.setItem('theme', newTheme);
} catch (err) { }
};
window.__setPreferredTheme = function(newTheme) {
preferredTheme = newTheme;
setTheme(newTheme);
try {
localStorage.setItem('theme', newTheme);
} catch (err) { }
};
var initialTheme = preferredTheme;
var darkQuery = window.matchMedia('(prefers-color-scheme: dark)');
var initialTheme = preferredTheme;
var darkQuery = window.matchMedia('(prefers-color-scheme: dark)');
if (!initialTheme) {
initialTheme = darkQuery.matches ? 'dark' : 'light';
}
setTheme(initialTheme);
if (!initialTheme) {
initialTheme = darkQuery.matches ? 'dark' : 'light';
darkQuery.addListener(function (e) {
if (!preferredTheme) {
setTheme(e.matches ? 'dark' : 'light');
}
setTheme(initialTheme);
darkQuery.addListener(function (e) {
if (!preferredTheme) {
setTheme(e.matches ? 'dark' : 'light');
}
});
})();
`,
}}
/>
<Main />
<NextScript />
</body>
</Html>
);
}
});
})();
`,
}}
/>
<Main />
<NextScript />
</body>
</Html>
);
}
export default MyDocument;