BradNut/awesome-uses
1
0
Fork 0
mirror of https://github.com/BradNut/awesome-uses synced 2025-09-08 17:40:31 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #1543 from wesbos/slow-html

Browse source 
Testing content-visibility: auto
This commit is contained in:
Wes Bos 2023-02-23 11:07:42 -05:00 committed by GitHub
commit c8555e195d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 6050 additions and 49 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
package.json
View file

@ -32,6 +32,7 @@
"country-emoji": "^1.5.6", "country-emoji": "^1.5.6",
"isbot": "^3.6.6", "isbot": "^3.6.6",
"joi": "^17.8.1", "joi": "^17.8.1",
"netlify-cli": "^13.0.0",
"normalize.css": "^8.0.1", "normalize.css": "^8.0.1",
"prop-types": "^15.8.1", "prop-types": "^15.8.1",
"react": "^18.2.0", "react": "^18.2.0",
@ -42,9 +43,8 @@
"typescript": "^4.9.5" "typescript": "^4.9.5"
}, },
"scripts": { "scripts": {
"build": "remix build", "build": "netlify build",
"dev": "NODE_ENV=development remix dev", "dev": "NODE_ENV=development netlify dev"
"start": "remix start"
}, },
"devDependencies": { "devDependencies": {
"@types/styled-components": "^5.1.26", "@types/styled-components": "^5.1.26",

6075
pnpm-lock.yaml
View file

File diff suppressed because it is too large Load diff

2
remix.config.js
View file

@ -1,7 +1,7 @@
const { config } = require("@netlify/remix-edge-adapter"); const { config } = require("@netlify/remix-edge-adapter");
/** @type {import('@remix-run/dev').AppConfig} */ /** @type {import('@remix-run/dev').AppConfig} */
module.exports = { module.exports = {
...config, ...(process.env.NETLIFY || process.env.NETLIFY_LOCAL ? config : {}),
appDirectory: "src", appDirectory: "src",
future: { future: {
unstable_postcss: true, unstable_postcss: true,

2
src/components/Person.js
View file

@ -12,7 +12,7 @@ export default function Person({ person }) {
const img = `https://images.weserv.nl/?url=${unavatar}&w=100&l=9&af&il&n=-1`; const img = `https://images.weserv.nl/?url=${unavatar}&w=100&l=9&af&il&n=-1`;
const { tag: currentTag } = useParams(); const { tag: currentTag } = useParams();
return ( return (
<div className="PersonWrapper"> <div className="PersonWrapper" style={{ contentVisibility: "auto" }}>
<div className="PersonInner"> <div className="PersonInner">
<header> <header>
<img <img

14
src/entry.server.tsx
View file

@ -33,7 +33,7 @@ export default async function handleRequest(
// check if we have a cached response in memory // check if we have a cached response in memory
const cachedResponse = cache.get(request.url); const cachedResponse = cache.get(request.url);
if (cachedResponse) { if (cachedResponse) {
console.log('Serving from cache', request.url); // console.log('Serving from cache', request.url);
// if we have a cached response, check if it's less than 5 seconds old // if we have a cached response, check if it's less than 5 seconds old
const now = new Date(); const now = new Date();
const diff = now.getTime() - cachedResponse.date.getTime(); const diff = now.getTime() - cachedResponse.date.getTime();
@ -63,13 +63,13 @@ export default async function handleRequest(
// tee the stream so we can cache it and send it to the client // tee the stream so we can cache it and send it to the client
const [toReponse, toCache] = body.tee(); const [toReponse, toCache] = body.tee();
streamToText(toCache).then(html => { streamToText(toCache).then(html => {
console.log('Caching', request.url); console.log('Caching', request.url);
cache.set(request.url, { cache.set(request.url, {
html: html.replace('Rendered Fresh',`Rendered from cache ${new Date().toISOString()}`), html: html.replace('Rendered Fresh', `Rendered from cache ${new Date().toISOString()}`),
date: new Date(), date: new Date(),
});
}); });
});
const headers = new Headers(responseHeaders); const headers = new Headers(responseHeaders);
headers.set("Content-Type", "text/html"); headers.set("Content-Type", "text/html");