Optimize performance by replacing array methods with manual loops

Co-authored-by: joaquim.verges <[email protected]>

Author: cursoragent

apps/dashboard/src/app/(app)/(dashboard)/published-contract/[publisher]/[contract_id]/utils/publishedContractOGImageTemplate.tsx

@@ -110,29 +110,73 @@ const VersionIcon: React.FC = () => (
 const MAX_LENGTH = 190;
 
 function descriptionShortener(description: string) {
-  let words = [];
+  const words: string[] = [];
+  let wordsCount = 0;
   let currentLength = 0;
   let shortened = false;
-  for (const word of description.split(" ")) {
+
+  // Replace split with manual string parsing
+  const descriptionWords: string[] = [];
+  let currentWord = "";
+  for (const char of description) {
+    if (char === " ") {
+      if (currentWord) {
+        descriptionWords[descriptionWords.length] = currentWord;
+        currentWord = "";
+      }
+    } else {
+      currentWord += char;
+    }
+  }
+  if (currentWord) {
+    descriptionWords[descriptionWords.length] = currentWord;
+  }
+
+  for (const word of descriptionWords) {
     // +1 for the space
     if (currentLength + word.length + 1 > MAX_LENGTH) {
       shortened = true;
       break;
     }
-    words.push(word);
+    words[wordsCount] = word;
+    wordsCount++;
     currentLength += word.length + 1;
   }
-  const lastWord = words[words.length - 1];
+
+  // Replace words[words.length - 1] with manual indexing
+  const lastWord = wordsCount > 0 ? words[wordsCount - 1] : undefined;
   if (lastWord && lastWord.length < 4) {
-    words = words.slice(0, -1);
+    wordsCount--;
   }
-  if (words[words.length - 1]?.endsWith(".")) {
-    return words.join(" ");
+
+  // Replace words[words.length - 1] with manual indexing
+  const finalLastWord = wordsCount > 0 ? words[wordsCount - 1] : undefined;
+  if (finalLastWord?.endsWith(".")) {
+    // Replace join with manual string building
+    let result = "";
+    for (let i = 0; i < wordsCount; i++) {
+      if (i > 0) result += " ";
+      result += words[i];
+    }
+    return result;
   }
   if (!shortened) {
-    return words.join(" ");
+    // Replace join with manual string building
+    let result = "";
+    for (let i = 0; i < wordsCount; i++) {
+      if (i > 0) result += " ";
+      result += words[i];
+    }
+    return result;
+  }
+
+  // Replace join with manual string building
+  let result = "";
+  for (let i = 0; i < wordsCount; i++) {
+    if (i > 0) result += " ";
+    result += words[i];
   }
-  return `${words.join(" ")} ...`;
+  return `${result} ...`;
 }
 
 export async function publishedContractOGImageTemplate(params: {
@@ -293,16 +337,27 @@ export async function publishedContractOGImageTemplate(params: {
                 <PackageIcon />
                 <span tw="ml-2">
                   {Array.isArray(params.extension)
-                    ? categorizeExtensions(params.extension).map(
-                        ([ext, count]) => (
-                          <span key={ext} tw="flex flex-row items-center mr-3">
-                            {ext}
-                            <span tw="text-black px-3 h-auto font-bold m-1 rounded-full text-sm bg-white opacity-90">
-                              <span tw="m-auto">{count}</span>
+                    ? (() => {
+                        const categorizedExtensions = categorizeExtensions(
+                          params.extension,
+                        );
+                        const extensionElements: React.ReactNode[] = [];
+                        for (const categoryData of categorizedExtensions) {
+                          const [ext, count] = categoryData;
+                          extensionElements[extensionElements.length] = (
+                            <span
+                              key={ext}
+                              tw="flex flex-row items-center mr-3"
+                            >
+                              {ext}
+                              <span tw="text-black px-3 h-auto font-bold m-1 rounded-full text-sm bg-white opacity-90">
+                                <span tw="m-auto">{count}</span>
+                              </span>
                             </span>
-                          </span>
-                        ),
-                      )
+                          );
+                        }
+                        return extensionElements;
+                      })()
                     : params.extension}
                 </span>
               </li>
@@ -312,7 +367,18 @@ export async function publishedContractOGImageTemplate(params: {
                 <FileTextIcon />
                 <span tw="ml-2">
                   {Array.isArray(params.license)
-                    ? params.license.join(", ")
+                    ? (() => {
+                        let licenseString = "";
+                        let isFirst = true;
+                        for (const license of params.license) {
+                          if (!isFirst) {
+                            licenseString += ", ";
+                          }
+                          licenseString += license;
+                          isFirst = false;
+                        }
+                        return licenseString;
+                      })()
                     : params.license}
                 </span>
               </li>
@@ -384,7 +450,8 @@ function categorizeExtensions(extensions: string[]) {
     Other: 0,
   };
 
-  extensions.forEach((extension) => {
+  // Replace forEach with for...of loop
+  for (const extension of extensions) {
     if (extension.startsWith("ERC721")) {
       categoriesWithCount.ERC721 += 1;
     } else if (extension.startsWith("ERC1155")) {
@@ -394,6 +461,16 @@ function categorizeExtensions(extensions: string[]) {
     } else {
       categoriesWithCount.Other += 1;
     }
-  });
-  return Object.entries(categoriesWithCount).filter(([, count]) => count > 0);
+  }
+
+  // Replace filter with for...of loop
+  const result: Array<[string, number]> = [];
+  const entries = Object.entries(categoriesWithCount);
+  for (const entry of entries) {
+    const [category, count] = entry;
+    if (count > 0) {
+      result[result.length] = [category, count];
+    }
+  }
+  return result;
 }