Skip to content

Commit dbe08b1

Browse files
committed
added further details section
1 parent d4582c2 commit dbe08b1

8 files changed

Lines changed: 96 additions & 3 deletions

File tree

frontend/src/App.tsx

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import Compare from './partials/Compare';
55
import BenchmarkSettings from './partials/BenchmarkSettings';
66
import LineChart from './charts/lineChart';
77
import DetailedBreakdown from './partials/DetailedBreakdown';
8+
import LearnMore from './partials/LearnMore';
89

910
type SectionsProps = {
1011
title: string;
@@ -58,6 +59,11 @@ function App() {
5859
target='_blank'
5960
>Server Lifecycle Paper</a>
6061
</p>
62+
<p className='text-cyan-700 underline underline-offset-5 text-lg text-center'>
63+
<a
64+
href='#FurtherDetails'
65+
>Further Details</a>
66+
</p>
6167
</div>
6268
</section>
6369
<section className='grid grid-cols-1 xl:grid-cols-2 gap-10'>
@@ -70,11 +76,13 @@ function App() {
7076
<Sections title='Detailed Breakdown' markup={<DetailedBreakdown />} />
7177
</div>
7278
</section>
79+
<LearnMore />
7380
</main>
7481
<section className='flex flex-col text-slate-600 w-full px-10 max-w-[2000px] mx-auto text-left mt-14'>
7582
<p>1. SPEC CPU Benchmark - <a className='underline hover:opacity-65' href='https://www.spec.org/cpu2017/'>spec.org/cpu2017</a></p>
7683
<p>2. TPC-H - <a className='underline hover:opacity-65' href='https://www.tpc.org/tpch/'>tpc.org/tpch</a></p>
7784
<p>3. Hyrise - Hyrise is a research in-memory database. <a className='underline hover:opacity-65' href='https://github.com/hyrise/hyrise'>github.com/hyrise/hyrise</a></p>
85+
<p>4. <a className='underline hover:opacity-65' href='https://ugupta.com/files/Gupta_ISCA2022_ACT.pdf'>ACT: Designing Sustainable Computer Systems With An Architectural Carbon Modeling Tool</a></p>
7886
</section>
7987
<footer className='w-full flex flex-col py-10 items-center gap-3 bg-[#CE682A] text-white mt-6 bottom-0'>
8088
<div className='w-full md:w-3/4 px-2 lg:w-3/5 max-w-[2000px] text-lg flex flex-col gap-2'>
12.1 KB
Loading
12.2 KB
Loading
15.5 KB
Loading
Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
import UtilizationScaling from "../assets/UtilizationScaling.png"
2+
import EmissionsScaling from "../assets/EmissionsScaling.png"
3+
import ResourceScaling from "../assets/ResourceScaling.png"
4+
5+
function LearnMore() {
6+
return (
7+
<div className="py-20">
8+
<h2 id="FurtherDetails" className="text-3xl text-center">Further Details</h2>
9+
<p className="text-xl text-center py-14 w-1/2 mx-auto">Data centers produce a significant and increasing amount of CO2 emissions. In the past, these have been predominantly due to energy generation for powering data centers. With the transition to energy sources with lower carbon production, the embodied carbon (i.e., CO2 and other greenhouse gas emissions during production, transport, and end-of-life) plays an increasing role when planning server lifecycles. While replacing an old server with newer hardware will typically reduce the power consumption of individual tasks, due to better efficiency of modern CPUs, offsetting the embodied carbon of new hardware can take months to tens of years, depending on the grid carbon intensity.</p>
10+
<section id="LearnMore" className="grid grid-cols-2">
11+
<div>
12+
<h3 id="modelDescription">Model Description</h3>
13+
<p>TCO₂ computes the total carbon cost of ownership of a server, combining:</p>
14+
<ul>
15+
<li><span>Embodied Carbon Footprint (ECF):</span> emissions from manufacturing, transport, and disposal of hardware (CPU, DRAM, SSD/HDD).</li>
16+
<li>Where total ECF = ECF<sub>CPU</sub> + ECF<sub>DRAM</sub> + ECF<sub>SSD</sub> + ECF<sub>HDD</sub></li>
17+
<li><span>Operational Carbon Footprint (OCF):</span> emissions from using the server, based on utilization, efficiency, and local grid carbon intensity.</li>
18+
<li>Where total OCF = OCF<sub>CPU</sub> + OCF<sub>DRAM</sub> + OCF<sub>SSD</sub> + OCF<sub>HDD</sub></li>
19+
</ul>
20+
<br />
21+
<p>A break-even point is reached when the combined operational and embodied carbon of the new server meets the operational carbon of the current server. We do not include the embodied carbon of the current server as we consider it to be amortized.</p>
22+
<p>More details about the model can be found in Section 3.1 of our <a className="underline" href='https://hpi.de/oldsite/fileadmin/user_upload/fachgebiete/rabl/publications/2025/serverlifecycles_cidr2025.pdf' target='_blank' >server lifecycle paper.</a></p>
23+
</div>
24+
<div>
25+
<h3>Measurements vs. Estimations</h3>
26+
<p>TCO<sub>2</sub> uses a mix of in-house performance measurements, published spec sheet data, and carbon estimates.</p>
27+
<ul>
28+
<li><span>Measurements:</span> Performance benchmarks (SPEC CPU 2017 Rate & Speed, sorting tasks, TPC-H) provide hardware performance ratios. Sorting and TPC-H were measured in-house at HPI with the intel processors that were available. The remaining AMD CPUs only consist of the SPEC benchmarks which were gathered online.</li>
29+
<li><span>Estimations:</span> Embodied carbon of components (CPU, DRAM, SSD, HDD) are calculated using <a href="https://ugupta.com/files/Gupta_ISCA2022_ACT.pdf" className="underline">published frameworks</a> since precise manufacturer data is often unavailable.</li>
30+
<li><span>Operational emissions:</span> Calculated from maximum power draw (TDP), average yearly country grid carbon intensity gathered from <a className="underline" href="https://www.electricitymaps.com/">Electricity Maps</a>, and normalized utilization.</li>
31+
</ul>
32+
</div>
33+
<div>
34+
<h3>Scaling Options</h3>
35+
<p>TCO<sub>2</sub> supports different methods of scaling to further mimick real world replacement scenarios:</p>
36+
<ul>
37+
<li><span>Utilization scaling:</span> Scales down the utilization on stronger hardware proportionally to its performance gain so that throughput stays comparable. <img className="mx-auto h-20 my-3" src={UtilizationScaling} /></li>
38+
<li><span>Emissions scaling:</span> Scales up emissions on weaker hardware to reflect an N-for-1 replacement scenario.<img className="mx-auto h-20 my-3" src={EmissionsScaling} /></li>
39+
<li><span>Resource scaling:</span> Scales DRAM, SSD, and HDD capacities in proportion to performance ratios between CPU generations.<img className="mx-auto h-20 my-3" src={ResourceScaling} /></li>
40+
</ul>
41+
</div>
42+
<div>
43+
<h3>Limitations</h3>
44+
<p>TCO<sub>2</sub> serves as a basic estimation tool to compare the carbon footprint of server replacements, therefore a multitude of assumptions are made to keep the model simplistic.</p>
45+
<ul>
46+
<li>Embodied carbon values estimates rather than manufacturer-verified data. Our estimates based on the ACT⁴ model are conservative estimates relative to other frameworks. This means that the break-even times gathered here are a lower bound estimate.</li>
47+
<li>The scope is limited to CPUs, DRAM, and SSD/HDD. We do not include other factors such as cooling, networking, and power consumption from other overheads such as material recycling/transportation.</li>
48+
<li>Workloads are limited to the four benchmarks available, which may not capture all real-world scenarios.</li>
49+
<li>Local grid carbon intensities, utilization levels, and workloads are assumed to be static, which do not reflect the fluctuating nature of real-world scenarios.</li>
50+
</ul>
51+
</div>
52+
</section>
53+
</div>
54+
)
55+
}
56+
57+
export default LearnMore;

frontend/src/partials/ServerPresets.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -52,13 +52,13 @@ const ServerPresetsComponent = ({ presetValue, updateComponent, setAdvancedOptio
5252
return (
5353
<div className="relative">
5454
{/* Trigger */}
55-
<div
55+
<button
5656
onClick={() => setShowPresetMenu(!showPresetMenu)}
5757
draggable="false"
58-
className="cursor-pointer -mt-2"
58+
className="cursor-pointer -mt-2 border-2 px-2 py-0.5 rounded-sm bg-gray-100 border-gray-400"
5959
>
6060
Server Configuration: {presetValue} {showPresetMenu ? '▼' : '▶'}
61-
</div>
61+
</button>
6262

6363
{/* PresetMenu */}
6464
{showPresetMenu && (

frontend/src/style.css

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ path.leaflet-interactive:focus {
2727
/* Default font size */
2828
html {
2929
font-size: 16px;
30+
scroll-behavior: smooth !important;
3031
}
3132

3233
/* Extra Small Devices (Mobile Phones) */
@@ -68,3 +69,27 @@ html {
6869
text-align: left;
6970
font-weight: 600
7071
}
72+
73+
#LearnMore {
74+
font-size: large;
75+
line-height: 2.08rem;
76+
}
77+
78+
#LearnMore > div {
79+
margin: 0 2rem 3rem 2rem;
80+
}
81+
82+
#LearnMore > div > ul {
83+
list-style-type: circle;
84+
padding-left: 3rem;
85+
}
86+
87+
#LearnMore > div > ul > li > span {
88+
font-weight: 600;
89+
}
90+
91+
#LearnMore > div > h3 {
92+
text-align: center;
93+
font-weight: 500;
94+
font-size: 1.4rem;
95+
}

frontend/src/utility/lifecycle_analysis/system.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -136,6 +136,9 @@ export class System {
136136
const hddEnergyConsumption =
137137
(this.hddCapacity > 0 ? 7 : 0) / 1000; // kW
138138

139+
console.log(this.cpuTdp, normalizedPowerUsage);
140+
console.log(cpuEnergyConsumption, dramEnergyConsumption)
141+
139142
let totalWatts =
140143
cpuEnergyConsumption +
141144
dramEnergyConsumption +

0 commit comments

Comments
 (0)