perf: lighthouse optimizations - inline critical CSS, lazy-load routes, WebP images, fix CLS and contrast

This commit is contained in:
2026-02-08 11:22:36 +01:00
parent 013d591e75
commit c66c80adcc
23 changed files with 448 additions and 101 deletions

View File

@@ -8,7 +8,7 @@ let cachedRates = null
class ListingCard extends HTMLElement {
static get observedAttributes() {
return ['listing-id', 'title', 'price', 'currency', 'location', 'image', 'owner-id', 'payment-status', 'status']
return ['listing-id', 'title', 'price', 'currency', 'location', 'image', 'owner-id', 'payment-status', 'status', 'priority']
}
constructor() {
@@ -141,7 +141,7 @@ class ListingCard extends HTMLElement {
<${linkTag} ${linkAttr} class="listing-link">
<div class="listing-image">
${image
? `<img src="${escapeHTML(image)}" alt="${escapeHTML(title)}" loading="lazy">`
? `<img src="${escapeHTML(image)}" alt="${escapeHTML(title)}"${this.hasAttribute('priority') ? ' fetchpriority="high"' : ' loading="lazy"'}>`
: placeholderSvg}
${paymentBadge}
</div>