clones/friendica
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

add loagin="lazy" to avatar-images too 

resolves #13486

The loading of avatar-images still blocked the loading of notifications.

mostyl in frio!
now it's a big time improvement on loading friendica
This commit is contained in:
Jakobus Schürz 2023-10-04 11:56:46 +02:00
parent 0a13d7625f
commit 3596b5e165
6 changed files with 10 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
view/templates/notifications/nav/notify.tpl
View File

@ -1,3 +1,3 @@
<li class="notification-{{if !$notify.seen}}un{{/if}}seen"> <li class="notification-{{if !$notify.seen}}un{{/if}}seen">
<a href="{{$notify.href}}" title="{{$notify.localdate}}"><img data-src="{{$notify.contact.photo}}" height="24" width="24" alt="" />{{$notify.richtext nofilter}} <span class="notif-when">{{$notify.ago}}</span></a> <a href="{{$notify.href}}" title="{{$notify.localdate}}"><img data-src="{{$notify.contact.photo}}" height="24" width="24" alt="" loading="lazy"/>{{$notify.richtext nofilter}} <span class="notif-when">{{$notify.ago}}</span></a>
</li> </li>

4
view/theme/frio/templates/contact/entry.tpl
View File

@ -7,7 +7,7 @@
<div class="contact-photo-image-wrapper hidden-xs"> <div class="contact-photo-image-wrapper hidden-xs">
<a href="{{if !empty($contact.photo_menu.edit)}}{{$contact.photo_menu.edit.1}}{{else}}{{$contact.url}}{{/if}}"> <a href="{{if !empty($contact.photo_menu.edit)}}{{$contact.photo_menu.edit.1}}{{else}}{{$contact.url}}{{/if}}">
<img class="contact-photo media-object xl" src="{{$contact.thumb}}" {{$contact.sparkle}} alt="{{$contact.name}}" /> <img class="contact-photo media-object xl" src="{{$contact.thumb}}" {{$contact.sparkle}} alt="{{$contact.name}}" loading="lazy"/>
</a> </a>
</div> </div>
@ -15,7 +15,7 @@
<button type="button" class="btn btn-default dropdown-toggle visible-xs" id="contact-photo-menu-button-{{$contact.id}}" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <button type="button" class="btn btn-default dropdown-toggle visible-xs" id="contact-photo-menu-button-{{$contact.id}}" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
{{* use a smaller picture on very small displays (e.g. mobiles) *}} {{* use a smaller picture on very small displays (e.g. mobiles) *}}
<div class="contact-photo-image-wrapper visible-xs"> <div class="contact-photo-image-wrapper visible-xs">
<img class="contact-photo-xs media-object" src="{{$contact.thumb}}" {{$contact.sparkle}} alt="{{$contact.name}}" /> <img class="contact-photo-xs media-object" src="{{$contact.thumb}}" {{$contact.sparkle}} alt="{{$contact.name}}" loading="lazy"/>
{{* Overlay background on hover the avatar picture *}} {{* Overlay background on hover the avatar picture *}}
<div class="contact-photo-overlay"> <div class="contact-photo-overlay">

2
view/theme/frio/templates/notifications/nav/notify.tpl
View File

@ -1,7 +1,7 @@
<li class="notification-{{if !$notify.seen}}un{{/if}}seen notif-entry"> <li class="notification-{{if !$notify.seen}}un{{/if}}seen notif-entry">
<div class="notif-entry-wrapper media"> <div class="notif-entry-wrapper media">
<div class="notif-photo-wrapper media-object pull-left" aria-hidden="true"> <div class="notif-photo-wrapper media-object pull-left" aria-hidden="true">
<a href="{{$notify.contact.url}}" class="userinfo click-card" tabIndex="-1"><img data-src="{{$notify.contact.photo}}" alt=""></a> <a href="{{$notify.contact.url}}" class="userinfo click-card" tabIndex="-1"><img data-src="{{$notify.contact.photo}}" alt="" loading="lazy"></a>
</div> </div>
<a href="{{$notify.href}}" class="notif-desc-wrapper media-body"> <a href="{{$notify.href}}" class="notif-desc-wrapper media-body">
{{$notify.richtext nofilter}} {{$notify.richtext nofilter}}

4
view/theme/frio/templates/search_item.tpl
View File

@ -12,14 +12,14 @@
<div class="hidden-sm hidden-xs contact-photo-wrapper mframe{{if $item.owner_url}} wwfrom{{/if}}"> <div class="hidden-sm hidden-xs contact-photo-wrapper mframe{{if $item.owner_url}} wwfrom{{/if}}">
<a href="{{$item.profile_url}}" class="userinfo click-card u-url" id="wall-item-photo-menu-{{$item.id}}"> <a href="{{$item.profile_url}}" class="userinfo click-card u-url" id="wall-item-photo-menu-{{$item.id}}">
<div class="contact-photo-image-wrapper"> <div class="contact-photo-image-wrapper">
<img src="{{$item.thumb}}" class="contact-photo media-object {{$item.sparkle}}" id="wall-item-photo-{{$item.id}}" alt="{{$item.name}}" /> <img src="{{$item.thumb}}" class="contact-photo media-object {{$item.sparkle}}" id="wall-item-photo-{{$item.id}}" alt="{{$item.name}}" loading="lazy"/>
</div> </div>
</a> </a>
</div> </div>
<div class="hidden-lg hidden-md contact-photo-wrapper mframe{{if $item.owner_url}} wwfrom{{/if}}"> <div class="hidden-lg hidden-md contact-photo-wrapper mframe{{if $item.owner_url}} wwfrom{{/if}}">
<a href="{{$item.profile_url}}" class="userinfo click-card u-url" id="wall-item-photo-menu-xs-{{$item.id}}"> <a href="{{$item.profile_url}}" class="userinfo click-card u-url" id="wall-item-photo-menu-xs-{{$item.id}}">
<div class="contact-photo-image-wrapper"> <div class="contact-photo-image-wrapper">
<img src="{{$item.thumb}}" class="contact-photo-xs media-object {{$item.sparkle}}" id="wall-item-photo-xs-{{$item.id}}" alt="{{$item.name}}" /> <img src="{{$item.thumb}}" class="contact-photo-xs media-object {{$item.sparkle}}" id="wall-item-photo-xs-{{$item.id}}" alt="{{$item.name}}" loading="lazy"/>
</div> </div>
</a> </a>
</div> </div>

6
view/theme/frio/templates/wall_thread.tpl
View File

@ -68,14 +68,14 @@ as the value of $top_child_total (this is done at the end of this file)
<div class="hidden-sm hidden-xs contact-photo-wrapper mframe{{if $item.owner_url}} wwfrom{{/if}} p-author h-card"> <div class="hidden-sm hidden-xs contact-photo-wrapper mframe{{if $item.owner_url}} wwfrom{{/if}} p-author h-card">
<a class="userinfo click-card u-url" id="wall-item-photo-menu-{{$item.id}}" href="{{$item.profile_url}}"> <a class="userinfo click-card u-url" id="wall-item-photo-menu-{{$item.id}}" href="{{$item.profile_url}}">
<div class="contact-photo-image-wrapper"> <div class="contact-photo-image-wrapper">
<img src="{{$item.thumb}}" class="contact-photo media-object {{$item.sparkle}} p-name u-photo" id="wall-item-photo-{{$item.id}}" alt="{{$item.name}}" /> <img src="{{$item.thumb}}" class="contact-photo media-object {{$item.sparkle}} p-name u-photo" id="wall-item-photo-{{$item.id}}" alt="{{$item.name}}" loading="lazy"/>
</div> </div>
</a> </a>
</div> </div>
<div class="hidden-lg hidden-md contact-photo-wrapper mframe{{if $item.owner_url}} wwfrom{{/if}}"> <div class="hidden-lg hidden-md contact-photo-wrapper mframe{{if $item.owner_url}} wwfrom{{/if}}">
<a class="userinfo click-card u-url" id="wall-item-photo-menu-xs-{{$item.id}}" href="{{$item.profile_url}}"> <a class="userinfo click-card u-url" id="wall-item-photo-menu-xs-{{$item.id}}" href="{{$item.profile_url}}">
<div class="contact-photo-image-wrapper"> <div class="contact-photo-image-wrapper">
<img src="{{$item.thumb}}" class="contact-photo-xs media-object {{$item.sparkle}}" id="wall-item-photo-xs-{{$item.id}}" alt="{{$item.name}}" /> <img src="{{$item.thumb}}" class="contact-photo-xs media-object {{$item.sparkle}}" id="wall-item-photo-xs-{{$item.id}}" alt="{{$item.name}}" loading="lazy"/>
</div> </div>
</a> </a>
</div> </div>
@ -96,7 +96,7 @@ as the value of $top_child_total (this is done at the end of this file)
<div class="contact-photo-wrapper mframe{{if $item.owner_url}} wwfrom{{/if}} p-author h-card"> <div class="contact-photo-wrapper mframe{{if $item.owner_url}} wwfrom{{/if}} p-author h-card">
<a class="userinfo click-card u-url" id="wall-item-photo-menu-{{$item.id}}" href="{{$item.profile_url}}"> <a class="userinfo click-card u-url" id="wall-item-photo-menu-{{$item.id}}" href="{{$item.profile_url}}">
<div class="contact-photo-image-wrapper"> <div class="contact-photo-image-wrapper">
<img src="{{$item.thumb}}" class="contact-photo-xs media-object {{$item.sparkle}} p-name u-photo" id="wall-item-photo-comment-{{$item.id}}" alt="{{$item.name}}" /> <img src="{{$item.thumb}}" class="contact-photo-xs media-object {{$item.sparkle}} p-name u-photo" id="wall-item-photo-comment-{{$item.id}}" alt="{{$item.name}}" loading="lazy"/>
</div> </div>
</a> </a>
</div> </div>

2
view/theme/vier/templates/notifications/nav/notify.tpl
View File

@ -1,6 +1,6 @@
<li class="notification-{{if !$notify.seen}}un{{/if}}seen" onclick="location.href='{{$notify.href}}';"> <li class="notification-{{if !$notify.seen}}un{{/if}}seen" onclick="location.href='{{$notify.href}}';">
<div class="notif-entry-wrapper"> <div class="notif-entry-wrapper">
<div class="notif-photo-wrapper"><a href="{{$notify.contact.url}}"><img data-src="{{$notify.contact.photo}}"></a></div> <div class="notif-photo-wrapper"><a href="{{$notify.contact.url}}"><img data-src="{{$notify.contact.photo}}" loading="lazy"></a></div>
<div class="notif-desc-wrapper"> <div class="notif-desc-wrapper">
{{$notify.richtext nofilter}} {{$notify.richtext nofilter}}
<div><time class="notif-when" title="{{$notify.localdate}}">{{$notify.ago}}</time></div> <div><time class="notif-when" title="{{$notify.localdate}}">{{$notify.ago}}</time></div>