!786 Fix WebUI issue due to network latency
Merge pull request !786 from Maxiaoqi/ui-enhancement
This commit is contained in:
Gitee
commit
571247be19
|
|
@ -56,10 +56,7 @@ import javax.annotation.PreDestroy;
|
|||
import javax.annotation.concurrent.GuardedBy;
|
||||
import javax.inject.Inject;
|
||||
|
||||
import java.io.BufferedReader;
|
||||
import java.io.IOException;
|
||||
import java.io.InputStreamReader;
|
||||
import java.net.URI;
|
||||
import java.util.ArrayList;
|
||||
import java.util.HashMap;
|
||||
import java.util.HashSet;
|
||||
|
|
@ -84,7 +81,6 @@ import static com.google.common.collect.ImmutableList.toImmutableList;
|
|||
import static com.google.common.collect.ImmutableSet.toImmutableSet;
|
||||
import static com.google.common.collect.MoreCollectors.toOptional;
|
||||
import static com.google.common.collect.Sets.difference;
|
||||
import static io.airlift.http.client.HttpUriBuilder.uriBuilderFrom;
|
||||
import static io.airlift.units.DataSize.succinctBytes;
|
||||
import static io.airlift.units.Duration.nanosSince;
|
||||
import static io.prestosql.ExceededMemoryLimitException.exceededGlobalTotalLimit;
|
||||
|
|
@ -540,8 +536,9 @@ public class ClusterMemoryManager
|
|||
// Add new nodes
|
||||
for (InternalNode node : aliveNodes) {
|
||||
if (!nodes.containsKey(node.getNodeIdentifier()) && shouldIncludeNode(node)) {
|
||||
nodes.put(node.getNodeIdentifier(), new RemoteNodeMemory(node, httpClient, memoryInfoCodec, assignmentsRequestCodec, locationFactory.createMemoryInfoLocation(node), isBinaryEncoding));
|
||||
allNodes.put(node.getNodeIdentifier(), new RemoteNodeMemory(node, httpClient, memoryInfoCodec, assignmentsRequestCodec, locationFactory.createMemoryInfoLocation(node), isBinaryEncoding));
|
||||
// nodes.put(node.getNodeIdentifier(), new RemoteNodeMemory(node, httpClient, memoryInfoCodec, assignmentsRequestCodec, locationFactory.createMemoryInfoLocation(node), isBinaryEncoding));
|
||||
nodes.put(node.getInternalUri().toString(), new RemoteNodeMemory(node, httpClient, memoryInfoCodec, assignmentsRequestCodec, locationFactory.createMemoryInfoLocation(node), isBinaryEncoding));
|
||||
allNodes.put(node.getInternalUri().toString(), new RemoteNodeMemory(node, httpClient, memoryInfoCodec, assignmentsRequestCodec, locationFactory.createMemoryInfoLocation(node), isBinaryEncoding));
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -614,29 +611,28 @@ public class ClusterMemoryManager
|
|||
for (Entry<String, RemoteNodeMemory> entry : allNodes.entrySet()) {
|
||||
// workerId is of the form "node_identifier [node_host] role"
|
||||
InternalNode node = entry.getValue().getNode();
|
||||
String role = node.isCoordinator() ? (node.isWorker() ? "Coordinator & Worker" : "Coordinator") :
|
||||
"Worker";
|
||||
String workerId = "[" + entry.getValue().getNode().getInternalUri().toString() + "] " + role;
|
||||
URI stateURI = uriBuilderFrom(entry.getValue().getNode().getInternalUri())
|
||||
.appendPath("/v1/info/state")
|
||||
.build();
|
||||
StringBuilder role = new StringBuilder(node.isCoordinator() ? (node.isWorker() ? "Coordinator & Worker" : "Coordinator") :
|
||||
"Worker");
|
||||
role = new StringBuilder("\"" + role + "\"");
|
||||
String workerId = entry.getValue().getNode().getInternalUri().toString();
|
||||
String stateTemp = "\"" + NodeState.DISCONNECTION + "\"";
|
||||
try (
|
||||
InputStreamReader inputStreamReader = new InputStreamReader(stateURI.toURL().openStream());
|
||||
BufferedReader reader = new BufferedReader(inputStreamReader)) {
|
||||
stateTemp = reader.readLine();
|
||||
}
|
||||
catch (IOException e) {
|
||||
log.info("Worker disconnect");
|
||||
if (nodes.containsKey(entry.getKey())) {
|
||||
stateTemp = "\"" + ACTIVE + "\"";
|
||||
}
|
||||
String state = stateTemp.substring(0, 2).toUpperCase(Locale.ENGLISH) + stateTemp.substring(2).toLowerCase(Locale.ENGLISH);
|
||||
String id = "\"" + node.getNodeIdentifier() + "\"";
|
||||
JsonNode jsonNode = null;
|
||||
try {
|
||||
MemoryInfo info = entry.getValue().getInfo().orElse(new MemoryInfo(0, 0, 0, new DataSize(0,
|
||||
DataSize.Unit.BYTE), new HashMap<>()));
|
||||
MemoryInfo activeInfo = new MemoryInfo(0, 0, 0, new DataSize(0,
|
||||
DataSize.Unit.BYTE), new HashMap<>());
|
||||
for (Entry<String, RemoteNodeMemory> activeEntry : nodes.entrySet()) {
|
||||
activeInfo = activeEntry.getValue().getInfo().orElse(new MemoryInfo(0, 0, 0, new DataSize(0,
|
||||
DataSize.Unit.BYTE), new HashMap<>()));
|
||||
break;
|
||||
}
|
||||
MemoryInfo info = entry.getValue().getInfo().orElse(activeInfo);
|
||||
String memoryInfoJson = new ObjectMapper().writeValueAsString(info);
|
||||
StringBuilder memoryAndStateInfo = new StringBuilder(memoryInfoJson).insert(memoryInfoJson.length() - 1, ",\"state\":" + state + ",\"id\":" + id);
|
||||
StringBuilder memoryAndStateInfo = new StringBuilder(memoryInfoJson).insert(memoryInfoJson.length() - 1, ",\"state\":" + state + ",\"id\":" + id + ",\"role\":" + role);
|
||||
jsonNode = new ObjectMapper().readTree(memoryAndStateInfo.toString());
|
||||
}
|
||||
catch (JsonProcessingException e) {
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -16,7 +16,7 @@ import React from "react";
|
|||
import Header from '../queryeditor/components/Header';
|
||||
import Footer from "../queryeditor/components/Footer";
|
||||
import StatusFooter from "../queryeditor/components/StatusFooter";
|
||||
import { formatDataSizeBytes } from "../utils";
|
||||
import {formatDataSizeBytes} from "../utils";
|
||||
import NavigationMenu from "../NavigationMenu";
|
||||
import OverviewStore from "../overview/OverviewStore";
|
||||
import OverviewActions from "./OverviewActions";
|
||||
|
|
@ -30,6 +30,7 @@ class NodesMain extends React.Component {
|
|||
this._onChange = this._onChange.bind(this);
|
||||
this.lineDatas = this.lineDatas.bind(this);
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
OverviewStore.listen(this._onChange);
|
||||
this.lineDatas();
|
||||
|
|
@ -53,10 +54,9 @@ class NodesMain extends React.Component {
|
|||
if (data.memoryData) {
|
||||
Object.keys(data.memoryData).map(key => {
|
||||
let obj = {};
|
||||
// obj.id = key.slice(0, key.indexOf(" "));
|
||||
obj.id = data.memoryData[key].id;
|
||||
obj.ip = key.slice(key.indexOf("[") + 1, key.indexOf("]"));
|
||||
obj.role = key.slice(key.indexOf("]") + 2);
|
||||
obj.ip = key;
|
||||
obj.role = data.memoryData[key].role;
|
||||
obj.count = data.memoryData[key].availableProcessors;
|
||||
let totalMemory = data.memoryData[key].totalNodeMemory.slice(0, -1);
|
||||
obj.nodeMemory = totalMemory;
|
||||
|
|
@ -75,40 +75,40 @@ class NodesMain extends React.Component {
|
|||
return (
|
||||
<div>
|
||||
<div className='flex flex-row flex-initial header'>
|
||||
<Header />
|
||||
<Header/>
|
||||
</div>
|
||||
<div className='nodes'>
|
||||
<NavigationMenu active={"nodes"} />
|
||||
<NavigationMenu active={"nodes"}/>
|
||||
<div className="line-right">
|
||||
<div className="line-show">
|
||||
<div className="summary-table">
|
||||
<h3>Cluster Nodes</h3>
|
||||
<table className="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>ID</th>
|
||||
<th>IP</th>
|
||||
<th>Role</th>
|
||||
<th>CPU Count</th>
|
||||
<th>Usable Node Memory</th>
|
||||
<th>Used Memory</th>
|
||||
<th>Free Memory</th>
|
||||
<th>State</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>ID</th>
|
||||
<th>IP</th>
|
||||
<th>Role</th>
|
||||
<th>CPU Count</th>
|
||||
<th>Usable Node Memory</th>
|
||||
<th>Used Memory</th>
|
||||
<th>Free Memory</th>
|
||||
<th>State</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{this.state.tableData.map((ele, index) => (
|
||||
<tr key={index}>
|
||||
<td>{ele.id}</td>
|
||||
<td>{ele.ip}</td>
|
||||
<td>{ele.role}</td>
|
||||
<td>{ele.count}</td>
|
||||
<td>{formatDataSizeBytes(ele.nodeMemory)}</td>
|
||||
<td>{formatDataSizeBytes(ele.usedMemory)}</td>
|
||||
<td>{formatDataSizeBytes(ele.freeMemory)}</td>
|
||||
<td>{ele.state}</td>
|
||||
</tr>
|
||||
))}
|
||||
{this.state.tableData.map((ele, index) => (
|
||||
<tr key={index}>
|
||||
<td>{ele.id}</td>
|
||||
<td>{ele.ip}</td>
|
||||
<td>{ele.role}</td>
|
||||
<td>{ele.count}</td>
|
||||
<td>{formatDataSizeBytes(ele.nodeMemory)}</td>
|
||||
<td>{formatDataSizeBytes(ele.usedMemory)}</td>
|
||||
<td>{formatDataSizeBytes(ele.freeMemory)}</td>
|
||||
<td>{ele.state}</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
|
@ -116,10 +116,10 @@ class NodesMain extends React.Component {
|
|||
</div>
|
||||
</div>
|
||||
<div className='flex flex-row flex-initial statusFooter'>
|
||||
<StatusFooter />
|
||||
<StatusFooter/>
|
||||
</div>
|
||||
<div className='flex flex-row flex-initial footer'>
|
||||
<Footer />
|
||||
<Footer/>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
|
|
|||
Loading…
Reference in New Issue