Skip to content

Commit 840b81f

Browse files
will-break-itwill-break-it
committed
site(faq): add faq section to landing page
1 parent 867ff70 commit 840b81f

File tree

3 files changed

+169
-13
lines changed

3 files changed

+169
-13
lines changed

‎site/docs/intro.md‎

Lines changed: 29 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -6,27 +6,46 @@ sidebar_position: 1
66

77
:::warning
88

9-
This web site and the Leios R&D project are in their very early stage. More details will be added in the forthcoming weeks and months.
9+
This web site and the Leios R&D project are in their very early stage. More
10+
details will be added in the forthcoming weeks and months.
1011

1112
:::
1213

13-
_Ouroboros Leios_ is a novel protocol extending [Ouroboros Praos](https://docs.cardano.org/about-cardano/learn/ouroboros-overview/) that aims at dramatically increase the _throughput_ of Cardano network. The core protocol and its theoretical properties are defined in [this research paper](https://iohk.io/en/research/library/papers/high-throughput-blockchain-consensus-under-realistic-network-assumptions/).
14+
_Ouroboros Leios_ is a novel protocol extending
15+
[Ouroboros Praos](https://docs.cardano.org/about-cardano/learn/ouroboros-overview/)
16+
that aims at dramatically increase the _throughput_ of Cardano network. The core
17+
protocol and its theoretical properties are defined in
18+
[this research paper](https://iohk.io/en/research/library/papers/high-throughput-blockchain-consensus-under-realistic-network-assumptions/).
1419

1520
## In a nutshell
1621

17-
_Leios_ is based on the key idea of _input endorsers_. Whereas in a classical blockchain, the blocks' body directly contains transactions, in Leios the blocks' body can also contain references to _Endorser blocks_ which themselves contain references to so-called _Input blocks_ containing the actual transactions. Those references are _certified_ through a voting mechanism that guarantees a majority of validators agree on the content of _Endorser blocks_.
22+
_Leios_ is based on the key idea of _input endorsers_. Whereas in a classical
23+
blockchain, the blocks' body directly contains transactions, in Leios the
24+
blocks' body can also contain references to _Endorser blocks_ which themselves
25+
contain references to so-called _Input blocks_ containing the actual
26+
transactions. Those references are _certified_ through a voting mechanism that
27+
guarantees a majority of validators agree on the content of _Endorser blocks_.
1828

1929
![Input Endorsers](input-endorsers.png)
2030

21-
22-
By decoupling the logic of validating blocks' payload and extending the blockchain, and limiting the work needed to verify the chain, much higher throughput can be achieved and new use cases can be unlocked.
31+
By decoupling the logic of validating blocks' payload and extending the
32+
blockchain, and limiting the work needed to verify the chain, much higher
33+
throughput can be achieved and new use cases can be unlocked.
2334

2435
## Tell me more
2536

2637
More documentation about Leios can be found in the following sources:
2738

28-
* The [Leios CIP](https://github.com/cardano-foundation/CIPs/pull/379) by Duncan Coutts, providing rationale and a high-level design of the protocol
29-
* The original [Research paper](https://iohk.io/en/research/library/papers/high-throughput-blockchain-consensus-under-realistic-network-assumptions/) is of course the main reference _north star_
30-
* [This video](https://www.youtube.com/watch?v=Czmg9WmSCcI) from Pr. Aggelos Kiayias, IOG's Chief Scientist, explains Leios in the context of _Scaling Cardano_
31-
* One of the paper's co-author, Giorgos Panagiotakos, has shot a [video](https://www.youtube.com/watch?v=YEcYVygdhzU) explaining Leios
32-
* [These slides ](https://docs.google.com/presentation/d/1W_KHdvdLNDEStE99D7Af2SRiTqZNnVLQiEPqRHJySqI/edit?usp=sharing) from Sandro Coretti-Drayton, another researcher that worked on Leios might also help getting a good intuition about Leios
39+
- The [Leios CIP](https://github.com/cardano-foundation/CIPs/pull/379) by Duncan
40+
Coutts, providing rationale and a high-level design of the protocol
41+
- The original
42+
[Research paper](https://iohk.io/en/research/library/papers/high-throughput-blockchain-consensus-under-realistic-network-assumptions/)
43+
is of course the main reference _north star_
44+
- [This video](https://www.youtube.com/watch?v=Czmg9WmSCcI) from Pr. Aggelos
45+
Kiayias, IOG's Chief Scientist, explains Leios in the context of _Scaling
46+
Cardano_
47+
- One of the paper's co-author, Giorgos Panagiotakos, has shot a
48+
[video](https://www.youtube.com/watch?v=YEcYVygdhzU) explaining Leios
49+
- [These slides](https://docs.google.com/presentation/d/1W_KHdvdLNDEStE99D7Af2SRiTqZNnVLQiEPqRHJySqI/edit?usp=sharing)
50+
from Sandro Coretti-Drayton, another researcher that worked on Leios might
51+
also help getting a good intuition about Leios

‎site/src/pages/index.module.css‎

Lines changed: 71 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,8 +26,6 @@
2626
.videoSection {
2727
padding: 4rem 0;
2828
position: relative;
29-
border-top: 1px solid var(--ifm-color-emphasis-300);
30-
margin-top: 2rem;
3129
}
3230

3331
.videoSection h2 {
@@ -59,3 +57,74 @@
5957
height: 100%;
6058
object-fit: cover;
6159
}
60+
61+
.faqSection {
62+
padding: 4rem 0;
63+
background-color: var(--ifm-color-emphasis-100);
64+
}
65+
66+
.faqWrapper {
67+
margin-top: 2rem;
68+
}
69+
70+
.faqItem {
71+
margin-bottom: 1rem;
72+
border: 1px solid var(--ifm-color-emphasis-300);
73+
border-radius: 8px;
74+
padding: 1rem;
75+
background-color: var(--ifm-background-color);
76+
}
77+
78+
.faqQuestion {
79+
cursor: pointer;
80+
font-weight: bold;
81+
list-style: none;
82+
display: flex;
83+
justify-content: space-between;
84+
align-items: center;
85+
width: 100%;
86+
}
87+
88+
.faqQuestion::-webkit-details-marker {
89+
display: none;
90+
}
91+
92+
/* Add chevron and its animation */
93+
.faqQuestion::after {
94+
content: '';
95+
width: 24px;
96+
height: 24px;
97+
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
98+
background-repeat: no-repeat;
99+
transition: transform 0.3s ease;
100+
}
101+
102+
/* Rotate chevron when expanded */
103+
details[open] .faqQuestion::after {
104+
transform: rotate(180deg);
105+
}
106+
107+
.faqAnswer {
108+
margin-top: 1rem;
109+
padding-top: 1rem;
110+
border-top: 1px solid var(--ifm-color-emphasis-200);
111+
/* Add animation for the answer */
112+
animation: slideDown 0.3s ease-out;
113+
}
114+
115+
/* Animation keyframes for sliding down */
116+
@keyframes slideDown {
117+
from {
118+
opacity: 0;
119+
transform: translateY(-10px);
120+
}
121+
to {
122+
opacity: 1;
123+
transform: translateY(0);
124+
}
125+
}
126+
127+
.borderTop {
128+
border-top: 1px solid var(--ifm-color-emphasis-300);
129+
margin-top: 2rem;
130+
}

‎site/src/pages/index.tsx‎

Lines changed: 69 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ function HomepageHeader() {
3636

3737
function VideoSection() {
3838
return (
39-
<section className={styles.videoSection}>
39+
<section className={clsx(styles.videoSection, styles.borderTop)}>
4040
<div className="container">
4141
<div className="row">
4242
<div className="col col--8 col--offset-2">
@@ -62,6 +62,73 @@ function VideoSection() {
6262
);
6363
}
6464

65+
type FAQItem = {
66+
question: string;
67+
answer: string;
68+
};
69+
70+
const faqItems: FAQItem[] = [
71+
{
72+
question: "What are downstream effects of deploying Leios?",
73+
answer:
74+
"Ongoing internal discussions - we will publish an answer/link here to our findings.",
75+
},
76+
{
77+
question: "Could the mempool be sized to the throughput of the system?",
78+
answer:
79+
"That's already the case. Default mempool size is a small multiple of current block size.",
80+
},
81+
{
82+
question:
83+
"Can the system be sharded according to resources (small nodes vs. big nodes)?",
84+
answer:
85+
"Leios' current design does not involve sharding in a sense of different resource " +
86+
"requirements for different nodes. In short, the Leios design does not involve sharding. " +
87+
"These are ideas in research and require more work. As of now, each node has to validate " +
88+
"all blocks, hence in a traditional sense, adding more nodes does not increase " +
89+
"throughput. Each node must cope with the throughput of the whole system.",
90+
},
91+
{
92+
question:
93+
"Can the system self-regulate instead of manually fine tuning?",
94+
answer:
95+
"The current system's load is imposed on each node through the protocol parameters. Thus, " +
96+
"it remains a democratic vote, not a choice made locally by nodes or automatically. " +
97+
"Given that the load is imposed on each node through the choice of the protocol " +
98+
"parameters, it remains a democratic vote to drive adaptation. In a sharded approach this " +
99+
"could be different. But in the current system there is no local or automatic choice " +
100+
"to be made by individual nodes.",
101+
},
102+
];
103+
104+
function FAQSection() {
105+
return (
106+
<section className={clsx(styles.faqSection, styles.borderTop)}>
107+
<div className="container">
108+
<div className="row">
109+
<div className="col col--8 col--offset-2">
110+
<h2 className="text--center">
111+
Frequently Asked Questions
112+
</h2>
113+
<div className={styles.faqWrapper}>
114+
{faqItems.map((item, index) => (
115+
<details key={index} className={styles.faqItem}>
116+
<summary className={styles.faqQuestion}>
117+
<span>{item.question}</span>
118+
</summary>
119+
<div className={styles.faqAnswer}>
120+
{item.answer}
121+
</div>
122+
</details>
123+
))}
124+
</div>
125+
</div>
126+
</div>
127+
</div>
128+
</section>
129+
);
130+
}
131+
65132
export default function Home(): JSX.Element {
66133
const { siteConfig } = useDocusaurusContext();
67134
return (
@@ -73,6 +140,7 @@ export default function Home(): JSX.Element {
73140
<main>
74141
<HomepageFeatures />
75142
<VideoSection />
143+
<FAQSection />
76144
</main>
77145
</Layout>
78146
);

0 commit comments

Comments
 (0)