Add sitemap and eager load Avatar

Author: yanthomasdev

astro.config.mjs

@@ -1,15 +1,16 @@
 import { defineConfig } from 'astro/config';
 import tailwind from "@astrojs/tailwind";
 import mdx from "@astrojs/mdx";
-
 import expressiveCode from "astro-expressive-code";
 
+import sitemap from "@astrojs/sitemap";
+
 // https://astro.build/config
 export default defineConfig({
   site: "https://www.yanthomas.dev",
   integrations: [tailwind(), expressiveCode({
-    theme: 'dracula',
-  }), mdx()],
+    theme: 'dracula'
+  }), mdx(), sitemap()],
   experimental: {
     assets: true
   }

package.json

@@ -11,6 +11,7 @@
   },
   "dependencies": {
     "@astrojs/mdx": "^0.19.7",
+    "@astrojs/sitemap": "^2.0.1",
     "@astrojs/tailwind": "^4.0.0",
     "@tailwindcss/typography": "^0.5.9",
     "astro": "^2.7.2",

pnpm-lock.yaml

@@ -0,0 +1,4 @@
+User-agent: *
+Allow: /
+
+Sitemap: https://yanthomas.dev/sitemap-index.xml

public/robots.txt

@@ -4,9 +4,10 @@ import avatar from "@assets/avatar.png";
 ---
 
 <Image
-  class="rounded-full mx-auto hover:scale-110 transition-transform ease-in"
-  width="225"
-  height="225"
+  class="rounded-full mx-auto hover:scale-110 transition-transform ease-in w-60 h-60"
+  width="400"
+  height="400"
   src={avatar}
   alt=""
+  loading="eager"
 />

src/components/Avatar.astro

@@ -36,6 +36,7 @@ const canonicalURL = new URL(Astro.url.pathname, Astro.site);
     <!-- Low Priority -->
     <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
     <meta name="description" content={description} />
+    <link rel="sitemap" href="/sitemap-index.xml" />
     <!-- OG -->
     <meta property="og:title" content={title} />
     <meta property="og:description" content={description} />