4rkal/monero-site
1
0
Fork 0
mirror of https://github.com/monero-project/monero-site.git synced 2025-01-18 23:53:42 +02:00
Code Issues Actions Packages Projects Releases Wiki Activity

Improve performance of some pages by lazy loading images

Browse Source 
Lazy loading makes web pages load images only when they are actually
needed (when they need to be displayed to the user), thus saving
resources for both host and users and improving performances for the
latter.

index.html: 474 kB (546 ms) -> 214kB (373ms)
get-started/what-is-monero/index.md: 320 kB (548 ms) -> 246kB (525 ms)
get-started/accepting/index.md: 254 kB (747 ms) -> 193kB (536 ms)
downloads/index.md: 397 kB (595 ms) -> 243kB (383 ms)

(tests ran locally)
This commit is contained in:
erciccione 2021-03-12 16:49:25 +01:00
parent 310d6b4181
commit 150ba3a7e2
No known key found for this signature in database
GPG Key ID: 762AF8C608E56CDF
4 changed files with 27 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
downloads/index.md
View File

@ -48,7 +48,7 @@ permalink: /downloads/index.html
<i>{% t downloads.gui_intro %}</i>
</div>
<div class="col-md-7 col-sm-12 align-blocks">
<img class="screen" alt="{% t accessibility.guiscreen %}" src={% if site.lang == "en" %}"/img/downloads/gui.png"{% else %}"/img/downloads/{{site.lang}}/gui.png"{% endif %}>
<img class="screen" loading="lazy" alt="{% t accessibility.guiscreen %}" src={% if site.lang == "en" %}"/img/downloads/gui.png"{% else %}"/img/downloads/{{site.lang}}/gui.png"{% endif %}>
</div>
<div class="col-md-5 col-sm-12 align-blocks">
<ul class="logo">
@ -138,7 +138,7 @@ permalink: /downloads/index.html
<i>{% t downloads.cli_intro %}</i>
</div>
<div class="col-md-7 col-sm-12 align-blocks">
<img class="screen" alt="{% t accessibility.cliscreen %}" src={% if site.lang == "en" %}"/img/downloads/cli.png"{% else %}"/img/downloads/{{site.lang}}/cli.png"{% endif %}>
<img class="screen" loading="lazy" alt="{% t accessibility.cliscreen %}" src={% if site.lang == "en" %}"/img/downloads/cli.png"{% else %}"/img/downloads/{{site.lang}}/cli.png"{% endif %}>
</div>
<div class="col-md-5 col-sm-12 align-blocks">
<ul class="logo">
@ -238,25 +238,25 @@ permalink: /downloads/index.html
<th>{% t downloads.sourcecode %}</th>
</tr>
<tr>
<td><img src="/img/cakewallet.png" alt="Cake Wallet Logo"><a href="https://cakewallet.com/">Cake Wallet</a></td>
<td><img src="/img/cakewallet.png" loading="lazy" alt="Cake Wallet Logo"><a href="https://cakewallet.com/">Cake Wallet</a></td>
<td><span class="icon-android"></span><span class="icon-apple"></span></td>
<td>X</td>
<td><a class="ext-noicon" href="https://github.com/cake-tech/cake_wallet" aria-label="GitHub icon"><span class="icon-github"></span></a></td>
</tr>
<tr>
<td><img src="/img/Monerujo-wallet.png" alt="Monerujo logo"><a href="https://monerujo.io/">Monerujo</a></td>
<td><img src="/img/Monerujo-wallet.png" loading="lazy" alt="Monerujo logo"><a href="https://monerujo.io/">Monerujo</a></td>
<td><span class="icon-android"></span></td>
<td>X</td>
<td><a class="ext-noicon" href="https://github.com/m2049r/xmrwallet" aria-label="GitHub icon"><span class="icon-github"></span></a></td>
</tr>
<tr>
<td><img src="/img/mymonero.png" alt="Mymonero logo" style="height: 15px;"><a href="https://mymonero.com/">MyMonero</a></td>
<td><img src="/img/mymonero.png" loading="lazy" alt="Mymonero logo" style="height: 15px;"><a href="https://mymonero.com/">MyMonero</a></td>
<td><span class="icon-apple"></span></td>
<td><span title="Browser" class="icon-browser"></span><span class="icon-linux"></span><span class="icon-windows"></span><span class="icon-apple"></span></td>
<td><a class="ext-noicon" href="https://github.com/mymonero" aria-label="GitHub icon"><span class="icon-github"></span></a></td>
</tr>
<tr>
<td><img src="/img/edge-wallet.png" alt="Edge Logo"><a href="https://edge.app/">Edge</a></td>
<td><img src="/img/edge-wallet.png" loading="lazy" alt="Edge Logo"><a href="https://edge.app/">Edge</a></td>
<td><span class="icon-android"></span><span class="icon-apple"></span></td>
<td>X</td>
<td><a class="ext-noicon" href="https://github.com/EdgeApp" aria-label="GitHub icon"><span class="icon-github"></span></a></td>
@ -264,10 +264,10 @@ permalink: /downloads/index.html
</table>
<div class="row between-xs mob-wallets mobile-only">
<ul>
<li><a class="ext-noicon" href="https://cakewallet.io" aria-label="GitHub icon"><img style="width: 50px" src="/img/cakewallet.png" alt="Cake Wallet Logo">Cake Wallet</a></li>
<li><a class="ext-noicon" href="https://monerujo.io" aria-label="GitHub icon"><img src="/img/Monerujo-wallet.png" alt="Monerujo Logo">Monerujo</a></li>
<li><a class="ext-noicon" href="https://mymonero.com" aria-label="GitHub icon"><img src="/img/mymonero.png" alt="MyMonero Logo">MyMonero</a></li>
<li><a class="ext-noicon" href="https://edge.app/" aria-label="GitHub icon"><img src="/img/edge-wallet.png" alt="Edge Logo">Edge</a></li>
<li><a class="ext-noicon" href="https://cakewallet.io" aria-label="GitHub icon"><img style="width: 50px" src="/img/cakewallet.png" loading="lazy" alt="Cake Wallet Logo">Cake Wallet</a></li>
<li><a class="ext-noicon" href="https://monerujo.io" aria-label="GitHub icon"><img src="/img/Monerujo-wallet.png" loading="lazy" alt="Monerujo Logo">Monerujo</a></li>
<li><a class="ext-noicon" href="https://mymonero.com" aria-label="GitHub icon"><img src="/img/mymonero.png" loading="lazy" alt="MyMonero Logo">MyMonero</a></li>
<li><a class="ext-noicon" href="https://edge.app/" aria-label="GitHub icon"><img src="/img/edge-wallet.png" loading="lazy" alt="Edge Logo">Edge</a></li>
</ul>
</div>
</div>
@ -300,11 +300,11 @@ permalink: /downloads/index.html
</div>
</div>
<div class="row mob-wallets center-xs">
<a class="ext-noicon" href="https://support.ledger.com/hc/en-us/articles/360006352934-Monero-XMR-"><img src="/img/ledger.png" alt="ledger logo"></a>
<a class="ext-noicon" href="https://wiki.trezor.io/Monero_(XMR)"><img src="/img/trezor.png" alt="Trezor logo"></a>
<a class="ext-noicon" href="https://support.ledger.com/hc/en-us/articles/360006352934-Monero-XMR-"><img src="/img/ledger.png" loading="lazy" alt="ledger logo"></a>
<a class="ext-noicon" href="https://wiki.trezor.io/Monero_(XMR)"><img src="/img/trezor.png" loading="lazy" alt="Trezor logo"></a>
</div>
<div class="row mob-wallets center-xs">
<a class="ext-noicon" href="https://github.com/monero-project/kastelo"><img src="/img/kastelo.png" alt="Kastelo logo"></a>
<a class="ext-noicon" href="https://github.com/monero-project/kastelo"><img src="/img/kastelo.png" loading="lazy" alt="Kastelo logo"></a>
</div>
</div>
<!-- End 'Hardware Wallets' -->

8
get-started/accepting/index.md
View File

@ -17,10 +17,10 @@ permalink: /get-started/accepting/index.html
<h3 id="gui">{% t accepting.title_gui %}</h3>
<p>{% t accepting.gui1 %}</p>
<p>{% t accepting.gui2 %} <a href="https://github.com/monero-ecosystem/monero-GUI-guide/blob/master/monero-GUI-guide.md#receive-monero">{% t accepting.guilinkguide %}</a></p>
<img class="top-margin" src="/img/receive.png" alt="receive page">
<img class="top-margin" src="/img/receive.png" loading="lazy" alt="receive page">
<p>{% t accepting.guiinstructions %}</p>
<p>{% t accepting.guimerchant %} <a href="https://github.com/monero-ecosystem/monero-GUI-guide/blob/master/monero-GUI-guide.md#merchant-view">{% t accepting.guilinkguide1 %}</a>.</p>
<img class="top-margin" src="/img/merchant_page.png" alt="merchant view">
<img class="top-margin" src="/img/merchant_page.png" loading="lazy" alt="merchant view">
<p>{% t accepting.guimerchant1 %}</p>
<p>{% t accepting.guisteps %}</p>
<ol>
@ -36,9 +36,9 @@ permalink: /get-started/accepting/index.html
<p>{% t accepting.clicreateaccount %}</p>
<p><code>account new [label text with white spaces allowed]</code></p>
<p>{% t accepting.clicreateaccount1 %}</p>
<img class="top-margin" src="/img/account_cli.png" alt="accounts">
<img class="top-margin" src="/img/account_cli.png" loading="lazy" alt="accounts">
<p>{% t accepting.cliindex %}</p>
<img class="top-margin" src="/img/account_switch.png" alt="accounts switch">
<img class="top-margin" src="/img/account_switch.png" loading="lazy" alt="accounts switch">
<p>{% t accepting.cliindex1 %}</p>
<p><code>address new [label text with white spaces allowed]</code></p>
<p><i>{% t accepting.clinotes %}</i></p>

8
get-started/what-is-monero/index.md
View File

@ -19,12 +19,12 @@ permalink: /get-started/what-is-monero/index.html
<p>{% t what-is-monero.leading_para2 %}</p>
</div>
<div class="col-lg-5 col-md-6 col-sm-4 col-xs-12 last-sm first-xs center-xs">
<img src="/img/crypto-lock.png" alt="Encrypted lock" class="main-icon">
<img src="/img/crypto-lock.png" loading="lazy" alt="Encrypted lock" class="main-icon">
</div>
</div>
<div class="row middle-xs info-block-row">
<div class="col-lg-5 col-md-6 col-sm-4 col-xs-12 center-xs">
<img src="/img/monero-classified.png" alt="Classified document" class="main-icon">
<img src="/img/monero-classified.png" loading="lazy" alt="Classified document" class="main-icon">
</div>
<div class="col-lg-7 col-md-6 col-sm-8 col-xs-12 why-text">
<h3>{% t what-is-monero.confidential %}</h3>
@ -38,12 +38,12 @@ permalink: /get-started/what-is-monero/index.html
<p>{% t what-is-monero.electronic_para1 %}</p>
</div>
<div class="col-lg-5 col-md-6 col-sm-4 col-xs-12 last-sm first-xs center-xs">
<img src="/img/monero-electronic-cash.png" alt="Electronic cash" class="main-icon">
<img src="/img/monero-electronic-cash.png" loading="lazy" alt="Electronic cash" class="main-icon">
</div>
</div>
<div class="row middle-xs info-block-row">
<div class="col-lg-5 col-md-6 col-sm-4 col-xs-12 center-xs">
<img src="/img/academic-growth.png" alt="Academic growth" class="main-icon">
<img src="/img/academic-growth.png" loading="lazy" alt="Academic growth" class="main-icon">
</div>
<div class="col-lg-7 col-md-6 col-sm-8 col-xs-12 why-text">
<h3>{% t what-is-monero.grassroots %}</h3>

12
index.html
View File

@ -45,12 +45,12 @@ permalink: index.html
<p><a href="{{ site.baseurl }}/downloads/" class="btn-link btn-fixed">{% t home.downloads %}</a></p>
</div>
<div class="col-lg-6 col-md-6 col-sm-4 col-xs-4 center-xs">
<img src="/img/create-wallet.png" alt="Create wallet" class="main-icon">
<img src="/img/create-wallet.png" loading="lazy" alt="Create wallet" class="main-icon">
</div>
</div>
<div class="row middle-xs info-block-row">
<div class="col-lg-6 col-md-6 col-sm-4 col-xs-4 center-xs first-md last-sm last-xs">
<img src="/img/exchange.png" alt="Exchange" class="main-icon">
<img src="/img/exchange.png" loading="lazy" alt="Exchange" class="main-icon">
</div>
<div class="col-lg-6 col-md-6 col-sm-8 col-xs-8 why-text">
<h3>{% t home.getcoins %}</h3>
@ -66,12 +66,12 @@ permalink: index.html
<p><a href="{{ site.baseurl }}/community/merchants/" class="btn-link btn-fixed">{% t home.merchants %}</a></p>
</div>
<div class="col-lg-6 col-md-6 col-sm-4 col-xs-4 center-xs">
<img src="/img/monero-accepted.png" alt="Merchants" class="main-icon">
<img src="/img/monero-accepted.png" loading="lazy" alt="Merchants" class="main-icon">
</div>
</div>
<div class="row middle-xs info-block-row">
<div class="col-lg-6 col-md-6 col-sm-4 col-xs-4 center-xs first-md last-sm last-xs">
<img src="/img/support.png" alt="FAQ" class="main-icon">
<img src="/img/support.png" loading="lazy" alt="FAQ" class="main-icon">
</div>
<div class="col-lg-6 col-md-6 col-sm-8 col-xs-8 why-text">
<h3>{% t home.answers %}</h3>
@ -135,12 +135,12 @@ permalink: index.html
<p><a href="{{site.baseurl}}/get-started/contributing/" class="btn-link btn-fixed">{% t home.contributing %}</a></p>
</div>
<div class="col-lg-6 col-md-6 col-sm-4 col-xs-4 center-xs">
<img src="/img/learn-about-monero.png" alt="Contribute" class="main-icon">
<img src="/img/learn-about-monero.png" loading="lazy" alt="Contribute" class="main-icon">
</div>
</div>
<div class="row middle-xs info-block-row">
<div class="col-lg-6 col-md-6 col-sm-4 col-xs-4 center-xs first-md last-sm last-xs">
<img src="/img/mrl-logo.svg" alt="Monero Research Lab" class="main-icon-mrl">
<img src="/img/mrl-logo.svg" loading="lazy" alt="Monero Research Lab" class="main-icon-mrl">
</div>
<div class="col-lg-6 col-md-6 col-sm-8 col-xs-8 why-text">
<h3>{% t titles.researchlab %}</h3>