feat: enable Cloudflare edge caching

app/helpers/timezone.ts

@@ -19,13 +19,20 @@ function isValidTimezone(tz: string): boolean {
 export const guessTimeZoneFromRequest = (request: Request): string => {
   const cookies = parse(request.headers.get('Cookie') || '');
   if (cookies.tz && isValidTimezone(cookies.tz)) {
-    // TODO: Check it's a valid timezone
     return cookies.tz;
   }
+  // CF-Connecting-IP is the real client IP when behind Cloudflare,
+  // x-forwarded-for may contain Cloudflare edge IPs which would
+  // resolve to the data center's location instead of the user's.
+  const clientIp = request.headers.get('cf-connecting-ip');
+  if (clientIp) {
+    const geo = lookup(clientIp.trim());
+    return geo?.timezone ?? DEFAULT_TIMEZONE;
+  }
   const forwardedIps = request.headers.get('x-forwarded-for');
   if (forwardedIps) {
     const allIps = forwardedIps.split(',');
-    const ip = allIps[allIps.length - 1].trim();
+    const ip = allIps[0].trim();
     const geo = lookup(ip);
     return geo?.timezone ?? DEFAULT_TIMEZONE;
   }

app/routes/build/release-job.tsx

@@ -30,7 +30,7 @@ export const loader = async (args: LoaderFunctionArgs) => {
     // Guess at three hours for the build time
     const estimatedCompletion = new Date(started.getTime() + 1_000 * 60 * 60 * 3);
     const timeZone = guessTimeZoneFromRequest(args.request);
-    args.context.cacheControl = 'private, max-age=30';
+    args.context.cacheControl = 'public, max-age=30, s-maxage=30, stale-while-revalidate=60';
     return {
       ...build,
       started: prettyDateString(build.started, timeZone),

app/routes/history.tsx

@@ -86,7 +86,7 @@ export const loader = async (args: LoaderFunctionArgs) => {
       calendarData[month][day].stable.push(release.version);
     }
   }
-  args.context.cacheControl = 'private, max-age=120';
+  args.context.cacheControl = 'public, max-age=120, s-maxage=300, stale-while-revalidate=120';
 
   const currentMonth = currentDate.getMonth();
   const currentDayOfMonth = currentDate.getDate();

app/routes/history/date.tsx

@@ -34,7 +34,7 @@ export const loader = async (args: LoaderFunctionArgs) => {
     isSameDay(new Date(r.fullDate), new Date(year, month - 1, day)),
   );
 
-  args.context.cacheControl = 'private, max-age=120';
+  args.context.cacheControl = 'public, max-age=120, s-maxage=300, stale-while-revalidate=120';
 
   const timeZone = guessTimeZoneFromRequest(args.request);
 

app/routes/home.tsx

@@ -18,7 +18,7 @@ export const meta: MetaFunction = () => {
 export const loader = async (args: LoaderFunctionArgs) => {
   const [releases, active] = await Promise.all([getLatestReleases(), getActiveReleasesOrUpdate()]);
   const timeZone = guessTimeZoneFromRequest(args.request);
-  args.context.cacheControl = 'private, max-age=30';
+  args.context.cacheControl = 'public, max-age=30, s-maxage=30, stale-while-revalidate=60';
   return { releases, active, timeZone };
 };
 

app/routes/pr/details.tsx

@@ -67,7 +67,7 @@ export const loader = async (args: LoaderFunctionArgs) => {
       createdAt: prettyDateString(pr.createdAt, timeZone),
       mergedAt: pr.mergedAt ? prettyDateString(pr.mergedAt, timeZone) : null,
     };
-    args.context.cacheControl = 'private, max-age=60';
+    args.context.cacheControl = 'public, max-age=60, s-maxage=120, stale-while-revalidate=60';
   }
   return pr;
 };

app/routes/pr/lookup.tsx

@@ -24,7 +24,7 @@ export const loader = async (args: LoaderFunctionArgs) => {
       ...pr,
       createdAt: prettyDateString(pr.createdAt, guessTimeZoneFromRequest(args.request)),
     }));
-    args.context.cacheControl = 'private, max-age=60';
+    args.context.cacheControl = 'public, max-age=60, s-maxage=120, stale-while-revalidate=60';
   }
   return recentPRs ?? [];
 };

app/routes/release/all.tsx

@@ -77,7 +77,7 @@ export const loader = async (args: LoaderFunctionArgs) => {
 
   const timeZone = guessTimeZoneFromRequest(args.request);
 
-  args.context.cacheControl = 'private, max-age=30';
+  args.context.cacheControl = 'public, max-age=30, s-maxage=30, stale-while-revalidate=60';
   return {
     releases: page > maxPage ? [undefined] : inChannel.slice(start, end),
     maxPage,

app/routes/release/compare.tsx

@@ -96,7 +96,7 @@ export const loader = async (args: LoaderFunctionArgs) => {
     }),
   );
 
-  args.context.cacheControl = 'private, max-age=300';
+  args.context.cacheControl = 'public, max-age=300, s-maxage=600, stale-while-revalidate=300';
 
   return {
     fromElectronRelease,

app/routes/release/single.tsx

@@ -66,7 +66,7 @@ export const loader = async (args: LoaderFunctionArgs) => {
   const isLatestStable = latestReleases.latestSupported[0]?.version === version.substr(1);
   const isLatestPreRelease = latestReleases.lastPreRelease?.version === version.substr(1);
 
-  args.context.cacheControl = 'private, max-age=300';
+  args.context.cacheControl = 'public, max-age=300, s-maxage=600, stale-while-revalidate=300';
   return {
     allVersionsInMajor,
     electronRelease,

app/routes/schedule.tsx

@@ -59,7 +59,7 @@ function DependencyRelease({
 export const loader = async (args: LoaderFunctionArgs) => {
   const timeZone = guessTimeZoneFromRequest(args.request);
   const releases = await getRelativeSchedule();
-  args.context.cacheControl = 'private, max-age=120';
+  args.context.cacheControl = 'public, max-age=120, s-maxage=300, stale-while-revalidate=120';
   return { releases, timeZone };
 };