From e04ec712ea5582d32dc723cc1ebcef4d192ab185 Mon Sep 17 00:00:00 2001
From: kunish <kunish.butt@gmail.com>
Date: Sun, 17 Sep 2023 03:09:56 +0800
Subject: [PATCH] perf: batch signals

---
 src/pages/Setup.tsx    | 10 +++++-----
 src/signals/proxies.ts | 20 +++++++++++++-------
 2 files changed, 18 insertions(+), 12 deletions(-)

diff --git a/src/pages/Setup.tsx b/src/pages/Setup.tsx
index 61c6039..78926b9 100644
--- a/src/pages/Setup.tsx
+++ b/src/pages/Setup.tsx
@@ -131,7 +131,7 @@ export default () => {
   })
 
   return (
-    <div class="mx-auto flex max-w-screen-md flex-col items-center gap-4 py-10">
+    <div class="mx-auto flex max-w-screen-sm flex-col items-center gap-4 py-10">
       <form class="contents" use:form={form}>
         <div class="flex w-full flex-col gap-4">
           <div class="flex-1">
@@ -165,20 +165,20 @@ export default () => {
             />
           </div>
 
-          <Button type="submit" class="btn-primary join-item uppercase">
+          <Button type="submit" class="btn-primary uppercase">
             {t('add')}
           </Button>
         </div>
       </form>
 
-      <div class="flex w-full flex-col gap-4">
+      <div class="grid w-full grid-cols-2 gap-4">
         <For each={endpointList()}>
           {({ id, url }) => (
             <div
-              class="badge badge-info flex w-full cursor-pointer items-center gap-4 py-4"
+              class="badge badge-info flex w-full cursor-pointer items-center justify-between gap-4 py-4"
               onClick={() => onEndpointSelect(id)}
             >
-              {url}
+              <span class="truncate">{url}</span>
 
               <Button
                 class="btn-circle btn-ghost btn-xs text-white"
diff --git a/src/signals/proxies.ts b/src/signals/proxies.ts
index 6c81c0b..9a9bb0b 100644
--- a/src/signals/proxies.ts
+++ b/src/signals/proxies.ts
@@ -1,4 +1,4 @@
-import { createSignal, untrack } from 'solid-js'
+import { batch, createSignal, untrack } from 'solid-js'
 import {
   closeSingleConnectionAPI,
   fetchProxiesAPI,
@@ -10,6 +10,7 @@ import {
 } from '~/apis'
 import {
   autoCloseConns,
+  latencyQualityMap,
   latencyTestTimeoutDuration,
   latestConnectionMsg,
   mergeAllConnections,
@@ -40,7 +41,8 @@ const setProxiesInfo = (proxies: (Proxy | ProxyNode)[]) => {
   const newLatencyMap = { ...latencyMap() }
 
   proxies.forEach((proxy) => {
-    const latency = proxy.history.at(-1)?.delay || -1
+    const latency =
+      proxy.history.at(-1)?.delay || latencyQualityMap().NOT_CONNECTED
 
     newProxyNodeMap[proxy.name] = {
       udp: proxy.udp,
@@ -52,8 +54,10 @@ const setProxiesInfo = (proxies: (Proxy | ProxyNode)[]) => {
     newLatencyMap[proxy.name] = latency
   })
 
-  setProxyNodeMap(newProxyNodeMap)
-  setLatencyMap(newLatencyMap)
+  batch(() => {
+    setProxyNodeMap(newProxyNodeMap)
+    setLatencyMap(newLatencyMap)
+  })
 }
 
 export const useProxies = () => {
@@ -79,9 +83,11 @@ export const useProxies = () => {
       ...sortedProviders.flatMap((provider) => provider.proxies),
     ]
 
-    setProxies(sortedProxies)
-    setProxyProviders(sortedProviders)
-    setProxiesInfo(allProxies)
+    batch(() => {
+      setProxies(sortedProxies)
+      setProxyProviders(sortedProviders)
+      setProxiesInfo(allProxies)
+    })
   }
 
   const setProxyGroupByProxyName = async (proxy: Proxy, proxyName: string) => {