IP测速页面调整：1）修复 `测速未通过的IP却排在前面` 的问题；2）测速IP后面显示DNS名称 (#336)

packages/gui/src/view/pages/server.vue

@@ -146,7 +146,7 @@
 <!--          </a-row>-->
 <!--        </a-tab-pane>-->
         <a-tab-pane tab="IP测速" key="7">
-          <div style="padding-right: 10px">
+          <div class="ip-tester" style="padding-right: 10px">
             <a-alert type="info" message="对从dns获取到的ip进行测速，使用速度最快的ip进行访问。（对使用增强功能的域名没啥用）"></a-alert>
             <a-form-item label="开启dns测速" :label-col="labelCol" :wrapper-col="wrapperCol">
               <a-checkbox v-model="getSpeedTestConfig().enabled">
@@ -200,8 +200,8 @@
                     <a-icon v-else type="info-circle"/>
                   </a>
                   <a-tag style="margin:2px;" v-for="(element,index) of item.backupList" :title="element.dns"
-                         :color="element.time?'green':'red'" :key='index'>{{ element.host }}
-                    {{ element.time }}{{ element.time ? 'ms' : '' }}
+                         :color="element.time?'green':'red'" :key='index'>
+                    {{ element.host }} {{ element.time }}{{ element.time ? 'ms' : '' }} {{ element.dns }}
                   </a-tag>
                 </a-card>
               </a-col>

packages/mitmproxy/src/lib/speed/SpeedTester.js

@@ -111,7 +111,18 @@ class SpeedTester {
       _.merge(item, ret)
       aliveList.push({ ...ret, ...item })
       aliveList.sort((a, b) => a.time - b.time)
-      this.backupList.sort((a, b) => a.time - b.time)
+      this.backupList.sort((a, b) => {
+        if (a.time === b.time) {
+          return 0
+        }
+        if (a.time == null) {
+          return 1
+        }
+        if (b.time == null) {
+          return -1
+        }
+        return a.time - b.time
+      })
     } catch (e) {
       if (e.message !== 'timeout') {
         log.warn('[speed] test error:  ', this.hostname, `➜ ${item.host}:${item.port} from DNS '${item.dns}'`, ', errorMsg:', e.message)