diff --git a/.changeset/shy-needles-count.md b/.changeset/shy-needles-count.md
new file mode 100644
index 0000000000..e668d7821a
--- /dev/null
+++ b/.changeset/shy-needles-count.md
@@ -0,0 +1,8 @@
+---
+"@lynx-js/web-elements-template": patch
+"@lynx-js/web-elements": patch
+---
+
+perf: add loading="lazy" for image element
+
+https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/img#loading
diff --git a/packages/web-platform/web-elements-template/src/index.ts b/packages/web-platform/web-elements-template/src/index.ts
index 8d73b5afec..41988e991f 100644
--- a/packages/web-platform/web-elements-template/src/index.ts
+++ b/packages/web-platform/web-elements-template/src/index.ts
@@ -94,7 +94,9 @@ export const templateXImage = (attributes: { src?: string }) => {
       'detected <script, this is a potential XSS attack, please check your src',
     );
   }
-  return `<img part="img" alt="" id="img" ${src ? `src="${src}"` : ''}/> `;
+  return `<img part="img" alt="" loading="lazy" id="img" ${
+    src ? `src="${src}"` : ''
+  }/> `;
 };
 
 export const templateFilterImage = templateXImage;