Skip to content

Commit d999db0

Browse files
committed
New computer progress
1 parent 9669521 commit d999db0

19 files changed

+466
-229
lines changed

components/Chart.js

+85-12
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ if (typeof Highcharts === "object") {
66
HighchartsExporting(Highcharts);
77
}
88

9-
export default function Chart({ dataset, xAxis, yAxis }) {
9+
export default function Chart({ dataset, xAxis, yAxis, downloadCSV }) {
1010
const linearRegressionLine = (x, y) => {
1111
const xs = [];
1212
const ys = [];
@@ -30,10 +30,15 @@ export default function Chart({ dataset, xAxis, yAxis }) {
3030
const x2 = Math.max.apply(null, xs);
3131
const y1 = slope * x1 + intercept;
3232
const y2 = slope * x2 + intercept;
33-
return [
34-
[x1, y1],
35-
[x2, y2],
36-
];
33+
return {
34+
slope,
35+
intercept,
36+
r2,
37+
points: [
38+
[x1, y1],
39+
[x2, y2],
40+
],
41+
};
3742
};
3843
const scatterData = dataset.map((model) => {
3944
return {
@@ -60,9 +65,15 @@ export default function Chart({ dataset, xAxis, yAxis }) {
6065
return Math.log10(1 / (1 - model[yAxis.column] / 100));
6166
});
6267
const lr = linearRegressionLine(x, y);
63-
return lr;
68+
console.log(lr);
69+
return lr.points;
6470
};
6571
const chartOptions = {
72+
chart: {
73+
spacingBottom:25,
74+
spacingTop:50,
75+
height: (8 / 16 * 100) + '%' // 16:9 ratio
76+
},
6677
title: {
6778
text: null,
6879
},
@@ -73,29 +84,65 @@ export default function Chart({ dataset, xAxis, yAxis }) {
7384
title: {
7485
enabled: true,
7586
text: xAxis.name,
87+
margin: 5,
88+
style: {
89+
fontSize: 22,
90+
},
7691
},
77-
minPadding: 0.05,
78-
maxPadding: 0.05,
79-
allowDecimals: xAxis.column !== "year",
92+
minPadding: xAxis.column === "year" ? 0.099 : 0.102,
93+
maxPadding: 0.06,
94+
95+
allowDecimals: false,
8096
labels: {
97+
style: {
98+
fontSize: 25,
99+
},
81100
useHTML: true,
82101
formatter: function () {
83102
if (xAxis.column === "year") {
84-
return `<span>${this.value}</span>`;
103+
return `<span class="text-lg">${this.value}</span>`;
85104
}
86-
return `10<sup>${this.value.toFixed(1)}</sup>`;
105+
return `<span class="text-lg">10<sup>${this.value}</sup></span>`;
87106
},
88107
},
89108
},
109+
credits: {
110+
enabled: true,
111+
style: {
112+
margin: 10,
113+
},
114+
position: {
115+
align: "center",
116+
y: 0,
117+
},
118+
text:
119+
'<a target="_blank" href="https://arxiv.org/abs/2007.05558">' +
120+
"Ⓒ The Computational Limits of Deep Learning, N.C. THOMPSON, K. GREENEWALD, K. LEE, G.F. MANSO</a>" +
121+
'<a target="_blank" href="https://dblp.uni-trier.de/rec/journals/corr/abs-2007-05558.html?view=bibtex">' +
122+
" [CITE]</a>",
123+
},
90124
yAxis: {
91125
title: {
92126
text: yAxis.name,
127+
margin: 30,
128+
style: {
129+
fontSize: 22,
130+
},
93131
},
132+
// allowDecimals: false,
133+
maxPadding: 0,
134+
// showLastLabel: false,
135+
94136
labels: {
137+
y:-3,
138+
x:0,
139+
align:'left',
95140
formatter: function () {
96141
let label = (1 - 10 ** -this.value) * 100;
97142
label = Math.round(label * 100) / 100;
98-
return `${this.value ? label.toFixed(1) : 0}%`;
143+
return `<span class=" text-lg">${
144+
this.value ? label.toFixed(0) : 0
145+
}%</span>`;
99146
},
100147
},
101148
},
@@ -176,6 +223,32 @@ export default function Chart({ dataset, xAxis, yAxis }) {
176223
enableMouseTracking: false,
177224
},
178225
],
226+
exporting: {
227+
menuItemDefinitions: {
228+
// Custom definition
229+
label: {
230+
onclick: function () {
231+
downloadCSV();
232+
},
233+
text: "Download data (CSV)",
234+
},
235+
},
236+
buttons: {
237+
contextButton: {
238+
menuItems: [
239+
"viewFullscreen",
240+
"printChart",
241+
"separator",
242+
"downloadPNG",
243+
"downloadJPEG",
244+
"downloadPDF",
245+
"downloadSVG",
246+
"separator",
247+
"label",
248+
],
249+
},
250+
},
251+
},
179252
};
180253
return <HighchartsReact highcharts={Highcharts} options={chartOptions} />;
181254
}

components/Footer.js

+3-4
Original file line numberDiff line numberDiff line change
@@ -4,18 +4,17 @@ function classNames(...classes) {
44
return classes.filter(Boolean).join(" ");
55
}
66

7-
export default function Navbar() {
7+
export default function Navbar({transparent}) {
88
return (
9-
<footer className=" bg-black/50">
9+
<footer className={transparent ? " bg-black/50" : "bg-black border-t-2 border-t-[#AA3248]"}>
1010
<div className="max-w-screen-2xl mx-auto px-4 sm:px-6 lg:px-8">
1111
<div className="flex justify-between items-center pb-2">
12-
<div className="relative h-14 w-48">
12+
<div className="relative h-12 m-2 w-48">
1313
<Image src="/futuretech.svg" alt="future tech" layout="fill" />
1414
</div>
1515
<p className="text-gray-100 text-sm">© 2022 Computer Progress</p>
1616
</div>
1717
</div>
18-
1918
</footer>
2019
);
2120
}

components/Header.js

+65-47
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { DocumentTextIcon, NewspaperIcon, PaperClipIcon, UserGroupIcon } from "@heroicons/react/outline";
12
import Link from "next/link";
23
import { useRouter } from "next/router";
34
function classNames(...classes) {
@@ -39,56 +40,71 @@ export default function Header({ benchmarks }) {
3940
</p>
4041
<ul className="flex flex-row justify-start flex-wrap gap-x-16 gap-y-4">
4142
<li className="flex items-center text-sm text-gray-600 gap-1">
42-
<svg
43-
xmlns="http://www.w3.org/2000/svg"
44-
className="h-6 w-6"
45-
fill="none"
46-
viewBox="0 0 24 24"
47-
stroke="currentColor"
48-
strokeWidth={2}
43+
<a
44+
href="https://arxiv.org/abs/2007.05558"
45+
target="_blank"
46+
rel="noreferrer"
47+
className="hover:underline flex items-center text-sm text-gray-600 gap-1"
4948
>
50-
<path
51-
strokeLinecap="round"
52-
strokeLinejoin="round"
53-
d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"
54-
/>
55-
</svg>
56-
Paper
49+
<DocumentTextIcon className="w-5 h-5"/> Paper
50+
</a>
5751
</li>
5852
<li className="flex items-center text-sm text-gray-600 gap-1">
59-
<svg
60-
xmlns="http://www.w3.org/2000/svg"
61-
className="h-6 w-6"
62-
fill="none"
63-
viewBox="0 0 24 24"
64-
stroke="currentColor"
65-
strokeWidth={2}
66-
>
67-
<path
68-
strokeLinecap="round"
69-
strokeLinejoin="round"
70-
d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z"
71-
/>
72-
</svg>
73-
Authors: Kristjan Greenewald, Keeheon Lee, and Gabriel Manso
53+
54+
<UserGroupIcon className="w-5 h-5"/> Kristjan Greenewald, Keeheon Lee, and Gabriel
55+
Manso
7456
</li>
75-
<li className="flex items-center text-sm text-gray-600 gap-1">
76-
<svg
77-
xmlns="http://www.w3.org/2000/svg"
78-
className="h-6 w-6"
79-
fill="none"
80-
viewBox="0 0 24 24"
81-
stroke="currentColor"
82-
strokeWidth={2}
57+
<li className="flex items-center text-sm text-gray-600 gap-1 flex-wrap">
58+
<NewspaperIcon className="w-5 h-5"/>
59+
<a
60+
href="https://www.wired.com/story/prepare-artificial-intelligence-produce-less-wizardry/"
61+
target="_blank"
62+
rel="noreferrer"
63+
className="hover:underline"
64+
>
65+
Wired
66+
</a>,
67+
<a
68+
href="https://venturebeat.com/2020/07/15/mit-researchers-warn-that-deep-learning-is-approaching-computational-limits/"
69+
target="_blank"
70+
rel="noreferrer"
71+
className="hover:underline"
72+
>
73+
VentureBeat
74+
</a>,
75+
<a
76+
href="https://www.discovermagazine.com/technology/the-computational-limits-of-deep-learning-are-closer-than-you-think"
77+
target="_blank"
78+
rel="noreferrer"
79+
className="hover:underline"
80+
>
81+
Discover
82+
</a>,
83+
<a
84+
href="https://thenextweb.com/neural/2020/07/17/ai-researchers-say-weve-squeezed-nearly-as-much-out-of-modern-computers-as-we-can/"
85+
target="_blank"
86+
rel="noreferrer"
87+
className="hover:underline"
88+
>
89+
The Next Web
90+
</a>,
91+
<a
92+
href="https://interestingengineering.com/deep-learning-reaching-computational-limits-warns-new-mit-study"
93+
target="_blank"
94+
rel="noreferrer"
95+
className="hover:underline"
96+
>
97+
Interesting Engineering
98+
</a>,
99+
<a
100+
href="https://content.techgig.com/mit-researchers-warn-that-deep-learning-is-reaching-its-computational-limit/articleshow/77033239.cms"
101+
target="_blank"
102+
rel="noreferrer"
103+
className="hover:underline"
83104
>
84-
<path
85-
strokeLinecap="round"
86-
strokeLinejoin="round"
87-
d="M11 5.882V19.24a1.76 1.76 0 01-3.417.592l-2.147-6.15M18 13a3 3 0 100-6M5.436 13.683A4.001 4.001 0 017 6h1.832c4.1 0 7.625-1.234 9.168-3v14c-1.543-1.766-5.067-3-9.168-3H7a3.988 3.988 0 01-1.564-.317z"
88-
/>
89-
</svg>{" "}
90-
Wired, VentureBeat, Discover, The Next Web, Interesting
91-
Engineering, Tech Gig
105+
Tech Gig
106+
</a>
107+
92108
</li>
93109
</ul>
94110
</div>
@@ -104,11 +120,13 @@ export default function Header({ benchmarks }) {
104120
<li
105121
className={classNames(
106122
item.range == router.query.slug ? "font-bold" : "",
107-
"text-[#AA3248] mt-1"
123+
"text-[#AA3248] mt-1 hover:underline"
108124
)}
109125
key={item.range}
110126
>
111-
<Link href={'/benchmarks/' + item.range}>{item.dataset}</Link>
127+
<Link href={"/benchmarks/" + item.range}>
128+
{item.dataset}
129+
</Link>
112130
</li>
113131
))}
114132
</ul>

0 commit comments

Comments
 (0)