perf(images): add loading=lazy to in-list previews and attachments

Four image sites that render thumbnails/previews inside lists or tab
panels now hint loading=lazy so the browser defers the network fetch
until the element is near the viewport:
- Support.tsx attachment preview grid
- AdminTickets.tsx reply attachment grid
- BroadcastPreview.tsx photo preview
- BrandingTab.tsx logo preview in admin settings

Top-of-page logos (AppHeader/AppShell/DesktopSidebar/Login/Telegram
redirect/DeepLink) intentionally stay eager — they're above the fold
and should paint on first frame. Payment-method icons (6x6 px) are
already negligible. Compose attachment previews use blob: URLs where
loading=lazy is a no-op.
This commit is contained in:
c0mrade
2026-05-26 16:05:52 +03:00
parent 3af2559dd0
commit b6613ae4c9
4 changed files with 9 additions and 1 deletions

View File

@@ -217,7 +217,12 @@ export function TelegramPreview({
<div className="rounded-xl bg-[#0e1621] p-3">
<div className="ml-auto max-w-[90%] rounded-2xl rounded-tr-md bg-[#2b5278] p-3 text-white shadow">
{mediaUrl && mediaType === 'photo' && (
<img src={mediaUrl} alt="" className="mb-2 max-h-72 w-full rounded-lg object-cover" />
<img
src={mediaUrl}
alt=""
loading="lazy"
className="mb-2 max-h-72 w-full rounded-lg object-cover"
/>
)}
{mediaUrl && mediaType === 'video' && (
<video src={mediaUrl} controls className="mb-2 max-h-72 w-full rounded-lg" />