diff --git a/components/LazyImage.js b/components/LazyImage.js
index 039fed37656..02f1df19952 100644
--- a/components/LazyImage.js
+++ b/components/LazyImage.js
@@ -18,6 +18,7 @@ export default function LazyImage({
   height,
   title,
   onLoad,
+  onClick,
   style
 }) {
   const maxWidth = siteConfig('IMAGE_COMPRESS_WIDTH')
@@ -122,7 +123,9 @@ export default function LazyImage({
   if (style) {
     imgProps.style = style
   }
-
+  if (onClick) {
+    imgProps.onClick = onClick
+  }
   return (
     <>
       {/* eslint-disable-next-line @next/next/no-img-element */}
diff --git a/themes/starter/components/Logo.js b/themes/starter/components/Logo.js
index c73cd4ceef6..b691e2d04bb 100644
--- a/themes/starter/components/Logo.js
+++ b/themes/starter/components/Logo.js
@@ -1,5 +1,6 @@
 /* eslint-disable @next/next/no-img-element */
 /* eslint-disable @next/next/no-html-link-for-pages */
+import LazyImage from '@/components/LazyImage'
 import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
 import throttle from 'lodash.throttle'
@@ -48,14 +49,14 @@ export const Logo = props => {
       <div className='navbar-logo flex items-center w-full py-5 cursor-pointer'>
         {/* eslint-disable-next-line @next/next/no-img-element */}
         {logo && (
-          <img
+          <LazyImage
+            priority
             onClick={() => {
               router.push('/')
             }}
             src={logo}
-            height={14}
             alt='logo'
-            className='header-logo w-full mr-1'
+            className='header-logo mr-1 h-8'
           />
         )}
         {/* logo文字 */}