perf(feed): lazy load

Web/Presenters/templates/Gifts/Menu.xml

@@ -17,7 +17,7 @@
 {/block}
 
 {block preview}
-    <img src="{$x->getThumbnailURL()}" width="75" alt="{$x->getName(tr('__lang'))}" />
+    <img src="{$x->getThumbnailURL()}" width="75" alt="{$x->getName(tr('__lang'))}" loading=lazy />
 {/block}
 
 {block name}
@@ -26,4 +26,4 @@
 
 {block description}
     {$x->getDescription(tr("__lang"))}
-{/block}
+{/block}

Web/Presenters/templates/Gifts/Pick.xml

@@ -14,8 +14,8 @@
 {block content}
     <div class="gift_grid">
         <div n:foreach="$gifts as $gift" n:class="gift_sel, !$gift->canUse($thisUser) ? disabled" data-gift="{$gift->getId()}">
-            <img class="gift_pic" src="{$gift->getImage(2)}" alt="{_gift}" />
+            <img class="gift_pic" src="{$gift->getImage(2)}" alt="{_gift}" loading=lazy />
-            
+
             <strong class="gift_price">
                 {if $gift->isFree()}
                     {_free_gift}
@@ -23,7 +23,7 @@
                     {tr('coins', $gift->getPrice())}
                 {/if}
             </strong>
-            
+
             <strong class="gift_limit">
                 {if $gift->getUsagesLeft($thisUser) !== INF}
                     {tr("gifts_left", $gift->getUsagesLeft($thisUser))}
@@ -31,7 +31,7 @@
             </strong>
         </div>
     </div>
-    
+
     <div style="padding: 8px;">
         {include "../components/paginator.xml", conf => (object) [
             "page"    => $page,
@@ -48,11 +48,11 @@
             let el = $(this);
             if(el.hasClass("disabled"))
                 return false;
-            
+
             let link = "/gifts?act=confirm&user={$user->getId()}&pack={$cat->getId()}&elid=";
             let gift = el.data("gift");
-            
+
             window.location.assign(link + gift);
         });
     </script>
-{/block}
+{/block}

Web/Presenters/templates/Gifts/UserGifts.xml

@@ -16,7 +16,7 @@
 {/block}
 
 {block preview}
-    <img src="{$x->gift->getImage(2)}" width="75" alt="{_gift}" />
+    <img src="{$x->gift->getImage(2)}" width="75" alt="{_gift}" loading=lazy />
 {/block}
 
 {block name}
@@ -40,4 +40,4 @@
             </tr>
         </tbody>
     </table>
-{/block}
+{/block}

Web/Presenters/templates/Group/View.xml

@@ -289,7 +289,7 @@
                         
                         <img
                             src="{is_null($cover)?'/assets/packages/static/openvk/img/camera_200.png':$cover->getURL()}"
-                            style="max-width: 80px; max-height: 54pt;" />
+                            style="max-width: 80px; max-height: 54pt;" loading=lazy />
                     </div>
                     <div>
                         <b><a href="/album{$album->getPrettyId()}">{$album->getName()}</a></b><br>

Web/Presenters/templates/Messenger/Index.xml

@@ -9,13 +9,13 @@
             <a id="act_tab_a" href="javascript:false">{_all_messages}</a>
         </div>
     </div>
-    
+
     <div class="container_gray">
         <form action="/im/search" method="POST" style="margin: 0;">
             <input type="text" name="pattern" placeholder="{_search_messages}" required />
         </form>
     </div>
-    
+
     {if sizeof($corresps) > 0}
         <div class="crp-list">
             <div n:foreach="$corresps as $coresp"
@@ -23,10 +23,10 @@
                  onmousedown="window.location.href = {$coresp->getURL()};" >
                 {var $recipient = $coresp->getCorrespondents()[1]}
                 {var $lastMsg   = $coresp->getPreviewMessage()}
-                
+
                 <div class="crp-entry--image">
                     <img src="{$recipient->getAvatarURL('miniscule')}"
-                    alt="Фотография пользователя" />
+                    alt="Фотография пользователя" loading=lazy />
                 </div>
                 <div class="crp-entry--info">
                     <a href="{$recipient->getURL()}">{$recipient->getCanonicalName()}</a><br/>
@@ -34,7 +34,7 @@
                 </div>
                 <div n:class="crp-entry--message, $lastMsg->getUnreadState() ? unread">
                     {var $_author = $lastMsg->getSender()}
-                    
+
                     <div class="crp-entry--message---av" n:if="$_author->getId() === $thisUser->getId()">
                         <img src="{$_author->getAvatarURL('miniscule')}"
                         alt="Фотография пользователя" />
@@ -53,4 +53,4 @@
         <br/>
         <center>{_no_messages}</center>
     {/if}
-{/block}
+{/block}

Web/Presenters/templates/Photos/Album.xml

@@ -41,7 +41,7 @@
                     </a>
                     
                     <a href="/photo{$photo->getPrettyId()}?from=album{$album->getId()}">
-                        <img class="album-photo--image" src="{$photo->getURLBySizeId('tinier')}" alt="{$photo->getDescription()}" />
+                        <img class="album-photo--image" src="{$photo->getURLBySizeId('tinier')}" alt="{$photo->getDescription()}"  loading=lazy />
                     </a>
                 </div>
             {/foreach}
@@ -50,4 +50,4 @@
     {else}
         {include "../components/nothing.xml"}
     {/if}
-{/block}
+{/block}

Web/Presenters/templates/Photos/AlbumList.xml

@@ -23,7 +23,7 @@
             {else}
                 {tr("albums", $count)}
             {/if}
-            
+
             <span n:if="$canEdit" style="float: right;">
                 &nbsp;|&nbsp;
                 {var $isClub = ($owner instanceof \openvk\Web\Models\Entities\Club)}
@@ -34,7 +34,7 @@
 {/block}
 
 {block actions}
-    
+
 {/block}
 
 {* BEGIN ELEMENTS DESCRIPTION *}
@@ -46,9 +46,9 @@
 {block preview}
     {var $cover   = $x->getCoverPhoto()}
     {var $preview = is_null($cover) ? "/assets/packages/static/openvk/img/camera_200.png" : $cover->getURLBySizeId("normal")}
-    
+
     <a href="/album{$x->getPrettyId()}">
-        <img src="{$preview}" alt="{$x->getName()}" style="height: 130px; width: 170px; object-fit: cover" />
+        <img src="{$preview}" alt="{$x->getName()}" style="height: 130px; width: 170px; object-fit: cover" loading=lazy />
     </a>
 {/block}
 
@@ -61,4 +61,4 @@
     <span style="color: grey;">{$x->getPhotosCount()} {_photos}</span><br />
     <span style="color: grey;">{tr("updated_at", $x->getEditTime() ?? $x->getCreationTime())}</span><br />
     <span style="color: grey;">{_created} {$x->getCreationTime()}</span><br />
-{/block}
+{/block}

Web/Presenters/templates/Poll/Voters.xml

@@ -22,7 +22,7 @@
 {/block}
 
 {block preview}
-    <img src="{$x->getAvatarUrl('miniscule')}" width="75" alt="Фотография пользователя" />
+    <img src="{$x->getAvatarUrl('miniscule')}" width="75" alt="Фотография пользователя" loading=lazy />
 {/block}
 
 {block name}
@@ -37,4 +37,4 @@
 {/block}
 
 {block actions}
-{/block}
+{/block}

Web/Presenters/templates/Search/Index.xml

@@ -23,7 +23,7 @@
 {/block}
 
 {block preview}
-    <img src="{$x->getAvatarUrl('miniscule')}" width="75" alt="{_photo}" />
+    <img src="{$x->getAvatarUrl('miniscule')}" width="75" alt="{_photo}" loading=lazy />
 {/block}
 
 {block name}

Web/Presenters/templates/User/Friends.xml

@@ -97,7 +97,7 @@
 {/block}
 
 {block preview}
-    <img src="{$x->getAvatarUrl('miniscule')}" width="75" alt="Фотография пользователя" />
+    <img src="{$x->getAvatarUrl('miniscule')}" width="75" alt="Фотография пользователя" loading=lazy />
 {/block}
 
 {block name}
@@ -161,4 +161,4 @@
             </form>
         {/if}
     {/if}
-{/block}
+{/block}

Web/Presenters/templates/User/Groups.xml

@@ -48,7 +48,7 @@
 {/block}
 
 {block preview}
-    <img src="{$x->getAvatarUrl('miniscule')}" width="75" alt="Фотография группы" />
+    <img src="{$x->getAvatarUrl('miniscule')}" width="75" alt="Фотография группы" loading=lazy />
 {/block}
 
 {block name}{/block}
@@ -128,4 +128,4 @@
             </div>
         </div>
     {/if}
-{/block}
+{/block}

Web/Presenters/templates/User/View.xml

@@ -304,7 +304,7 @@
                             
                             <img
                                 src="{is_null($cover)?'/assets/packages/static/openvk/img/camera_200.png':$cover->getURLBySizeId('small')}"
-                                style="max-width: 80px; max-height: 54pt;" />
+                                style="max-width: 80px; max-height: 54pt;" loading=lazy />
                         </div>
                         <div style="overflow: hidden; overflow-wrap: break-word;">
                             <b><a href="/album{$album->getPrettyId()}">{$album->getName()}</a></b><br>
@@ -656,7 +656,7 @@
                                 <img style="width: 70px; max-height: 70px;"
                                     src="{$giftDescriptor->gift->getImage(2)}"
                                     alt="{$hideInfo ? tr('gift') : ($giftDescriptor->caption ?? tr('gift'))}" 
-                                    title="{$hideInfo ? tr('gift') : ($giftDescriptor->caption ?? tr('gift'))}" />
+                                    title="{$hideInfo ? tr('gift') : ($giftDescriptor->caption ?? tr('gift'))}" loading=lazy />
                             </a>  
                         </div>
                     </div>

Web/Presenters/templates/components/attachment.xml

@@ -2,7 +2,7 @@
     {if !$attachment->isDeleted()}
         {var $link = "/photo" . ($attachment->isAnonymous() ? ("s/" . base_convert((string) $attachment->getId(), 10, 32)) : $attachment->getPrettyId())}
         <a href="{$link}" onclick="OpenMiniature(event, {$attachment->getURLBySizeId('normal')}, {$parent->getPrettyId()}, {$attachment->getPrettyId()}, {$parentType})">
-            <img class="media media_makima" src="{$attachment->getURLBySizeId('normal')}" alt="{$attachment->getDescription()}" />
+            <img class="media media_makima" src="{$attachment->getURLBySizeId('normal')}" alt="{$attachment->getDescription()}" loading=lazy />
         </a>
     {else}
         <a href="javascript:alert('{_attach_no_longer_available}');">
@@ -58,4 +58,4 @@
     <span style="color:red;">{_version_incompatibility}</span>
 {/if}
 
-{php $GLOBALS["_nesAttGloCou"] = NULL}
+{php $GLOBALS["_nesAttGloCou"] = NULL}

Web/Presenters/templates/components/post/oldpost.xml

@@ -14,7 +14,7 @@
         <tr>
             <td width="54" valign="top">
                 <a href="{$author->getURL()}">
-                    <img src="{$author->getAvatarURL('miniscule')}" class="post-avatar" width="50" />
+                    <img src="{$author->getAvatarURL('miniscule')}" class="post-avatar" width="50" loading=lazy />
                     <span n:if="!$post->isPostedOnBehalfOfGroup() && !($compact ?? false) && $author->isOnline()" class="post-online">{_online}</span>
                 </a>
             </td>
@@ -165,4 +165,4 @@
             </td>
         </tr>
     </tbody>
-</table>
+</table>