Remove most image optimisations

ChristineTham · Mar 31, 2024 · fdd1df7 · fdd1df7
1 parent 489e277
commit fdd1df7
Show file tree

Hide file tree

Showing 5 changed files with 26 additions and 22 deletions.
diff --git a/src/components/blogcard.astro b/src/components/blogcard.astro
@@ -1,7 +1,7 @@
 ---
 import type { CollectionEntry } from 'astro:content'
 import { getEntry } from 'astro:content'
-import { Image } from 'astro:assets'
+// import { Image } from 'astro:assets'
 import { Icon } from 'astro-icon/components'
 import Categories from '../components/categories.astro'
 import Tags from '../components/tags.astro'
@@ -31,8 +31,8 @@ if (post.data.author) {
     class='border-1 group relative h-full overflow-hidden rounded-lg border-roselyA bg-rosely3 shadow-xl dark:border-rosely8 dark:bg-rosely0'
   >
     <a href={import.meta.env.BASE_URL + 'blog/' + post.slug}>
-      <Image
-        src={image}
+      <img
+        src={image.src}
         alt={post.data.title + ' featured image'}
         class='relative h-64 w-full overflow-hidden rounded-lg object-cover object-top group-hover:opacity-75'
       />

diff --git a/src/components/bloghero.astro b/src/components/bloghero.astro
@@ -26,9 +26,9 @@ if (post.data.author) {
 
 <div class='relative h-96 w-full max-w-none bg-rosely7 dark:bg-rosely8'>
   <div class='absolute bottom-0 left-0 z-10 h-full w-full bg-gradient-to-t from-rosely0'></div>
-  <Image
+  <img
     itemprop='image'
-    src={image}
+    src={image.src}
     alt='featured image'
     class='absolute left-0 top-0 z-0 h-full w-full object-cover'
   />

diff --git a/src/components/lightbox.astro b/src/components/lightbox.astro
@@ -1,7 +1,7 @@
 ---
 import 'photoswipe/style.css'
 import 'photoswipe-dynamic-caption-plugin/photoswipe-dynamic-caption-plugin.css'
-import { Image } from 'astro:assets'
+// import { Image } from 'astro:assets'
 
 export interface Props {
   id: string
@@ -55,7 +55,6 @@ const imagetitles = images.map((image) => image.src.split('/').reverse()[0].spli
             alt={imagetitles[i]}
             width={600}
             height={(image.height * 600) / image.width}
-            // format='webp'
             class='rounded'
           />
           <span class='pswp-caption-content'>

diff --git a/src/components/seo.astro b/src/components/seo.astro
@@ -1,7 +1,7 @@
 ---
 import { getCollection, getEntry, type CollectionEntry } from 'astro:content'
 import { SEO, type TwitterCardType } from 'astro-seo'
-import { getImage } from 'astro:assets'
+// import { getImage } from 'astro:assets'
 import type {
   Article,
   BreadcrumbList,
@@ -26,13 +26,13 @@ const cat =
   frontmatter.categories &&
   frontmatter.categories.length &&
   (await getEntry(frontmatter.categories[0]))
-const origimage =
+const image =
   frontmatter.socialImage ||
   frontmatter.coverImage ||
   (frontmatter.images && frontmatter.images[0]) ||
   (cat && cat.data.socialImage) ||
   defaultImage
-const image = await getImage({ src: origimage, format: 'jpg', width: 1200 })
+// const image = await getImage({ src: origimage, format: 'jpg', width: 1200 })
 const logo = LogoImage
 const pubDate = frontmatter.pubDate || SiteMetadata.buildTime
 const author = frontmatter.author ? frontmatter.author.slug : 'Chris Tham'
@@ -48,8 +48,8 @@ const openGraph = {
   },
   image: {
     alt: frontmatter.title!,
-    height: image.attributes.height,
-    width: image.attributes.width
+    height: image.height,
+    width: image.width
   },
   article: {
     author: author,

diff --git a/src/pages/rss.xml.js b/src/pages/rss.xml.js
@@ -1,5 +1,5 @@
 import rss from '@astrojs/rss'
-import { getImage } from 'astro:assets'
+// import { getImage } from 'astro:assets'
 import { getEntries, getEntry } from 'astro:content'
 import { SiteMetadata, defaultImage, getPosts } from '../config'
 
@@ -37,16 +37,21 @@ export async function GET(context) {
       posts.map(async (post) => {
         const author = post.data.author ? await getEntry(post.data.author) : defaultauthor
         const categories = post.data.categories && (await getEntries(post.data.categories))
-        const image = await getImage({
-          src:
-            post.data.socialImage ||
+        // const image = await getImage({
+        //   src:
+        //     post.data.socialImage ||
+        //     post.data.coverImage ||
+        //     (post.data.images && post.data.images[0]) ||
+        //     (categories && categories[0].data.socialImage) ||
+        //     defaultImage,
+        //   width: 1200,
+        //   format: 'jpg'
+        // })
+        const image = post.data.socialImage ||
             post.data.coverImage ||
             (post.data.images && post.data.images[0]) ||
             (categories && categories[0].data.socialImage) ||
-            defaultImage,
-          width: 1200,
-          format: 'jpg'
-        })
+            defaultImage
 
         return {
           link: import.meta.env.BASE_URL + '/blog/' + post.slug,
@@ -58,8 +63,8 @@ export async function GET(context) {
           customData: `
             <media:content
               type="image/jpeg"
-              width="${image.attributes.width}"
-              height="${image.attributes.height}"
+              width="${image.width}"
+              height="${image.height}"
               medium="image"
               url="${context.site + image.src.slice(1)}" />
             ${categories ? categories.map((category) => '<category>' + category.data.title + '</category>').join('\n') : ''}