From ab9be4e5cdc1ee4b891529cd34cb63ba8b96d3c2 Mon Sep 17 00:00:00 2001
From: Yangshun <tay.yang.shun@gmail.com>
Date: Wed, 16 Mar 2022 10:39:53 +0800
Subject: [PATCH] website: make React not re-render Carbon

---
 website/src/theme/DocItem/index.js | 20 ++++++++++++++------
 1 file changed, 14 insertions(+), 6 deletions(-)

diff --git a/website/src/theme/DocItem/index.js b/website/src/theme/DocItem/index.js
index d919f8df..3ba7e6ba 100644
--- a/website/src/theme/DocItem/index.js
+++ b/website/src/theme/DocItem/index.js
@@ -12,6 +12,19 @@ import styles from './styles.module.css';
 import {ThemeClassNames, useWindowSize} from '@docusaurus/theme-common';
 import SidebarAd from '../../components/SidebarAd';
 
+const CarbonAd = React.memo(() => {
+  return (
+    <div>
+      <script
+        async
+        type="text/javascript"
+        src="//cdn.carbonads.com/carbon.js?serve=CEAI4537&placement=wwwtechinterviewhandbookorg"
+        id="_carbonads_js"
+      />
+    </div>
+  );
+});
+
 export default function DocItem(props) {
   const {content: DocContent} = props;
   const {metadata, frontMatter} = DocContent;
@@ -80,12 +93,7 @@ export default function DocItem(props) {
                 )}
                 <DocItemFooter {...props} />
                 <div className="margin-top--md">
-                  <script
-                    async
-                    type="text/javascript"
-                    src="//cdn.carbonads.com/carbon.js?serve=CEAI4537&placement=wwwtechinterviewhandbookorg"
-                    id="_carbonads_js"
-                  />
+                  <CarbonAd />
                 </div>
                 <div className="margin-top--md">
                   <DocContent />