From 01000f8837538dd84de2ef60711008198c4c504b Mon Sep 17 00:00:00 2001 From: Alex Christoffer Rasmussen Date: Sun, 31 Mar 2024 22:07:42 +0200 Subject: [PATCH] feat: chaching for static react files (#862) * set immutable tag for static route * captur more server timings in NODE_ENV === 'development' --- apps/server/package.json | 1 + apps/server/src/app.ts | 11 ++++++++++- pnpm-lock.yaml | 15 ++++++++++++--- 3 files changed, 23 insertions(+), 4 deletions(-) diff --git a/apps/server/package.json b/apps/server/package.json index 3dc0c112c..513a292b4 100644 --- a/apps/server/package.json +++ b/apps/server/package.json @@ -43,6 +43,7 @@ "nodemon": "^2.0.20", "ontime-types": "workspace:*", "prettier": "^3.0.3", + "server-timing": "^3.3.3", "shx": "^0.3.4", "ts-node": "^10.9.1", "typescript": "^5.4.3", diff --git a/apps/server/src/app.ts b/apps/server/src/app.ts index afe3eb545..c93180ab7 100644 --- a/apps/server/src/app.ts +++ b/apps/server/src/app.ts @@ -5,6 +5,7 @@ import express from 'express'; import expressStaticGzip from 'express-static-gzip'; import http, { type Server } from 'http'; import cors from 'cors'; +import serverTiming from 'server-timing'; // import utils import { resolve } from 'path'; @@ -54,6 +55,10 @@ if (!isProduction) { // Create express APP const app = express(); +if (process.env.NODE_ENV === 'development') { + // log more serever timings + app.use(serverTiming()); +} app.disable('x-powered-by'); // setup cors for all routes @@ -83,11 +88,15 @@ app.use( expressStaticGzip(reactAppPath, { enableBrotli: true, orderPreference: ['br'], + // when we build the client all the react subfiles will get a hashed name we can the immutable tag + // as the contents of a build file will never change without also changing its name + // so the client dose not need to revalidate the file contetnts with the server + serveStatic: { etag: false, lastModified: false, immutable: true, maxAge: '1y' }, }), ); app.get('*', (_req, res) => { - res.sendFile(resolve(resolvedPath(), 'index.html')); + res.sendFile(resolve(reactAppPath, 'index.html')); }); // Implement catch all diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 31d545eea..e04f5c753 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -355,6 +355,9 @@ importers: prettier: specifier: ^3.0.3 version: 3.0.3 + server-timing: + specifier: ^3.3.3 + version: 3.3.3 shx: specifier: ^0.3.4 version: 0.3.4 @@ -7199,10 +7202,10 @@ packages: /minimist@1.2.7: resolution: {integrity: sha512-bzfL1YUZsP41gmu/qjrEk0Q6i2ix/cVeAhbCbqH9u3zYutS1cLg00qhrD0M2MVdCcx4Sc0UpP2eBWo9rotpq6g==} + dev: true /minimist@1.2.8: resolution: {integrity: sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==} - dev: true /minipass@3.3.6: resolution: {integrity: sha512-DxiNidxSEK+tHG6zOIklvNOwm3hvCrbUrdtzY74U6HKTJxvIDfOUL5W5P2Ghd3DTkhhKPYGqeNUIh5qcM4YBfw==} @@ -7238,7 +7241,7 @@ packages: resolution: {integrity: sha512-FP+p8RB8OWpF3YZBCrP5gtADmtXApB5AMLn+vdyA+PyxCjrCs00mjyUozssO33cwDeT3wNGdLxJ5M//YqtHAJw==} hasBin: true dependencies: - minimist: 1.2.7 + minimist: 1.2.8 dev: false /mkdirp@1.0.4: @@ -7474,7 +7477,6 @@ packages: /on-headers@1.0.2: resolution: {integrity: sha512-pZAE+FJLoyITytdqK0U5s+FIpjN0JP3OzFi/u8Rx+EV5/W+JTWGXG8xFzevE7AjBfDqHv/8vL8qQsIhHnqRkrA==} engines: {node: '>= 0.8'} - dev: false /once@1.4.0: resolution: {integrity: sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==} @@ -8378,6 +8380,13 @@ packages: - supports-color dev: false + /server-timing@3.3.3: + resolution: {integrity: sha512-TP0xWAca4oM8H/PSdeaGgp2qm+HrZ2cWCRcMXS2t500a7Wum/hSojlpTW43VZsIUSVNlKPFGDknH34IqF+mbBg==} + dependencies: + minimist: 1.2.8 + on-headers: 1.0.2 + dev: true + /setprototypeof@1.2.0: resolution: {integrity: sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==} dev: false