Skip to content

Commit

Permalink
website
Browse files Browse the repository at this point in the history
  • Loading branch information
jpbogle committed Jun 24, 2019
1 parent 75327aa commit 52821d3
Show file tree
Hide file tree
Showing 10 changed files with 695 additions and 0 deletions.
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
.DS_Store
Binary file added www/img/demo.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
59 changes: 59 additions & 0 deletions www/img/github.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
356 changes: 356 additions & 0 deletions www/img/hebrewu.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
10 changes: 10 additions & 0 deletions www/img/mit.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions www/img/ms.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
103 changes: 103 additions & 0 deletions www/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,103 @@
<head>
<meta charset="UTF-8">
<title>TEAVAR</title>
<link href="https://fonts.googleapis.com/css?family=Droid+Sans" rel="stylesheet">
<link rel="stylesheet" href="styles/header.css">
<link rel="stylesheet" href="styles/home.css">
<script src="https://kit.fontawesome.com/9a81ca639b.js"></script>
</head>
<body>
<header id="header">
<ul id="left-links">
<li class="link"><a href="">TEAVAR</a></li>
</ul>
<ul id="right-links">
<li class="link"><a href="">Home</a></li>
<li class="link"><a href="demo">Demo</a></li>
</ul>
</header>
<div id="cover">
<div id="intro">
<h1 id="name"><span id="highlight1">TEA</span><span id="highlight2">VAR</span></h1>
<div id="sub-name">Traffic Engineering Applying Value at Risk</div>
<a href="paper.pdf" id="paper-button" class="button">Read the Paper<i class="fas fa-caret-right"></i></a>
</div>
</div>
<div class="section">
<div class="inner">
<div class="title">Overview</div>
<div class="body">
To keep up with the continuous growth in demand, cloud providers spend millions of dollars augmenting the capacity of their wide-area backbones and devote significant effort to efficiently utilizing WAN capacity. A key challenge is striking a good balance between network utilization and availability, as these are inherently at odds; a highly utilized network might not be able to withstand unexpected traffic shifts resulting from link/node failures. We advocate a novel approach to this challenge that draws inspiration from financial risk theory: leverage empirical data to generate a probabilistic model of network failures and maximize bandwidth allocation to network users subject to an operator-specified availability target (e.g., 99.9% availability). Our approach enables network operators to strike the utilization-availability balance that best suits their goals and operational reality. We present TEAVAR (Traffic Engineering Applying Value at Risk), a system that realizes this risk management approach to traffic engineering (TE). We compare TEAVAR to state-of-the-art TE solutions through extensive simulations across many network topologies, failure scenarios, and traffic patterns, including real-world data about failures and traffic from a large service provider. Our results show that with TEAVAR, operators can support up to twice as much throughput as state-of-the-art TE schemes, at the same level of availability.
</div>
</div>
</div>
<div class="section">
<div class="inner">
<div class="title">Paper</div>
<div class="body">
<b>TeaVaR: Striking the Right Utilization-Availability Balance in WAN Traffic Engineering</b><br>
J. Bogle, N. Bhatia, M. Ghobadi, I. Menache, N. Bjorner, A. Valadarsky, M. Schapira<br>
<em><a href="https://conferences.sigcomm.org/sigcomm/2019/">ACM SIGCOMM'19</a></em> (to appear)
<span class="text5">[paper] [slides] [<a href="poster.pdf">poster</a>] [video] [code] [<a href="demo">demo</a>]</span>
</div>
</div>
</div>
<div class="section">
<div class="inner">
<div class="title">Demo</div>
<div class="body centered">
<img id="demo-image" src="img/demo.png">
<a href="demo" id="demo-button" class="button">Check out the Demo<i class="fas fa-caret-right"></i></a>
</div>
</div>
</div>
<div class="section">
<div class="inner">
<div class="title">Code</div>
<div class="body">
<object class="logo" type="image/svg+xml" data="img/github.svg" style="width: 100px">
Your browser does not support SVG
</object>
<span id="github-link">Our code is available on github <a href="https://github.com/manyaghobadi/teavar">here</a></span>
</div>
</div>
</div>
<div class="section">
<div class="inner">
<div class="title">Members</div>
<div class="body centered">
<div class="affiliation">
<object class="logo" type="image/svg+xml" data="img/mit.svg" style="width: 100px">
Your browser does not support SVG
</object>
<ul class="names">
<li>Manya Ghobadi</li>
<li>Jeremy Bogle</li>
<li>Nikhil Bhatia</li>
</ul>
</div>
<div class="affiliation">
<object class="logo" type="image/svg+xml" data="img/ms.svg">
Your browser does not support SVG
</object>
<ul class="names">
<li>Ishai Menache</li>
<li>Nikolaj Bj&oslash;rner</li>
</ul>
</div>
<div class="affiliation">
<object class="logo" type="image/svg+xml" data="img/hebrewu.svg">
Your browser does not support SVG
</object>
<ul class="names">
<li>Michael Shapira</li>
<li>Asaf Valadarsky</li>
</ul>
</div>
</div>
</div>
</div>
<footer>

</footer>
</body>
Binary file added www/poster.pdf
Binary file not shown.
41 changes: 41 additions & 0 deletions www/styles/header.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
#header {
width: 100%;
/* height: 60px; */
background-image: -webkit-linear-gradient(top,#282828,#191919);
position: fixed;
top: 0;
/* padding-top: 15px; */
font-size: 16px;
z-index: 20;
line-height: 1;
}
#header #sections-list {
margin-top: 0;
margin-bottom: 10px;
padding-top: 5px;
}


#left-links {
list-style-type: none;
float: left;
}

#right-links {
list-style-type: none;
float: right;
}

.link {
float: left;
color: white;
padding-right: 20px;
}
.link a {
text-decoration: none;
color: white;
}
.link a:hover {
color: rgb(141, 141, 141);
transition: .1s all;
}
124 changes: 124 additions & 0 deletions www/styles/home.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,124 @@
body {
margin: 0;
background-color: #f0f4fd;
font-family: "Droid Sans", sans-serif;
}
#cover {
width: 100%;
height: 60%;
background-color: rgba(41, 41, 179, 0.7);
background-size: cover;
background-attachment: fixed;
}
#cover #intro {
position: relative;
text-align: center;
top: 40%;
color: white;
font-size: 30px;
}
#cover #name {
padding-bottom: 10px;
margin-left: auto;
margin-right: auto;
width: 300px;
text-align: center;
letter-spacing: 3;
margin-bottom: 10px;
/* text-shadow: 1px 1px 1px black; */
}

#cover #name #highlight1 {
background-color: rgba(220,220,220,0.8);
color: black;
padding: 0px 8px;
}

#cover #name #highlight2 {
background-color: rgba(40,40,40,0.8);
padding: 0px 8px;
}


#cover #intro #sub-name {
font-size: 25px;
color: #dedede;
}


.button {
font-size: 20px;
text-decoration: none;
margin-top: 20px;
color: white;
padding: 10px 15px;
background-color: rgba(50,50,50,0.8);
border-radius: 15px;
display: inline-block;
}

.button i {
position: relative;
top: 1px;
margin-left: 7px;
}

.section {
width: 100vw;
color: rgba(0,0,0,0.8);
}

.section .inner {
width: 80%;
margin: 0px auto;
}

.section .inner .title {
font-size: 25px;
width: 100%;
border-bottom: 1px solid rgba(0,0,0,0.2);
padding-bottom: 10px;
padding-top: 60px;
margin-bottom: 20px;
}

.section .inner .body {
line-height: 1.5;
display: inline-block;
width: 100%;
}

.centered {
text-align: center;
}


#demo-image {
display: block;
margin: 0px auto;
width: 80%;
}

.affiliation {
display: inline-block;
text-align: left;
margin: 0px 60px;
vertical-align: top;
}

.logo {
width: 200px;
height: 50px;
}

#github-link {
position: relative;
bottom: 15px;
}

footer {
height: 60px;
width: 100vw;
margin-top: 50px;
background-image: -webkit-linear-gradient(top,#191919,#282828);
}

0 comments on commit 52821d3

Please sign in to comment.