refactor(benchmarks): organize imports

benchmarks/benchmark.mjs

@@ -1,5 +1,5 @@
-import _ from 'lodash';
 import Benchmark from 'benchmark';
+import _ from 'lodash';
 
 // avoid `Cannot read property 'parentNode' of undefined` error in runScript
 const script = document.createElement('script');

benchmarks/main.jsx

@@ -1,7 +1,5 @@
 import 'style.css';
-
-import { m, createElement, style, kebab, patch } from '../src/index';
-
+import { createElement, patch } from '../src/index';
 import appendManyRowsToLargeTable from './suites/appendManyRowsToLargeTable';
 import clearRows from './suites/clearRows';
 import createManyRows from './suites/createManyRows';
@@ -39,6 +37,19 @@ const suites = [
     }),
 );
 
+const generateLogMarkdown = () =>
+  `Benchmarks compiled on \`${new Date().toLocaleString()}\`\n\n**UA:** ${
+    navigator.userAgent
+  }\n\n---\n\n${[...logs]
+    .map((logGroup) => {
+      const logGroupCopy = [...logGroup];
+      const title = logGroupCopy.shift();
+      return `${title.replace('Running: ', '').split(' - ')[0]}\n\n\`\`\`\n${logGroupCopy.join(
+        '\n',
+      )}\n\`\`\`\n`;
+    })
+    .join('\n')}`;
+
 const vnode = () => (
   <div>
     {suites.map((suite) => {
@@ -72,19 +83,7 @@ const vnode = () => (
         </button>{' '}
         <button
           onclick={async () => {
-            navigator.clipboard.writeText(
-              `Benchmarks compiled on \`${new Date().toLocaleString()}\`\n\n**UA:** ${
-                navigator.userAgent
-              }\n\n---\n\n${[...logs]
-                .map((logGroup) => {
-                  const logGroupCopy = [...logGroup];
-                  const title = logGroupCopy.shift();
-                  return `${
-                    title.replace('Running: ', '').split(' - ')[0]
-                  }\n\n\`\`\`\n${logGroupCopy.join('\n')}\n\`\`\`\n`;
-                })
-                .join('\n')}`,
-            );
+            navigator.clipboard.writeText(generateLogMarkdown());
           }}
         >
           📋
@@ -94,7 +93,11 @@ const vnode = () => (
       <div style={{ paddingTop: '20px' }}>
         {logs.map(
           (logGroup) =>
-            logGroup.length && m('pre', undefined, [m('code', undefined, [logGroup.join('\n')])]),
+            logGroup.length && (
+              <pre>
+                <code>{logGroup.join('\n')}</code>
+              </pre>
+            ),
         )}
       </div>
     </details>
@@ -114,19 +117,7 @@ const vnode = () => (
           </button>{' '}
           <button
             onclick={async () => {
-              navigator.clipboard.writeText(
-                `Benchmarks compiled on \`${new Date().toLocaleString()}\`\n\n**UA:** ${
-                  navigator.userAgent
-                }\n\n---\n\n${[...logs]
-                  .map((logGroup) => {
-                    const logGroupCopy = [...logGroup];
-                    const title = logGroupCopy.shift();
-                    return `${
-                      title.replace('Running: ', '').split(' - ')[0]
-                    }\n\n\`\`\`\n${logGroupCopy.join('\n')}\n\`\`\`\n`;
-                  })
-                  .join('\n')}`,
-              );
+              navigator.clipboard.writeText(generateLogMarkdown());
             }}
           >
             📋

benchmarks/suites/appendManyRowsToLargeTable.jsx

@@ -3,8 +3,8 @@
  * @description appending 1,000 to a table of 10,000 rows.
  */
 
-import { Suite } from '../benchmark';
 import { createElement, patch } from '../../src/index';
+import { Suite } from '../benchmark';
 import { buildData } from '../data';
 
 const data = buildData(10000);

benchmarks/suites/clearRows.jsx

@@ -3,8 +3,8 @@
  * @description clearing a table with 1,000 rows
  */
 
-import { Suite } from '../benchmark';
 import { createElement, patch } from '../../src/index';
+import { Suite } from '../benchmark';
 import { buildData } from '../data';
 
 const data = buildData(1000);

benchmarks/suites/createManyRows.jsx

@@ -3,8 +3,8 @@
  * @description creating 10,000 rows
  */
 
-import { Suite } from '../benchmark';
 import { createElement, patch } from '../../src/index';
+import { Suite } from '../benchmark';
 import { buildData } from '../data';
 
 const data = buildData(10000);

benchmarks/suites/createRows.jsx

@@ -3,8 +3,8 @@
  * @description creating 1,000 rows
  */
 
-import { Suite } from '../benchmark';
 import { createElement, patch } from '../../src/index';
+import { Suite } from '../benchmark';
 import { buildData } from '../data';
 
 const data = buildData(10000);

benchmarks/suites/partialUpdate.jsx

@@ -3,8 +3,8 @@
  * @description updating every 10th row for 1,000 rows
  */
 
-import { Suite } from '../benchmark';
 import { createElement, patch, UPDATE } from '../../src/index';
+import { Suite } from '../benchmark';
 import { buildData } from '../data';
 
 const data = buildData(1000);

benchmarks/suites/removeRow.jsx

@@ -3,8 +3,8 @@
  * @description removing one row
  */
 
+import { createElement, DELETE, patch } from '../../src/index';
 import { Suite } from '../benchmark';
-import { createElement, patch, DELETE } from '../../src/index';
 import { buildData } from '../data';
 
 const data = buildData(1000);

benchmarks/suites/replaceAllRows.jsx

@@ -3,8 +3,8 @@
  * @description updating all 1,000 rows
  */
 
-import { Suite } from '../benchmark';
 import { createElement, patch } from '../../src/index';
+import { Suite } from '../benchmark';
 import { buildData } from '../data';
 
 const shuffleArray = (array) => {

benchmarks/suites/swapRows.jsx

@@ -3,8 +3,8 @@
  * @description swap 2 rows for table with 1,000 rows
  */
 
+import { createElement, patch, UPDATE } from '../../src/index';
 import { Suite } from '../benchmark';
-import { m, createElement, patch, VFlags, UPDATE } from '../../src/index';
 import { buildData } from '../data';
 
 const data = buildData(1000);