Skip to content

Commit

Permalink
Improve performance
Browse files Browse the repository at this point in the history
  • Loading branch information
@faisalnjs
faisalnjs committed Oct 19, 2024
1 parent 5e98c0a commit ee38445
Show file tree
Hide file tree
Showing 14 changed files with 21 additions and 45 deletions.
5 changes: 2 additions & 3 deletions frontend/pages/about.ejs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,19 +2,18 @@

<head>
<%- include('../partials/head.ejs'); %>
<link rel="preload" as="image" href="<%- vars.asset_prefix %><%= cms.about[0].image.path %>">
</head>

<body>
<%- include('../partials/header.ejs'); %>
<div class="about">
<div class="split">
<% if (cms.about[0].image != null) { %><img src="<%- vars.asset_prefix %><%= cms.about[0].image.path %>" <% if (cms.about[0].image.description != "") { %>alt="<%= cms.about[0].image.description %>" <% } %> /><% } %>
<% if (cms.about[0].image != null) { %><img loading="lazy" src="<%- vars.asset_prefix %><%= cms.about[0].image.path %>" <% if (cms.about[0].image.description != "") { %>alt="<%= cms.about[0].image.description %>" <% } %> /><% } %>
<div class="content">
<%- cms.about[0].content %>
</div>
</div>
<% if (cms.about[0].image-2 != null) { %><img src="<%- vars.asset_prefix %><%= cms.about[0]['image-2'].path %>" <% if (cms.about[0]['image-2'].description != "") { %>alt="<%= cms.about[0]['image-2'].description %>" <% } %> /><% } %>
<% if (cms.about[0].image-2 != null) { %><img loading="lazy" src="<%- vars.asset_prefix %><%= cms.about[0]['image-2'].path %>" <% if (cms.about[0]['image-2'].description != "") { %>alt="<%= cms.about[0]['image-2'].description %>" <% } %> /><% } %>
</div>
<%- include('../partials/footer.ejs'); %>
</body>
Expand Down
8 changes: 2 additions & 6 deletions frontend/pages/article.ejs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,10 +12,6 @@
return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
});
}; %>
<% if (article.images[0] != null) { for (image of article.images) { %>
<link rel="preload" as="image" href="<%- vars.asset_prefix %><% if ((article.author != "") && (article.author != null)) { %><%= cms.siteDetails[0].unknown.path %><% } else { %><%= cms.siteDetails[0].favicon.path %><% } %>"><% }} %>
<% if (article.images[0] != null) { for (image of article.images) { %>
<link rel="preload" as="image" href="<%- vars.asset_prefix %><%= image.path %>"><% }} %>
</head>

<body>
Expand Down Expand Up @@ -54,7 +50,7 @@
<ul class="splide__list">
<% for (image of article.images) { %>
<a class="splide__slide" href="<%- vars.asset_prefix %><%= image.path %>" data-lightbox="<%= image._id %>">
<img src="<%- vars.asset_prefix %><%= image.path %>" alt="<%= image.description %>">
<img loading="lazy" src="<%- vars.asset_prefix %><%= image.path %>" alt="<%= image.description %>">
<div>
<%= image.description %>
</div>
Expand All @@ -67,7 +63,7 @@
<% if ((article.content != null) && (article.content != '')) { %>
<div class="content">
<b><% if (article.content.replaceAll('<p>', '').replaceAll('</p>', '').replaceAll('&nbsp;', '').replaceAll(' ', '') != '') { %>(<% if ((article.author != "") && (article.author != null)) { %><%- article.author %><% } else { %><%= cms.siteDetails[0].title %> Writers<% } %>) —<% } else { %><% if ((article.author != "") && (article.author != null)) { %><%- article.author %><% } else { %><%= cms.siteDetails[0].title %> Writers<% } %><% } %></b>
<%- article.content.replaceAll('<img src="/', '<img src="' + vars.asset_url) %>
<%- article.content.replaceAll('<img src="/', '<img loading="lazy" src="' + vars.asset_url) %>
</div>
<% } %>
</div>
Expand Down
3 changes: 1 addition & 2 deletions frontend/pages/articles.ejs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,6 @@
return date.toDateString() === yesterday.toDateString();
}; %>
<link rel="preload" as="image" href="<%- vars.asset_prefix %><%= cms.siteDetails[0].background.path %>">
<% if (cms.articles.filter(article => !article.unlisted).length > 0) { const articles = cms.articles.sort((a, b) => new Date(b.date) - new Date(a.date)).filter(article => !article.unlisted); for (let i = 0; i < articles.length; i++) { const article = articles[i]; if (article.images[0] != null) { %><link rel="preload" as="image" href="<%- vars.asset_prefix %><%= article.images[0].path %>"><% }}} %>
</head>

<body>
Expand All @@ -23,7 +22,7 @@
<% const articles = cms.articles.sort((a, b) => new Date(b.date) - new Date(a.date)).filter(article => !article.unlisted); for (let i = 0; i < articles.length; i++) { const article = articles[i]; %>
<a class="article<% if (i % 3 === 0) { %> left<% } else if (i === 1 || (i - 1) % 3 === 0) { %> middle<% } else if ((i - 2) % 3 === 0) { %> right<% } %>" href="<%- vars.domain %>/articles/<%= new Date(article.date).getFullYear() %>/<%= article.slug %>" title="<%= article.title %>">
<div class="inner">
<img src="<% if (article.images[0] != null) { %><%- vars.asset_prefix %><%= article.images[0].path %>" <% if ((article.images[0].height / article.images[0].width) > 0.60) { %>style="width: min-content;" <% if (article.images[0].description != "") { %>alt="<%= article.images[0].description %>" <% } %><% } } else { %> "<% } %> />
<img loading="lazy" src="<% if (article.images[0] != null) { %><%- vars.asset_prefix %><%= article.images[0].path %>" <% if ((article.images[0].height / article.images[0].width) > 0.60) { %>style="width: min-content;" <% if (article.images[0].description != "") { %>alt="<%= article.images[0].description %>" <% } %><% } } else { %> "<% } %> />
<h3><%= article.title %></h3>
<% if (article.description != null) { %><h4><% if (article.description.length > 50) { %><%= article.description.slice(0, 47) %>...<% } else { %><%= article.description %><% } %></h4><% } %>
<p><% var date = new Date(article.date); if (date.isToday()) { %>Today<% } else if (ifYesterday(date)) { %>Yesterday<% } else { %><%= date.toLocaleDateString('en-US', { month: 'long', day: 'numeric', year: 'numeric' }) %><% } %><% if ((article.author != "") && (article.author != null)) { %> / <%= article.author %><% } %></p>
Expand Down
6 changes: 2 additions & 4 deletions frontend/pages/artwork.ejs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,6 @@
return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
});
}; %>
<link rel="preload" as="image" href="<%- vars.asset_prefix %><% if ((artwork.author != "") && (artwork.author != null)) { %><%= cms.siteDetails[0].unknown.path %><% } else { %><%= cms.siteDetails[0].favicon.path %><% } %>">
<link rel="preload" as="image" href="<%- vars.asset_prefix %><%= artwork.artwork.path %>">
</head>

<body>
Expand All @@ -28,7 +26,7 @@
<% if (artwork.tags != null) { %><p>Tags: <% for (tag of artwork.tags) { %><a href="<%- vars.domain %>/tags/<%= tag.replaceAll(" ", "-") %>" title="#<%= tag.toLowerCase().replaceAll(" ", "-") %>">#<%= tag.toLowerCase().replaceAll(" ", "-") %></a> <% } %></p><% } %>
</div>
<div class="author">
<a href="<%- vars.domain %>/search?query=<%= (((artwork.author != "") && (artwork.author != null)) ? artwork.author : cms.siteDetails[0].title).replaceAll(" ", "+") %>"><img src="<%- vars.asset_prefix %><% if ((artwork.author != "") && (artwork.author != null)) { %><%= cms.siteDetails[0].unknown.path %><% } else { %><%= cms.siteDetails[0].favicon.path %><% } %>" alt="Author" /></a>
<a href="<%- vars.domain %>/search?query=<%= (((artwork.author != "") && (artwork.author != null)) ? artwork.author : cms.siteDetails[0].title).replaceAll(" ", "+") %>"><img loading="lazy" src="<%- vars.asset_prefix %><% if ((artwork.author != "") && (artwork.author != null)) { %><%= cms.siteDetails[0].unknown.path %><% } else { %><%= cms.siteDetails[0].favicon.path %><% } %>" alt="Author" /></a>
<div class="info">
<h4><% if ((artwork.author != "") && (artwork.author != null)) { %><%= artwork.author %><% } else { %><%= cms.siteDetails[0].title %><% } %></h4>
<h5><a href="<%- vars.domain %>" title="<%= cms.siteDetails[0].title %>"><%= cms.siteDetails[0].title %></a> - Writer<% if ((artwork.author != "") && (artwork.author != null)) { %><% } else { %>s<% } %></h5>
Expand All @@ -50,7 +48,7 @@
<div class="splide__track">
<ul class="splide__list">
<a class="splide__slide" href="<%- vars.asset_prefix %><%= artwork.artwork.path %>" data-lightbox="<%= artwork.artwork._id %>">
<img src="<%- vars.asset_prefix %><%= artwork.artwork.path %>" alt="<%= artwork.artwork.description %>">
<img loading="lazy" src="<%- vars.asset_prefix %><%= artwork.artwork.path %>" alt="<%= artwork.artwork.description %>">
<div>
<%= artwork.artwork.description %>
</div>
Expand Down
4 changes: 1 addition & 3 deletions frontend/pages/artworks.ejs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,6 @@
yesterday.setDate(yesterday.getDate() - 1);
return date.toDateString() === yesterday.toDateString();
}; %>
<link rel="preload" as="image" href="<%- vars.asset_prefix %><%= cms.siteDetails[0].background.path %>">
<% if (cms.artworks.length > 0) { const artworks = cms.artworks.sort((a, b) => new Date(b.date) - new Date(a.date)); for (let i = 0; i < artworks.length; i++) { const artwork = artworks[i]; if (artwork.artwork != null) { %><link rel="preload" as="image" href="<%- vars.asset_prefix %><%= artwork.artwork.path %>"><% }}} %>
</head>

<body>
Expand All @@ -23,7 +21,7 @@
<% const artworks = cms.artworks.sort((a, b) => new Date(b.date) - new Date(a.date)); for (let i = 0; i < artworks.length; i++) { const artwork = artworks[i]; %>
<a class="article<% if (i % 3 === 0) { %> left<% } else if (i === 1 || (i - 1) % 3 === 0) { %> middle<% } else if ((i - 2) % 3 === 0) { %> right<% } %>" href="<%- vars.domain %>/artworks/<%= artwork.slug %>" title="<%= artwork.title %>">
<div class="inner">
<img src="<% if (artwork.artwork != null) { %><%- vars.asset_prefix %><%= artwork.artwork.path %>" <% if ((artwork.artwork.height / artwork.artwork.width) > 0.60) { %>style="width: min-content;" <% if (artwork.artwork.description != "") { %>alt="<%= artwork.artwork.description %>" <% } %><% } } else { %> "<% } %> />
<img loading="lazy" src="<% if (artwork.artwork != null) { %><%- vars.asset_prefix %><%= artwork.artwork.path %>" <% if ((artwork.artwork.height / artwork.artwork.width) > 0.60) { %>style="width: min-content;" <% if (artwork.artwork.description != "") { %>alt="<%= artwork.artwork.description %>" <% } %><% } } else { %> "<% } %> />
<h3><%= artwork.title %></h3>
<% if (artwork.description != null) { %><h4><% if (artwork.description.length > 50) { %><%= artwork.description.slice(0, 47) %>...<% } else { %><%= artwork.description %><% } %></h4><% } %>
<p><% var date = new Date(artwork.date); if (date.isToday()) { %>Today<% } else if (ifYesterday(date)) { %>Yesterday<% } else { %><%= date.toLocaleDateString('en-US', { month: 'long', day: 'numeric', year: 'numeric' }) %><% } %><% if ((artwork.author != "") && (artwork.author != null)) { %> / <%= artwork.author %><% } %></p>
Expand Down
6 changes: 2 additions & 4 deletions frontend/pages/index.ejs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,6 @@
<% if (cms.newspapers[0]) { %><link rel="preload" as="image" href="<%= vars.asset_prefix %><%= cms.newspapers[0].image.path %>"><% } %>
<% if (cms.newspapers[1]) { %><link rel="preload" as="image" href="<%= vars.asset_prefix %><%= cms.newspapers[1].image.path %>"><% } %>
<% if (cms.newspapers[2]) { %><link rel="preload" as="image" href="<%= vars.asset_prefix %><%= cms.newspapers[2].image.path %>"><% } %>
<% if (cms.articles.length > 0) { for (let i = 0; i < 3 && i < cms.articles.length; i++) { const article = cms.articles.sort((a, b) => new Date(b.date) - new Date(a.date)).filter(article => !article.unlisted)[i]; if (article.images[0] != null) { %><link rel="preload" as="image" href="<%- vars.asset_prefix %><%= article.images[0].path %>"><% }}} %>
<% if (cms.artworks.length > 0) { for (let i = 0; i < 3 && i < cms.artworks.length; i++) { const article = cms.artworks.sort((a, b) => new Date(b.date) - new Date(a.date)).filter(article => !article.unlisted)[i]; if (article.images[0] != null) { %><link rel="preload" as="image" href="<%- vars.asset_prefix %><%= article.images[0].path %>"><% }}} %>
</head>

<body>
Expand Down Expand Up @@ -47,7 +45,7 @@
<% for (let i = 0; i < 3 && i < cms.articles.length; i++) { const article = cms.articles.sort((a, b) => new Date(b.date) - new Date(a.date)).filter(article => !article.unlisted)[i]; %>
<a class="article<% if (i % 3 === 0) { %> left<% } else if (i === 1 || (i - 1) % 3 === 0) { %> middle<% } else if ((i - 2) % 3 === 0) { %> right<% } %>" href="<%- vars.domain %>/articles/<%= new Date(article.date).getFullYear() %>/<%= article.slug %>" title="<%= article.title %>" style="border-bottom: none">
<div class="inner">
<img src="<% if (article.images[0] != null) { %><%- vars.asset_prefix %><%= article.images[0].path %>" <% if ((article.images[0].height / article.images[0].width) > 0.60) { %>style="width: min-content;" <% if (article.images[0].description != "") { %>alt="<%= article.images[0].description %>" <% } %><% } } else { %> "<% } %> />
<img loading="lazy" src="<% if (article.images[0] != null) { %><%- vars.asset_prefix %><%= article.images[0].path %>" <% if ((article.images[0].height / article.images[0].width) > 0.60) { %>style="width: min-content;" <% if (article.images[0].description != "") { %>alt="<%= article.images[0].description %>" <% } %><% } } else { %> "<% } %> />
<h3><%= article.title %></h3>
<% if (article.description != null) { %><h4><% if (article.description.length > 50) { %><%= article.description.slice(0, 47) %>...<% } else { %><%= article.description %><% } %></h4><% } %>
<p><% var date = new Date(article.date); if (date.isToday()) { %>Today<% } else if (ifYesterday(date)) { %>Yesterday<% } else { %><%= date.toLocaleDateString('en-US', { month: 'long', day: 'numeric', year: 'numeric' }) %><% } %><% if ((article.author != "") && (article.author != null)) { %> / <%= article.author %><% } %></p>
Expand All @@ -65,7 +63,7 @@
<% for (let i = 0; i < 3 && i < cms.artworks.length; i++) { const artwork = cms.artworks.sort((a, b) => new Date(b.date) - new Date(a.date)).filter(article => !article.unlisted)[i]; %>
<a class="article<% if (i % 3 === 0) { %> left<% } else if (i === 1 || (i - 1) % 3 === 0) { %> middle<% } else if ((i - 2) % 3 === 0) { %> right<% } %>" href="<%- vars.domain %>/artworks/<%= artwork.slug %>" title="<%= artwork.title %>" style="border-bottom: none">
<div class="inner">
<img src="<%- vars.asset_prefix %><%= artwork.artwork.path %>" <% if ((artwork.artwork.height / artwork.artwork.width) > 0.60) { %>style="width: min-content;" <% } %><% if (artwork.artwork.description != "") { %>alt="<%= artwork.artwork.description %>" <% } %> />
<img loading="lazy" src="<%- vars.asset_prefix %><%= artwork.artwork.path %>" <% if ((artwork.artwork.height / artwork.artwork.width) > 0.60) { %>style="width: min-content;" <% } %><% if (artwork.artwork.description != "") { %>alt="<%= artwork.artwork.description %>" <% } %> />
<h3><%= artwork.title %></h3>
<p><% var date = new Date(artwork.date); if (date.isToday()) { %>Today<% } else if (ifYesterday(date)) { %>Yesterday<% } else { %><%= date.toLocaleDateString('en-US', { month: 'long', day: 'numeric', year: 'numeric' }) %><% } %><% if ((artwork.author != "") && (artwork.author != null)) { %> / <%= artwork.author %><% } %></p>
</div>
Expand Down
12 changes: 5 additions & 7 deletions frontend/pages/newspaper.ejs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,7 @@
yesterday.setDate(yesterday.getDate() - 1);
return date.toDateString() === yesterday.toDateString();
}; %>
<link rel="preload" as="image" href="<%- vars.asset_prefix %><%= cms.siteDetails[0].favicon.path %>">
<% if (newspaper.articles.length != 0) { for (article of newspaper.articles) { article = cms.articles.find(a => a._id === article._id); if (article) { if (article.images[0] != null) { for (image of article.images) { %>
<link rel="preload" as="image" href="<%- vars.asset_prefix %><%= image.path %>"><% }}}}} %>
<% if (newspaper.articles.length != 0) { article = cms.articles.find(a => a._id === newspaper.articles[0]._id); if (article) { if (article.images[0] != null) { %><link rel="preload" as="image" href="<%- vars.asset_prefix %><%= article.images[0].path %>"><% }}} %>
</head>

<body>
Expand Down Expand Up @@ -55,7 +53,7 @@
<ul class="splide__list">
<% for (image of article.images) { %>
<a class="splide__slide" href="<%- vars.asset_prefix %><%= image.path %>" data-lightbox="<%= image._id %>">
<img src="<%- vars.asset_prefix %><%= image.path %>" alt="<%= image.description %>">
<img loading="lazy" src="<%- vars.asset_prefix %><%= image.path %>" alt="<%= image.description %>">
<div>
<%= image.description %>
</div>
Expand All @@ -68,7 +66,7 @@
<h2><%= article.title %></h2>
<% if ((article.content != null) && (article.content != '')) { %>
<b><% if (article.content.replaceAll('<p>', '').replaceAll('</p>', '').replaceAll('&nbsp;', '').replaceAll(' ', '') != '') { %>(<% if ((article.author != "") && (article.author != null)) { %><%- article.author %><% } else { %><%= cms.siteDetails[0].title %> Writers<% } %>) —<% } else { %><% if ((article.author != "") && (article.author != null)) { %><%- article.author %><% } else { %><%= cms.siteDetails[0].title %> Writers<% } %><% } %></b>
<%- article.content.replaceAll('<img src="/', '<img src="' + vars.asset_url) %>
<%- article.content.replaceAll('<img src="/', '<img loading="lazy" src="' + vars.asset_url) %>
<% } %>
</div>
<br />
Expand All @@ -87,7 +85,7 @@
<ul class="splide__list">
<% for (image of article.images) { %>
<a class="splide__slide" href="<%- vars.asset_prefix %><%= image.path %>" data-lightbox="<%= image._id %>">
<img src="<%- vars.asset_prefix %><%= image.path %>" alt="<%= image.description %>">
<img loading="lazy" src="<%- vars.asset_prefix %><%= image.path %>" alt="<%= image.description %>">
<div>
<%= image.description %>
</div>
Expand All @@ -100,7 +98,7 @@
<h2><%= article.title %></h2>
<% if ((article.content != null) && (article.content != '')) { %>
<b><% if (article.content.replaceAll('<p>', '').replaceAll('</p>', '').replaceAll('&nbsp;', '').replaceAll(' ', '') != '') { %>(<% if ((article.author != "") && (article.author != null)) { %><%- article.author %><% } else { %><%= cms.siteDetails[0].title %> Writers<% } %>) —<% } else { %><% if ((article.author != "") && (article.author != null)) { %><%- article.author %><% } else { %><%= cms.siteDetails[0].title %> Writers<% } %><% } %></b>
<%- article.content.replaceAll('<img src="/', '<img src="' + vars.asset_url) %>
<%- article.content.replaceAll('<img src="/', '<img loading="lazy" src="' + vars.asset_url) %>
<% } %>
</div>
<br />
Expand Down
4 changes: 1 addition & 3 deletions frontend/pages/newspapers.ejs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,6 @@
yesterday.setDate(yesterday.getDate() - 1);
return date.toDateString() === yesterday.toDateString();
} %>
<link rel="preload" as="image" href="<%- vars.asset_prefix %><%= cms.siteDetails[0].background.path %>">
<% if (cms.newspapers.length > 0) { for (let i = 0; i < cms.newspapers.length; i++) { const newspaper = cms.newspapers.sort((a, b) => new Date(b.date) - new Date(a.date))[i]; %><link rel="preload" as="image" href="<%- vars.asset_prefix %><%= newspaper.image.path %>"><% }} %>
</head>

<body>
Expand All @@ -23,7 +21,7 @@
<% for (let i = 0; i < cms.newspapers.length; i++) { const newspaper = cms.newspapers.sort((a, b) => new Date(b.date) - new Date(a.date))[i]; %>
<a class="article<% if (i === 1 || (i - 1) % 3 === 0) { %> middle<% } %>" href="<%- vars.domain %>/newspapers/<%= newspaper.slug %>" title="<%= newspaper.title %>">
<div class="inner">
<img src="<%- vars.asset_prefix %><%= newspaper.image.path %>" <% if (newspaper.image.description != "") { %>alt="<%= newspaper.image.description %>" <% } %> />
<img loading="lazy" src="<%- vars.asset_prefix %><%= newspaper.image.path %>" <% if (newspaper.image.description != "") { %>alt="<%= newspaper.image.description %>" <% } %> />
<h3><%= newspaper.title %></h3>
<p><% var date = new Date(newspaper.date); if (date.isToday()) { %>Today<% } else if (ifYesterday(date)) { %>Yesterday<% } else { %><%= date.toLocaleDateString('en-US', { month: 'long', day: 'numeric', year: 'numeric' }) %><% } %></p>
</div>
Expand Down
1 change: 0 additions & 1 deletion frontend/pages/poll.ejs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,6 @@
for (let i = 0; i < poll.answers.length; i++) {
answerCount.push((answers[i] || []).length);
}; %>
<link rel="preload" as="image" href="<%- vars.asset_prefix %><%= cms.siteDetails[0].favicon.path %>">
</head>

<body>
Expand Down
1 change: 0 additions & 1 deletion frontend/pages/polls.ejs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@
yesterday.setDate(yesterday.getDate() - 1);
return date.toDateString() === yesterday.toDateString();
}; %>
<link rel="preload" as="image" href="<%- vars.asset_prefix %><%= cms.siteDetails[0].background.path %>">
</head>

<body>
Expand Down
Loading

0 comments on commit ee38445

Please sign in to comment.