Initial MacTaskManager release
This commit is contained in:
@@ -0,0 +1,794 @@
|
||||
import Charts
|
||||
import SwiftUI
|
||||
|
||||
struct PerformanceView: View {
|
||||
@Environment(SystemMonitor.self) private var monitor
|
||||
@AppStorage("performanceSelectedMetric") private var selectedMetric: PerformanceMetric = .cpu
|
||||
@AppStorage("performanceCPUDisplayMode") private var cpuDisplayMode: CPUDisplayMode = .summary
|
||||
@State private var selectedVolumeID: String?
|
||||
|
||||
private enum PerformanceMetric: String, CaseIterable, Identifiable {
|
||||
case cpu = "CPU"
|
||||
case memory = "Memory"
|
||||
case disk = "Disk"
|
||||
case gpu = "GPU"
|
||||
case network = "Network"
|
||||
var id: String { rawValue }
|
||||
var icon: String {
|
||||
switch self {
|
||||
case .cpu: "cpu"
|
||||
case .memory: "memorychip"
|
||||
case .disk: "internaldrive"
|
||||
case .gpu: "rectangle.3.group"
|
||||
case .network: "network"
|
||||
}
|
||||
}
|
||||
var color: Color {
|
||||
switch self {
|
||||
case .cpu: .blue
|
||||
case .memory: .purple
|
||||
case .disk: .green
|
||||
case .gpu: .pink
|
||||
case .network: .teal
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var body: some View {
|
||||
VStack(spacing: 0) {
|
||||
PageHeader(title: "Performance") {
|
||||
UpdateStatus()
|
||||
}
|
||||
HStack(spacing: 0) {
|
||||
ScrollView {
|
||||
VStack(spacing: 10) {
|
||||
metricCard(.cpu, value: monitor.snapshot.cpuPercent, detail: "\(ProcessInfo.processInfo.activeProcessorCount) logical processors")
|
||||
metricCard(.memory, value: monitor.snapshot.memoryPercent, detail: "\(Formatters.bytes.string(fromByteCount: Int64(monitor.snapshot.memoryUsed))) of \(Formatters.bytes.string(fromByteCount: Int64(monitor.snapshot.memoryTotal)))")
|
||||
metricCard(
|
||||
.disk,
|
||||
value: monitor.snapshot.diskActivePercent,
|
||||
valueText: Formatters.rate(monitor.snapshot.diskThroughput),
|
||||
detail: "\(Formatters.percent(monitor.snapshot.diskActivePercent)) active • System volume"
|
||||
)
|
||||
ForEach(monitor.snapshot.removableVolumes) { volume in
|
||||
volumeCard(volume)
|
||||
}
|
||||
metricCard(
|
||||
.gpu,
|
||||
value: monitor.snapshot.gpuPercent,
|
||||
detail: "\(monitor.snapshot.gpuCoreCount) cores • \(Formatters.bytes.string(fromByteCount: Int64(monitor.snapshot.gpuMemoryBytes))) in use"
|
||||
)
|
||||
metricCard(
|
||||
.network,
|
||||
value: 0,
|
||||
valueText: Formatters.rate(monitor.snapshot.networkReceiveRate + monitor.snapshot.networkSendRate),
|
||||
detail: "↓ \(Formatters.rate(monitor.snapshot.networkReceiveRate)) ↑ \(Formatters.rate(monitor.snapshot.networkSendRate))"
|
||||
)
|
||||
}
|
||||
.padding(14)
|
||||
}
|
||||
.frame(width: 245)
|
||||
.background(Color(nsColor: .controlBackgroundColor).opacity(0.45))
|
||||
Divider()
|
||||
detail
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private func metricCard(_ metric: PerformanceMetric, value: Double, valueText: String? = nil, detail: String) -> some View {
|
||||
Button {
|
||||
selectedVolumeID = nil
|
||||
selectedMetric = metric
|
||||
} label: {
|
||||
HStack(spacing: 12) {
|
||||
Image(systemName: metric.icon)
|
||||
.font(.title3)
|
||||
.foregroundStyle(metric.color)
|
||||
.frame(width: 30)
|
||||
VStack(alignment: .leading, spacing: 3) {
|
||||
Text(metric.rawValue).font(.headline)
|
||||
Text(valueText ?? Formatters.percent(value)).font(.title3.monospacedDigit())
|
||||
Text(detail).font(.caption).foregroundStyle(.secondary).lineLimit(1)
|
||||
}
|
||||
Spacer()
|
||||
}
|
||||
.padding(12)
|
||||
.frame(maxWidth: .infinity, alignment: .leading)
|
||||
.background(selectedVolumeID == nil && selectedMetric == metric ? metric.color.opacity(0.13) : Color(nsColor: .windowBackgroundColor))
|
||||
.overlay {
|
||||
RoundedRectangle(cornerRadius: 9)
|
||||
.stroke(
|
||||
selectedVolumeID == nil && selectedMetric == metric ? metric.color : Color.secondary.opacity(0.15),
|
||||
lineWidth: selectedVolumeID == nil && selectedMetric == metric ? 1.5 : 1
|
||||
)
|
||||
}
|
||||
.clipShape(RoundedRectangle(cornerRadius: 9))
|
||||
}
|
||||
.buttonStyle(.plain)
|
||||
}
|
||||
|
||||
private func volumeCard(_ volume: VolumeSnapshot) -> some View {
|
||||
Button { selectedVolumeID = volume.id } label: {
|
||||
HStack(spacing: 12) {
|
||||
Image(systemName: volume.isEjectable ? "externaldrive.badge.checkmark" : "externaldrive")
|
||||
.font(.title3)
|
||||
.foregroundStyle(.orange)
|
||||
.frame(width: 30)
|
||||
VStack(alignment: .leading, spacing: 3) {
|
||||
Text(volume.name).font(.headline).lineLimit(1)
|
||||
Text(Formatters.percent(volume.usedPercent)).font(.title3.monospacedDigit())
|
||||
Text("\(Formatters.bytes.string(fromByteCount: Int64(volume.capacity))) • \(volume.fileSystem)")
|
||||
.font(.caption).foregroundStyle(.secondary).lineLimit(1)
|
||||
}
|
||||
Spacer()
|
||||
}
|
||||
.padding(12)
|
||||
.frame(maxWidth: .infinity, alignment: .leading)
|
||||
.background(selectedVolumeID == volume.id ? Color.orange.opacity(0.13) : Color(nsColor: .windowBackgroundColor))
|
||||
.overlay {
|
||||
RoundedRectangle(cornerRadius: 9)
|
||||
.stroke(selectedVolumeID == volume.id ? Color.orange : Color.secondary.opacity(0.15), lineWidth: selectedVolumeID == volume.id ? 1.5 : 1)
|
||||
}
|
||||
.clipShape(RoundedRectangle(cornerRadius: 9))
|
||||
}
|
||||
.buttonStyle(.plain)
|
||||
.accessibilityLabel("\(volume.name), removable disk")
|
||||
.accessibilityValue("\(Formatters.percent(volume.usedPercent)) used")
|
||||
}
|
||||
|
||||
@ViewBuilder
|
||||
private var detail: some View {
|
||||
if let selectedVolumeID,
|
||||
let volume = monitor.snapshot.removableVolumes.first(where: { $0.id == selectedVolumeID }) {
|
||||
RemovableDiskDetail(volume: volume)
|
||||
} else {
|
||||
switch selectedMetric {
|
||||
case .cpu:
|
||||
CPUPerformanceDetail(
|
||||
subtitle: processorName,
|
||||
value: monitor.snapshot.cpuPercent,
|
||||
history: monitor.cpuHistory,
|
||||
coreHistories: monitor.coreHistories,
|
||||
coreValues: monitor.snapshot.corePercents,
|
||||
displayMode: $cpuDisplayMode,
|
||||
stats: [
|
||||
("Processes", "\(monitor.snapshot.processCount)"),
|
||||
("Threads", "\(monitor.snapshot.threadCount)"),
|
||||
("Uptime", Formatters.uptime(monitor.snapshot.uptime)),
|
||||
("Logical processors", "\(ProcessInfo.processInfo.activeProcessorCount)")
|
||||
]
|
||||
)
|
||||
case .memory:
|
||||
PerformanceDetail(
|
||||
title: "Memory",
|
||||
subtitle: Formatters.bytes.string(fromByteCount: Int64(monitor.snapshot.memoryTotal)),
|
||||
color: .purple,
|
||||
value: monitor.snapshot.memoryPercent,
|
||||
history: monitor.memoryHistory,
|
||||
stats: [
|
||||
("In use", Formatters.bytes.string(fromByteCount: Int64(monitor.snapshot.memoryUsed))),
|
||||
("Available", Formatters.bytes.string(fromByteCount: Int64(monitor.snapshot.memoryTotal - monitor.snapshot.memoryUsed))),
|
||||
("Active", Formatters.bytes.string(fromByteCount: Int64(monitor.snapshot.memoryActive))),
|
||||
("Cached", Formatters.bytes.string(fromByteCount: Int64(monitor.snapshot.memoryCached))),
|
||||
("Wired", Formatters.bytes.string(fromByteCount: Int64(monitor.snapshot.memoryWired))),
|
||||
("Compressed", Formatters.bytes.string(fromByteCount: Int64(monitor.snapshot.memoryCompressed))),
|
||||
("Swap", "\(Formatters.bytes.string(fromByteCount: Int64(monitor.snapshot.swapUsed))) / \(Formatters.bytes.string(fromByteCount: Int64(monitor.snapshot.swapTotal)))"),
|
||||
("Type", monitor.snapshot.memoryType),
|
||||
("Frequency / speed", monitor.snapshot.memorySpeed),
|
||||
("Manufacturer", monitor.snapshot.memoryManufacturer)
|
||||
]
|
||||
)
|
||||
case .disk:
|
||||
DiskPerformanceDetail(
|
||||
snapshot: monitor.snapshot,
|
||||
readHistory: monitor.diskReadHistory,
|
||||
writeHistory: monitor.diskWriteHistory,
|
||||
latencyHistory: monitor.diskLatencyHistory,
|
||||
activeHistory: monitor.diskActiveHistory
|
||||
)
|
||||
case .gpu:
|
||||
GPUPerformanceDetail(
|
||||
name: "\(processorName) GPU",
|
||||
snapshot: monitor.snapshot,
|
||||
history: monitor.gpuHistory,
|
||||
rendererHistory: monitor.gpuRendererHistory,
|
||||
tilerHistory: monitor.gpuTilerHistory
|
||||
)
|
||||
case .network:
|
||||
NetworkPerformanceDetail(
|
||||
interface: monitor.snapshot.networkInterface,
|
||||
receiveRate: monitor.snapshot.networkReceiveRate,
|
||||
sendRate: monitor.snapshot.networkSendRate,
|
||||
receiveHistory: monitor.networkReceiveHistory,
|
||||
sendHistory: monitor.networkSendHistory
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private var processorName: String {
|
||||
var size = 0
|
||||
guard sysctlbyname("machdep.cpu.brand_string", nil, &size, nil, 0) == 0, size > 1 else {
|
||||
return "Apple Silicon"
|
||||
}
|
||||
var buffer = [CChar](repeating: 0, count: size)
|
||||
guard sysctlbyname("machdep.cpu.brand_string", &buffer, &size, nil, 0) == 0 else {
|
||||
return "Apple Silicon"
|
||||
}
|
||||
return String(decoding: buffer.prefix { $0 != 0 }.map(UInt8.init(bitPattern:)), as: UTF8.self)
|
||||
}
|
||||
}
|
||||
|
||||
private struct RemovableDiskDetail: View {
|
||||
let volume: VolumeSnapshot
|
||||
|
||||
var body: some View {
|
||||
ScrollView {
|
||||
VStack(alignment: .leading, spacing: 18) {
|
||||
VStack(alignment: .leading, spacing: 4) {
|
||||
Text(volume.name).font(.system(size: 30, weight: .semibold))
|
||||
Text("\(volume.fileSystem) • \(volume.mountPath)")
|
||||
.foregroundStyle(.secondary)
|
||||
}
|
||||
|
||||
HStack {
|
||||
Label(volume.isEjectable ? "Ejectable" : "Removable", systemImage: "externaldrive")
|
||||
.foregroundStyle(.orange)
|
||||
Spacer()
|
||||
Text(Formatters.percent(volume.usedPercent))
|
||||
.font(.system(size: 34, weight: .light).monospacedDigit())
|
||||
}
|
||||
|
||||
ProgressView(value: volume.usedPercent, total: 100)
|
||||
.tint(.orange)
|
||||
|
||||
StatsGrid(stats: [
|
||||
("Used", Formatters.bytes.string(fromByteCount: Int64(volume.used))),
|
||||
("Available", Formatters.bytes.string(fromByteCount: Int64(volume.available))),
|
||||
("Capacity", Formatters.bytes.string(fromByteCount: Int64(volume.capacity))),
|
||||
("Ejectable", volume.isEjectable ? "Yes" : "No")
|
||||
])
|
||||
}
|
||||
.padding(22)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private struct GPUPerformanceDetail: View {
|
||||
let name: String
|
||||
let snapshot: SystemSnapshot
|
||||
let history: [MetricSample]
|
||||
let rendererHistory: [MetricSample]
|
||||
let tilerHistory: [MetricSample]
|
||||
|
||||
var body: some View {
|
||||
ScrollView {
|
||||
VStack(alignment: .leading, spacing: 18) {
|
||||
HStack(alignment: .firstTextBaseline) {
|
||||
VStack(alignment: .leading, spacing: 4) {
|
||||
Text("GPU").font(.system(size: 30, weight: .semibold))
|
||||
Text(name).foregroundStyle(.secondary)
|
||||
}
|
||||
Spacer()
|
||||
Text(Formatters.percent(snapshot.gpuPercent))
|
||||
.font(.system(size: 34, weight: .light).monospacedDigit())
|
||||
}
|
||||
|
||||
VStack(alignment: .leading, spacing: 8) {
|
||||
Text("Overall utilization").font(.caption).foregroundStyle(.secondary)
|
||||
Chart(history) { sample in
|
||||
AreaMark(x: .value("Time", sample.date), y: .value("Utilization", sample.value))
|
||||
.foregroundStyle(Color.pink.opacity(0.12))
|
||||
LineMark(x: .value("Time", sample.date), y: .value("Utilization", sample.value))
|
||||
.foregroundStyle(.pink).lineStyle(.init(lineWidth: 2))
|
||||
}
|
||||
.chartYScale(domain: 0...100)
|
||||
.chartXAxis(.hidden)
|
||||
.chartYAxis {
|
||||
AxisMarks(position: .trailing, values: [0, 25, 50, 75, 100]) { value in
|
||||
AxisGridLine().foregroundStyle(Color.pink.opacity(0.16))
|
||||
AxisValueLabel { if let number = value.as(Int.self) { Text("\(number)%") } }
|
||||
}
|
||||
}
|
||||
.frame(height: 240)
|
||||
Text("60 seconds").font(.caption).foregroundStyle(.secondary)
|
||||
}
|
||||
.padding(16)
|
||||
.background(Color(nsColor: .controlBackgroundColor).opacity(0.42))
|
||||
.clipShape(RoundedRectangle(cornerRadius: 12))
|
||||
.overlay { RoundedRectangle(cornerRadius: 12).stroke(Color.pink.opacity(0.16)) }
|
||||
|
||||
HStack(spacing: 14) {
|
||||
engineChart(title: "Renderer", value: snapshot.gpuRendererPercent, history: rendererHistory, color: .pink)
|
||||
engineChart(title: "Tiler", value: snapshot.gpuTilerPercent, history: tilerHistory, color: .purple)
|
||||
}
|
||||
|
||||
StatsGrid(stats: [
|
||||
("Utilization", Formatters.percent(snapshot.gpuPercent)),
|
||||
("Renderer", Formatters.percent(snapshot.gpuRendererPercent)),
|
||||
("Tiler", Formatters.percent(snapshot.gpuTilerPercent)),
|
||||
("GPU cores", "\(snapshot.gpuCoreCount)"),
|
||||
("Memory in use", Formatters.bytes.string(fromByteCount: Int64(snapshot.gpuMemoryBytes))),
|
||||
("Allocated", Formatters.bytes.string(fromByteCount: Int64(snapshot.gpuAllocatedBytes)))
|
||||
])
|
||||
}
|
||||
.padding(22)
|
||||
}
|
||||
}
|
||||
|
||||
private func engineChart(title: String, value: Double, history: [MetricSample], color: Color) -> some View {
|
||||
VStack(alignment: .leading, spacing: 6) {
|
||||
HStack {
|
||||
Text(title).font(.caption).foregroundStyle(.secondary)
|
||||
Spacer()
|
||||
Text(Formatters.percent(value)).font(.callout.monospacedDigit())
|
||||
}
|
||||
Chart(history) { sample in
|
||||
AreaMark(x: .value("Time", sample.date), y: .value(title, sample.value))
|
||||
.foregroundStyle(color.opacity(0.1))
|
||||
LineMark(x: .value("Time", sample.date), y: .value(title, sample.value))
|
||||
.foregroundStyle(color)
|
||||
}
|
||||
.chartYScale(domain: 0...100)
|
||||
.chartXAxis(.hidden)
|
||||
.chartYAxis(.hidden)
|
||||
.frame(height: 92)
|
||||
}
|
||||
.padding(14)
|
||||
.frame(maxWidth: .infinity)
|
||||
.background(Color(nsColor: .controlBackgroundColor).opacity(0.42))
|
||||
.clipShape(RoundedRectangle(cornerRadius: 10))
|
||||
.overlay { RoundedRectangle(cornerRadius: 10).stroke(color.opacity(0.16)) }
|
||||
.accessibilityElement(children: .combine)
|
||||
.accessibilityLabel("\(title) GPU utilization")
|
||||
.accessibilityValue(Formatters.percent(value))
|
||||
}
|
||||
}
|
||||
|
||||
private struct DiskPerformanceDetail: View {
|
||||
let snapshot: SystemSnapshot
|
||||
let readHistory: [MetricSample]
|
||||
let writeHistory: [MetricSample]
|
||||
let latencyHistory: [MetricSample]
|
||||
let activeHistory: [MetricSample]
|
||||
|
||||
private var maximumRate: Double {
|
||||
let maximum = (readHistory.map(\.value) + writeHistory.map(\.value) + [snapshot.diskReadRate, snapshot.diskWriteRate]).max() ?? 0
|
||||
return max(1024, maximum * 1.15)
|
||||
}
|
||||
|
||||
private var maximumLatency: Double {
|
||||
max(0.1, ((latencyHistory.map(\.value) + [snapshot.diskLatencyMilliseconds]).max() ?? 0) * 1.15)
|
||||
}
|
||||
|
||||
var body: some View {
|
||||
ScrollView {
|
||||
VStack(alignment: .leading, spacing: 18) {
|
||||
HStack(alignment: .firstTextBaseline) {
|
||||
VStack(alignment: .leading, spacing: 4) {
|
||||
Text("Disk 0").font(.system(size: 30, weight: .semibold))
|
||||
Text("System volume • APFS • Solid-state").foregroundStyle(.secondary)
|
||||
}
|
||||
Spacer()
|
||||
VStack(alignment: .trailing, spacing: 2) {
|
||||
Text(Formatters.rate(snapshot.diskThroughput))
|
||||
.font(.system(size: 30, weight: .light).monospacedDigit())
|
||||
Text("\(Formatters.percent(snapshot.diskActivePercent)) active")
|
||||
.font(.caption).foregroundStyle(.secondary)
|
||||
}
|
||||
}
|
||||
|
||||
VStack(alignment: .leading, spacing: 8) {
|
||||
HStack {
|
||||
Text("Disk transfer rate").font(.caption).foregroundStyle(.secondary)
|
||||
Spacer()
|
||||
Label("Read", systemImage: "arrow.down").foregroundStyle(.green)
|
||||
Label("Write", systemImage: "arrow.up").foregroundStyle(.orange)
|
||||
}
|
||||
.font(.caption)
|
||||
Chart {
|
||||
ForEach(readHistory) { sample in
|
||||
AreaMark(x: .value("Time", sample.date), y: .value("Read", sample.value))
|
||||
.foregroundStyle(Color.green.opacity(0.1))
|
||||
LineMark(x: .value("Time", sample.date), y: .value("Read", sample.value))
|
||||
.foregroundStyle(by: .value("Direction", "Read"))
|
||||
}
|
||||
ForEach(writeHistory) { sample in
|
||||
LineMark(x: .value("Time", sample.date), y: .value("Write", sample.value))
|
||||
.foregroundStyle(by: .value("Direction", "Write"))
|
||||
}
|
||||
}
|
||||
.chartForegroundStyleScale(["Read": Color.green, "Write": Color.orange])
|
||||
.chartYScale(domain: 0...maximumRate)
|
||||
.chartXAxis(.hidden)
|
||||
.chartYAxis {
|
||||
AxisMarks(position: .trailing) { value in
|
||||
AxisGridLine().foregroundStyle(Color.green.opacity(0.14))
|
||||
AxisValueLabel {
|
||||
if let rate = value.as(Double.self) { Text(Formatters.rate(rate)) }
|
||||
}
|
||||
}
|
||||
}
|
||||
.chartLegend(.hidden)
|
||||
.frame(height: 220)
|
||||
Text("60 seconds").font(.caption).foregroundStyle(.secondary)
|
||||
}
|
||||
.padding(16)
|
||||
.background(Color(nsColor: .controlBackgroundColor).opacity(0.42))
|
||||
.clipShape(RoundedRectangle(cornerRadius: 12))
|
||||
.overlay { RoundedRectangle(cornerRadius: 12).stroke(Color.green.opacity(0.16)) }
|
||||
|
||||
HStack(spacing: 14) {
|
||||
miniChart(
|
||||
title: "Average response time",
|
||||
value: String(format: "%.2f ms", snapshot.diskLatencyMilliseconds),
|
||||
history: latencyHistory,
|
||||
maximum: maximumLatency,
|
||||
color: .orange
|
||||
)
|
||||
miniChart(
|
||||
title: "Active time",
|
||||
value: Formatters.percent(snapshot.diskActivePercent),
|
||||
history: activeHistory,
|
||||
maximum: 100,
|
||||
color: .green
|
||||
)
|
||||
}
|
||||
|
||||
StatsGrid(stats: [
|
||||
("Read speed", Formatters.rate(snapshot.diskReadRate)),
|
||||
("Write speed", Formatters.rate(snapshot.diskWriteRate)),
|
||||
("Response time", String(format: "%.2f ms", snapshot.diskLatencyMilliseconds)),
|
||||
("IOPS", String(format: "%.0f", snapshot.diskOperationsPerSecond)),
|
||||
("Used space", Formatters.bytes.string(fromByteCount: Int64(snapshot.diskTotal - snapshot.diskFree))),
|
||||
("Capacity", Formatters.bytes.string(fromByteCount: Int64(snapshot.diskTotal)))
|
||||
])
|
||||
}
|
||||
.padding(22)
|
||||
}
|
||||
}
|
||||
|
||||
private func miniChart(
|
||||
title: String,
|
||||
value: String,
|
||||
history: [MetricSample],
|
||||
maximum: Double,
|
||||
color: Color
|
||||
) -> some View {
|
||||
VStack(alignment: .leading, spacing: 6) {
|
||||
HStack {
|
||||
Text(title).font(.caption).foregroundStyle(.secondary)
|
||||
Spacer()
|
||||
Text(value).font(.callout.monospacedDigit())
|
||||
}
|
||||
Chart(history) { sample in
|
||||
AreaMark(x: .value("Time", sample.date), y: .value(title, sample.value))
|
||||
.foregroundStyle(color.opacity(0.1))
|
||||
LineMark(x: .value("Time", sample.date), y: .value(title, sample.value))
|
||||
.foregroundStyle(color)
|
||||
}
|
||||
.chartYScale(domain: 0...maximum)
|
||||
.chartXAxis(.hidden)
|
||||
.chartYAxis(.hidden)
|
||||
.frame(height: 92)
|
||||
.accessibilityLabel(title)
|
||||
.accessibilityValue(value)
|
||||
}
|
||||
.padding(14)
|
||||
.frame(maxWidth: .infinity)
|
||||
.background(Color(nsColor: .controlBackgroundColor).opacity(0.42))
|
||||
.clipShape(RoundedRectangle(cornerRadius: 10))
|
||||
.overlay { RoundedRectangle(cornerRadius: 10).stroke(color.opacity(0.16)) }
|
||||
}
|
||||
}
|
||||
|
||||
private struct NetworkPerformanceDetail: View {
|
||||
let interface: String
|
||||
let receiveRate: Double
|
||||
let sendRate: Double
|
||||
let receiveHistory: [MetricSample]
|
||||
let sendHistory: [MetricSample]
|
||||
|
||||
private var maximumRate: Double {
|
||||
let maximum = (receiveHistory.map(\.value) + sendHistory.map(\.value) + [receiveRate, sendRate]).max() ?? 0
|
||||
return max(1024, maximum * 1.15)
|
||||
}
|
||||
|
||||
var body: some View {
|
||||
ScrollView {
|
||||
VStack(alignment: .leading, spacing: 20) {
|
||||
HStack(alignment: .firstTextBaseline) {
|
||||
VStack(alignment: .leading, spacing: 4) {
|
||||
Text("Network").font(.system(size: 30, weight: .semibold))
|
||||
Text(interface).foregroundStyle(.secondary)
|
||||
}
|
||||
Spacer()
|
||||
Text(Formatters.rate(receiveRate + sendRate))
|
||||
.font(.system(size: 30, weight: .light).monospacedDigit())
|
||||
}
|
||||
|
||||
VStack(alignment: .leading, spacing: 8) {
|
||||
HStack {
|
||||
Text("Throughput").font(.caption).foregroundStyle(.secondary)
|
||||
Spacer()
|
||||
Label("Receive", systemImage: "arrow.down").foregroundStyle(.teal)
|
||||
Label("Send", systemImage: "arrow.up").foregroundStyle(.purple)
|
||||
}
|
||||
.font(.caption)
|
||||
|
||||
Chart {
|
||||
ForEach(receiveHistory) { sample in
|
||||
AreaMark(x: .value("Time", sample.date), y: .value("Receive", sample.value))
|
||||
.foregroundStyle(Color.teal.opacity(0.1))
|
||||
LineMark(x: .value("Time", sample.date), y: .value("Receive", sample.value))
|
||||
.foregroundStyle(by: .value("Direction", "Receive"))
|
||||
}
|
||||
ForEach(sendHistory) { sample in
|
||||
LineMark(x: .value("Time", sample.date), y: .value("Send", sample.value))
|
||||
.foregroundStyle(by: .value("Direction", "Send"))
|
||||
}
|
||||
}
|
||||
.chartForegroundStyleScale(["Receive": Color.teal, "Send": Color.purple])
|
||||
.chartYScale(domain: 0...maximumRate)
|
||||
.chartXAxis(.hidden)
|
||||
.chartYAxis {
|
||||
AxisMarks(position: .trailing) { value in
|
||||
AxisGridLine().foregroundStyle(Color.teal.opacity(0.14))
|
||||
AxisValueLabel {
|
||||
if let rate = value.as(Double.self) { Text(Formatters.rate(rate)) }
|
||||
}
|
||||
}
|
||||
}
|
||||
.chartLegend(.hidden)
|
||||
.frame(height: 280)
|
||||
Text("60 seconds").font(.caption).foregroundStyle(.secondary)
|
||||
}
|
||||
.padding(16)
|
||||
.background(Color(nsColor: .controlBackgroundColor).opacity(0.42))
|
||||
.clipShape(RoundedRectangle(cornerRadius: 12))
|
||||
.overlay { RoundedRectangle(cornerRadius: 12).stroke(Color.teal.opacity(0.16)) }
|
||||
|
||||
StatsGrid(stats: [
|
||||
("Receive", Formatters.rate(receiveRate)),
|
||||
("Send", Formatters.rate(sendRate)),
|
||||
("Combined", Formatters.rate(receiveRate + sendRate)),
|
||||
("Interface", interface)
|
||||
])
|
||||
}
|
||||
.padding(22)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private enum CPUDisplayMode: String {
|
||||
case summary = "Summary view"
|
||||
case logicalProcessors = "Logical processors"
|
||||
}
|
||||
|
||||
private struct CPUPerformanceDetail: View {
|
||||
let subtitle: String
|
||||
let value: Double
|
||||
let history: [MetricSample]
|
||||
let coreHistories: [[MetricSample]]
|
||||
let coreValues: [Double]
|
||||
@Binding var displayMode: CPUDisplayMode
|
||||
let stats: [(String, String)]
|
||||
|
||||
private var chartData: [MetricSample] {
|
||||
if !history.isEmpty { return history }
|
||||
return [MetricSample(date: .now.addingTimeInterval(-60), value: value), MetricSample(date: .now, value: value)]
|
||||
}
|
||||
|
||||
var body: some View {
|
||||
ScrollView {
|
||||
VStack(alignment: .leading, spacing: 16) {
|
||||
HStack(alignment: .firstTextBaseline) {
|
||||
VStack(alignment: .leading, spacing: 4) {
|
||||
Text("CPU").font(.system(size: 30, weight: .semibold))
|
||||
Text(subtitle).foregroundStyle(.secondary)
|
||||
}
|
||||
Spacer()
|
||||
Text(Formatters.percent(value))
|
||||
.font(.system(size: 34, weight: .light).monospacedDigit())
|
||||
}
|
||||
|
||||
cpuGraph
|
||||
.contextMenu {
|
||||
Button {
|
||||
displayMode = .summary
|
||||
} label: {
|
||||
Label("Summary view", systemImage: displayMode == .summary ? "checkmark" : "chart.xyaxis.line")
|
||||
}
|
||||
Button {
|
||||
displayMode = .logicalProcessors
|
||||
} label: {
|
||||
Label("Logical processors", systemImage: displayMode == .logicalProcessors ? "checkmark" : "square.grid.3x3")
|
||||
}
|
||||
}
|
||||
.help("Right-click to switch between summary and logical processor graphs")
|
||||
|
||||
StatsGrid(stats: stats)
|
||||
}
|
||||
.padding(22)
|
||||
}
|
||||
}
|
||||
|
||||
private var cpuGraph: some View {
|
||||
VStack(alignment: .leading, spacing: 8) {
|
||||
HStack {
|
||||
Text(displayMode == .summary ? "% Utilization" : "Utilization by logical processor")
|
||||
.font(.caption)
|
||||
.foregroundStyle(.secondary)
|
||||
Spacer()
|
||||
Label(displayMode.rawValue, systemImage: displayMode == .summary ? "chart.xyaxis.line" : "square.grid.3x3")
|
||||
.font(.caption)
|
||||
.foregroundStyle(.secondary)
|
||||
}
|
||||
|
||||
if displayMode == .summary {
|
||||
Chart(chartData) { sample in
|
||||
AreaMark(x: .value("Time", sample.date), y: .value("Usage", sample.value))
|
||||
.foregroundStyle(Color.blue.opacity(0.13))
|
||||
LineMark(x: .value("Time", sample.date), y: .value("Usage", sample.value))
|
||||
.foregroundStyle(.blue)
|
||||
.lineStyle(.init(lineWidth: 2))
|
||||
}
|
||||
.chartYScale(domain: 0...100)
|
||||
.chartXAxis(.hidden)
|
||||
.chartYAxis {
|
||||
AxisMarks(position: .trailing, values: [0, 25, 50, 75, 100]) { value in
|
||||
AxisGridLine().foregroundStyle(Color.blue.opacity(0.18))
|
||||
AxisValueLabel { if let number = value.as(Int.self) { Text("\(number)%") } }
|
||||
}
|
||||
}
|
||||
.frame(height: 280)
|
||||
} else {
|
||||
LazyVGrid(columns: Array(repeating: GridItem(.flexible(), spacing: 8), count: 4), spacing: 8) {
|
||||
ForEach(coreValues.indices, id: \.self) { index in
|
||||
CoreChart(
|
||||
index: index,
|
||||
value: coreValues[index],
|
||||
history: index < coreHistories.count ? coreHistories[index] : []
|
||||
)
|
||||
}
|
||||
}
|
||||
.frame(minHeight: 280)
|
||||
}
|
||||
|
||||
Text("60 seconds").font(.caption).foregroundStyle(.secondary)
|
||||
}
|
||||
.padding(16)
|
||||
.background(Color(nsColor: .controlBackgroundColor).opacity(0.42))
|
||||
.clipShape(RoundedRectangle(cornerRadius: 12))
|
||||
.overlay {
|
||||
RoundedRectangle(cornerRadius: 12)
|
||||
.stroke(Color.blue.opacity(0.16), lineWidth: 1)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private struct CoreChart: View {
|
||||
let index: Int
|
||||
let value: Double
|
||||
let history: [MetricSample]
|
||||
|
||||
private var data: [MetricSample] {
|
||||
if !history.isEmpty { return history }
|
||||
return [MetricSample(date: .now.addingTimeInterval(-60), value: value), MetricSample(date: .now, value: value)]
|
||||
}
|
||||
|
||||
var body: some View {
|
||||
ZStack(alignment: .topLeading) {
|
||||
Chart(data) { sample in
|
||||
AreaMark(x: .value("Time", sample.date), y: .value("Usage", sample.value))
|
||||
.foregroundStyle(Color.blue.opacity(0.1))
|
||||
LineMark(x: .value("Time", sample.date), y: .value("Usage", sample.value))
|
||||
.foregroundStyle(.blue)
|
||||
.lineStyle(.init(lineWidth: 1.25))
|
||||
}
|
||||
.chartYScale(domain: 0...100)
|
||||
.chartXAxis(.hidden)
|
||||
.chartYAxis(.hidden)
|
||||
.background {
|
||||
GridPattern().stroke(Color.blue.opacity(0.12), lineWidth: 0.5)
|
||||
}
|
||||
VStack(alignment: .leading, spacing: 1) {
|
||||
Text("CPU \(index)").font(.caption2.weight(.medium))
|
||||
Text(Formatters.percent(value)).font(.caption2.monospacedDigit()).foregroundStyle(.secondary)
|
||||
}
|
||||
.padding(6)
|
||||
}
|
||||
.frame(height: 62)
|
||||
.clipShape(RoundedRectangle(cornerRadius: 5))
|
||||
.overlay { RoundedRectangle(cornerRadius: 5).stroke(Color.blue.opacity(0.28), lineWidth: 1) }
|
||||
.accessibilityElement(children: .ignore)
|
||||
.accessibilityLabel("CPU \(index), \(Formatters.percent(value)) utilization")
|
||||
}
|
||||
}
|
||||
|
||||
private struct GridPattern: Shape {
|
||||
func path(in rect: CGRect) -> Path {
|
||||
var path = Path()
|
||||
for fraction in [0.25, 0.5, 0.75] {
|
||||
let x = rect.width * fraction
|
||||
let y = rect.height * fraction
|
||||
path.move(to: CGPoint(x: x, y: 0))
|
||||
path.addLine(to: CGPoint(x: x, y: rect.height))
|
||||
path.move(to: CGPoint(x: 0, y: y))
|
||||
path.addLine(to: CGPoint(x: rect.width, y: y))
|
||||
}
|
||||
return path
|
||||
}
|
||||
}
|
||||
|
||||
private struct StatsGrid: View {
|
||||
let stats: [(String, String)]
|
||||
|
||||
var body: some View {
|
||||
LazyVGrid(columns: [.init(.flexible()), .init(.flexible())], spacing: 18) {
|
||||
ForEach(Array(stats.enumerated()), id: \.offset) { _, stat in
|
||||
VStack(alignment: .leading, spacing: 4) {
|
||||
Text(stat.0).font(.caption).foregroundStyle(.secondary)
|
||||
Text(stat.1).font(.title3.monospacedDigit()).lineLimit(1)
|
||||
}
|
||||
.frame(maxWidth: .infinity, alignment: .leading)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private struct PerformanceDetail: View {
|
||||
let title: String
|
||||
let subtitle: String
|
||||
let color: Color
|
||||
let value: Double
|
||||
let history: [MetricSample]
|
||||
let stats: [(String, String)]
|
||||
|
||||
var chartData: [MetricSample] {
|
||||
if !history.isEmpty { return history }
|
||||
return [MetricSample(date: .now.addingTimeInterval(-60), value: value), MetricSample(date: .now, value: value)]
|
||||
}
|
||||
|
||||
var body: some View {
|
||||
ScrollView {
|
||||
VStack(alignment: .leading, spacing: 20) {
|
||||
HStack(alignment: .firstTextBaseline) {
|
||||
VStack(alignment: .leading, spacing: 4) {
|
||||
Text(title).font(.system(size: 30, weight: .semibold))
|
||||
Text(subtitle).foregroundStyle(.secondary)
|
||||
}
|
||||
Spacer()
|
||||
Text(Formatters.percent(value))
|
||||
.font(.system(size: 34, weight: .light).monospacedDigit())
|
||||
}
|
||||
VStack(alignment: .leading, spacing: 8) {
|
||||
Text("% Utilization").font(.caption).foregroundStyle(.secondary)
|
||||
Chart(chartData) { sample in
|
||||
AreaMark(x: .value("Time", sample.date), y: .value("Usage", sample.value))
|
||||
.foregroundStyle(color.opacity(0.13))
|
||||
LineMark(x: .value("Time", sample.date), y: .value("Usage", sample.value))
|
||||
.foregroundStyle(color)
|
||||
.lineStyle(.init(lineWidth: 2))
|
||||
}
|
||||
.chartYScale(domain: 0...100)
|
||||
.chartXAxis(.hidden)
|
||||
.chartYAxis {
|
||||
AxisMarks(position: .trailing, values: [0, 25, 50, 75, 100]) { value in
|
||||
AxisGridLine().foregroundStyle(color.opacity(0.18))
|
||||
AxisValueLabel { if let number = value.as(Int.self) { Text("\(number)%") } }
|
||||
}
|
||||
}
|
||||
.frame(minHeight: 280)
|
||||
Text("60 seconds").font(.caption).foregroundStyle(.secondary)
|
||||
}
|
||||
.padding(16)
|
||||
.background(Color(nsColor: .controlBackgroundColor).opacity(0.42))
|
||||
.clipShape(RoundedRectangle(cornerRadius: 12))
|
||||
|
||||
StatsGrid(stats: stats)
|
||||
}
|
||||
.padding(22)
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user