Simplify project

adaptdk · Jul 16, 2024 · da6ac28 · da6ac28
1 parent cef81d6
commit da6ac28
Show file tree

Hide file tree

Showing 26 changed files with 282 additions and 916 deletions.
diff --git a/README.md b/README.md
@@ -1,50 +1,4 @@
-# Astro Starter Kit: Blog
-
-```sh
-npm create astro@latest -- --template blog
-```
-
-[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/withastro/astro/tree/latest/examples/blog)
-[![Open with CodeSandbox](https://assets.codesandbox.io/github/button-edit-lime.svg)](https://codesandbox.io/p/sandbox/github/withastro/astro/tree/latest/examples/blog)
-[![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/withastro/astro?devcontainer_path=.devcontainer/blog/devcontainer.json)
-
-> 🧑‍🚀 **Seasoned astronaut?** Delete this file. Have fun!
-
-![blog](https://github.com/withastro/astro/assets/2244813/ff10799f-a816-4703-b967-c78997e8323d)
-
-Features:
-
-- ✅ Minimal styling (make it your own!)
-- ✅ 100/100 Lighthouse performance
-- ✅ SEO-friendly with canonical URLs and OpenGraph data
-- ✅ Sitemap support
-- ✅ RSS Feed support
-- ✅ Markdown & MDX support
-
-## 🚀 Project Structure
-
-Inside of your Astro project, you'll see the following folders and files:
-
-```text
-├── public/
-├── src/
-│   ├── components/
-│   ├── content/
-│   ├── layouts/
-│   └── pages/
-├── astro.config.mjs
-├── README.md
-├── package.json
-└── tsconfig.json
-```
-
-Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name.
-
-There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components.
-
-The `src/content/` directory contains "collections" of related Markdown and MDX documents. Use `getCollection()` to retrieve posts from `src/content/blog/`, and type-check your frontmatter using an optional schema. See [Astro's Content Collections docs](https://docs.astro.build/en/guides/content-collections/) to learn more.
-
-Any static assets, like images, can be placed in the `public/` directory.
+# Playground for testing out `speculationrules`
 
 ## 🧞 Commands
 

diff --git a/astro.config.mjs b/astro.config.mjs
@@ -5,7 +5,7 @@ import sitemap from '@astrojs/sitemap';
 
 // https://astro.build/config
 export default defineConfig({
-  site: "https://example.com",
+  site: "https://adaptdk.github.io/speculationrules",
   integrations: [mdx(), sitemap()],
-  output: "server",
+  output: "static",
 });
diff --git a/src/middleware.js → src/_middleware.js b/src/middleware.js → src/_middleware.js
diff --git a/src/components/BaseHead.astro b/src/components/BaseHead.astro
@@ -1,17 +1,17 @@
 ---
 // Import the global.css file here so that it is included on
 // all pages through the use of the <BaseHead /> component.
-import '../styles/global.css';
+import "../styles/global.css";
 
 interface Props {
-	title: string;
-	description: string;
-	image?: string;
+  title: string;
+  description: string;
+  image?: string;
 }
 
 const canonicalURL = new URL(Astro.url.pathname, Astro.site);
 
-const { title, description, image = '/blog-placeholder-1.jpg' } = Astro.props;
+const { title, description, image = "/blog-placeholder-1.jpg" } = Astro.props;
 ---
 
 <!-- Global Metadata -->
@@ -21,8 +21,20 @@ const { title, description, image = '/blog-placeholder-1.jpg' } = Astro.props;
 <meta name="generator" content={Astro.generator} />
 
 <!-- Font preloads -->
-<link rel="preload" href="/fonts/atkinson-regular.woff" as="font" type="font/woff" crossorigin />
-<link rel="preload" href="/fonts/atkinson-bold.woff" as="font" type="font/woff" crossorigin />
+<link
+  rel="preload"
+  href="/fonts/atkinson-regular.woff"
+  as="font"
+  type="font/woff"
+  crossorigin
+/>
+<link
+  rel="preload"
+  href="/fonts/atkinson-bold.woff"
+  as="font"
+  type="font/woff"
+  crossorigin
+/>
 
 <!-- Canonical URL -->
 <link rel="canonical" href={canonicalURL} />
@@ -32,16 +44,99 @@ const { title, description, image = '/blog-placeholder-1.jpg' } = Astro.props;
 <meta name="title" content={title} />
 <meta name="description" content={description} />
 
-<!-- Open Graph / Facebook -->
-<meta property="og:type" content="website" />
-<meta property="og:url" content={Astro.url} />
-<meta property="og:title" content={title} />
-<meta property="og:description" content={description} />
-<meta property="og:image" content={new URL(image, Astro.url)} />
-
-<!-- Twitter -->
-<meta property="twitter:card" content="summary_large_image" />
-<meta property="twitter:url" content={Astro.url} />
-<meta property="twitter:title" content={title} />
-<meta property="twitter:description" content={description} />
-<meta property="twitter:image" content={new URL(image, Astro.url)} />
+<script type="speculationrules">
+  {
+    "prerender": [
+      {
+        "eagerness": "immediate",
+        "where": {
+          "and": [
+            { "href_matches": "/*" },
+            { "selector_matches": ".prerender-immediate" },
+            { "not": { "selector_matches": "no-prerender" } }
+          ]
+        }
+      },
+      {
+        "eagerness": "moderate",
+        "where": {
+          "and": [
+            { "href_matches": "/*" },
+            { "selector_matches": ".prerender-moderate" },
+            { "not": { "selector_matches": "no-prerender" } }
+          ]
+        }
+      },
+      {
+        "eagerness": "conservative",
+        "where": {
+          "and": [
+            { "href_matches": "/*" },
+            { "selector_matches": ".prerender-conservative" },
+            { "not": { "selector_matches": "no-prerender" } }
+          ]
+        }
+      }
+    ],
+    "prefetch": [
+      {
+        "eagerness": "immediate",
+        "where": {
+          "and": [
+            { "href_matches": "/*" },
+            { "selector_matches": ".prefetch-immediate" },
+            { "not": { "selector_matches": "no-prefetch" } }
+          ]
+        }
+      },
+      {
+        "eagerness": "moderate",
+        "where": {
+          "and": [
+            { "href_matches": "/*" },
+            { "selector_matches": ".prefetch-moderate" },
+            { "not": { "selector_matches": "no-prefetch" } }
+          ]
+        }
+      },
+      {
+        "eagerness": "conservative",
+        "where": {
+          "and": [
+            { "href_matches": "/*" },
+            { "selector_matches": ".prefetch-conservative" },
+            { "not": { "selector_matches": "no-prefetch" } }
+          ]
+        }
+      }
+    ]
+  }
+</script>
+<script is:inline>
+  const urlParams = new URLSearchParams(window.location.search);
+  const blockFor = urlParams.get("blockFor");
+
+  if (blockFor && parseInt(blockFor) > 0) {
+    function sleep(ms) {
+      const start = Date.now();
+      while (Date.now() < start + ms) {}
+    }
+
+    const blockForMiliseconds = parseInt(blockFor);
+    console.log("Blocking for", blockForMiliseconds);
+    sleep(blockForMiliseconds);
+    console.log("Done");
+  }
+
+  window.isPrerendered =
+    document.prerendering ||
+    self.performance?.getEntriesByType?.("navigation")[0]?.activationStart > 0;
+  const prerender = urlParams.get("prerender");
+  if (prerender) {
+    window.speculation = `prerender: ${prerender}`;
+  }
+  const prefetch = urlParams.get("prefetch");
+  if (prefetch) {
+    window.speculation = `prefetch: ${prefetch}`;
+  }
+</script>
diff --git a/src/components/Footer.astro b/src/components/Footer.astro
diff --git a/src/components/FormattedDate.astro b/src/components/FormattedDate.astro