Optimize images for better pixel density

src/markdown/renderer-extension.ts

@@ -1,3 +1,7 @@
+function getNFResize(href: string, height: number, width: number) {
+  return `${href}?nf_resize=fit&h=${height}&w=${width}`
+}
+
 export const renderer = {
   heading(text: string, level: string) {
     const escapedText = text.toLowerCase().replace(/[^\w]+/g, '-')
@@ -14,12 +18,20 @@ export const renderer = {
   image(href: string, title: string, text: string) {
     const figcaption = title ? `<figcaption>${title}</figcaption>` : ''
     const isLocal = !href.startsWith('http')
-    const src = isLocal ? `${href}?nf_resize=fit&h=640&w=640` : href
+    const src = isLocal ? getNFResize(href, 640, 640) : href
+    const srcset = isLocal
+      ? `srcset="${getNFResize(href, 640, 640)}, ${getNFResize(
+          href,
+          960,
+          960
+        )} 1.5x, ${getNFResize(href, 1280, 1280)} 2x"`
+      : ''
 
     return `
       <figure>
         <img
           alt="${text}"
+          ${srcset}
           src="${src}"
         />
         ${figcaption}