performance test

This commit is contained in:
Constantin Plaiasu 2024-08-26 01:03:16 +03:00
parent 2f58515264
commit 69e4ed3bff
7 changed files with 43 additions and 31 deletions

View file

@ -1 +0,0 @@
picture:after{content:"";top:0;left:0;bottom:-6px;width:100%;box-shadow:inset 1px 0 105px 105px #0d0d31;background:linear-gradient(to bottom,#0d0d3105,#0d0d31);background-color:#0d0d3188;position:absolute}picture>img{-o-object-fit:cover;object-fit:cover;-o-object-position:top;object-position:top;height:100%;width:100%;position:absolute;top:0}

View file

@ -0,0 +1 @@
picture{position:absolute;width:100%;top:0;min-height:720px}picture:after{content:"";top:0;left:0;bottom:-6px;width:100%;box-shadow:inset 1px 0 105px 105px #0d0d31;background:linear-gradient(to bottom,#0d0d3105,#0d0d31);background-color:#0d0d3188;position:absolute}picture>img{-o-object-fit:cover;object-fit:cover;-o-object-position:top;object-position:top;height:100%;width:100%;position:absolute;top:0}

View file

@ -76,7 +76,7 @@
"isEntry": true
},
"resources/scss/watch.scss": {
"file": "assets/watch-D6zQQVIa.css",
"file": "assets/watch-DqwsOmtD.css",
"src": "resources/scss/watch.scss",
"isEntry": true
}

View file

@ -1,24 +1,32 @@
picture:after {
picture {
position: absolute;
content: "";
top: 0;
left: 0;
bottom: -6px;
width: 100%;
box-shadow: inset 1px 0 105px 105px #0d0d31;
background: linear-gradient(to bottom, #0d0d3105, #0d0d31);
background-color: #0d0d3188;
position: absolute;
}
picture > img {
object-fit: cover;
object-position: top;
height: 100%;
width: 100%;
position: absolute;
top: 0;
width:100%;
top:0;
min-height:720px;
&:after {
position: absolute;
content: "";
top: 0;
left: 0;
bottom: -6px;
width: 100%;
box-shadow: inset 1px 0 105px 105px #0d0d31;
background: linear-gradient(to bottom, #0d0d3105, #0d0d31);
background-color: #0d0d3188;
position: absolute;
}
& > img {
object-fit: cover;
object-position: top;
height: 100%;
width: 100%;
position: absolute;
top: 0;
}
}

View file

@ -2,7 +2,10 @@
<div class="header__bottom">
<div class="container-fluid p-0">
<nav class="navbar navbar-expand-xl align-items-center p-0">
<a class="site-logo site-title" href="{{route('home')}}"><img width="150" heigh="38" src="{{asset('images/logo.svg')}}" alt="site-logo"><span class="logo-icon"><i class="flaticon-fire"></i></span></a>
<a class="site-logo site-title" href="{{route('home')}}">
<img src="{{asset('images/logo.svg')}}" width="150" height="37" alt="site-logo">
<span class="logo-icon"><i class="flaticon-fire"></i></span>
</a>
<button class="navbar-toggler ml-auto" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" type="button" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="menu-toggle"></span>
</button>
@ -20,7 +23,7 @@
@endforeach
</ul>
</li>
</ul>
<div class="nav-right d-flex ml-auto flex-wrap gap-4">
<button class="nav-right__search-btn"><i class="fas fa-search"></i></button>

View file

@ -36,7 +36,7 @@
{!! Vite::content('resources/scss/fa.scss') !!}
{!! Vite::content('resources/scss/la.scss') !!}
</style>
@vite(['resources/js/img.js'])
{{-- @vite(['resources/js/img.js']) --}}
{{-- <link rel="preload" as="script" href="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script> --}}
@vite(['resources/scss/app.scss'])
@ -83,9 +83,9 @@
{!! Vite::content('resources/js/img.js')!!}
</script> --}}
{{-- <script type='text/javascript' src='https://code.jquery.com/jquery-3.7.1.min.js'></script> --}}
<link rel="preload" as="script" href="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous">
{{-- <link rel="preload" as="script" href="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"> --}}
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
{{-- @vite(['resources/js/img.js'])--}}
@vite(['resources/js/img.js'])
{{-- @vite(['resources/js/jqfix.js']) --}}
@vite(['resources/js/app.js'])
@yield('footer')

View file

@ -8,7 +8,7 @@
{{-- <link rel="preload" as="image" href="{{img_url('w1280', $movie['backdrop_path'], true, 400, 225 )}}" type="image/webp" media="(max-width: 575px)"> --}}
{{-- <link rel="preload" as="image" href="{{img_url('w1280', $movie['backdrop_path'], true, 400, 225 )}}" type="image/webp" media="(max-width: 575px)"> --}}
{{-- <link rel="preload" as="image" href="{{img_url('w1280', $movie['backdrop_path'], true, 400, 225 )}}" type="image/webp" media="(max-width: 575px)"> --}}
<link rel="preload" as="image" type="image/webp" href="{{img_url('w1280', $movie['backdrop_path'], true, 400, 225 )}}" imagesrcset="{{img_url('w1280', $movie['backdrop_path'], true, 400, 225 )}} 576w, {{img_url('w1280', $movie['backdrop_path'], true, 1280, 720 )}} 1200w" imagesizes="100vw" />
<link rel="preload" as="image" type="image/webp" href="{{img_url('w1280', $movie['backdrop_path'], true, 400, 225 )}}" imagesrcset="{{img_url('w1280', $movie['backdrop_path'], true, 400, 225 )}} 400w, {{img_url('w1280', $movie['backdrop_path'], true, 1280, 720 )}} 1280w" imagesizes="80vw, 100vw" fetchpriority="high" />
<style>
{!! Vite::content('resources/scss/watch.scss') !!}
</style>
@ -19,11 +19,12 @@
{{-- @endsection --}}
@section('app')
<section class="inner-hero bg_img dark--overlay lazy main-watch" data-id="{{ $movie['id'] }}" data-type="movie">
<picture style="position: absolute; width:100%; top:0; min-height:720px">
@if(isset($movie['backdrop']) && $movie['backdrop'] !== '')
<source type="image/webp" data-srcset="{{img_url('w1280', $movie['backdrop_path'], true, 400, 225 )}} 576w, {{img_url('w1280', $movie['backdrop_path'], true, 1280, 720 )}} 1200w">
@endif
<img @if(isset($movie['backdrop']) && $movie['backdrop'] !== '') data-src="{{img_url('w1280', $movie['backdrop_path'], true, 1280, 720 )}}" @endif width="100%" height="720" class="lazy" alt="{{ str($movie['title'])->apa() }} ({{ $movie['year'] }})" src="data:image/svg+xml,%3Csvg width='1280' height='720' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='1280' height='720' x='0' y='0' fill='%231B1B3F' /%3E%3C/svg%3E" sizes="100vw">
<picture>
{{-- @if(isset($movie['backdrop']) && $movie['backdrop'] !== '')
<source type="image/webp" media="(max-width:767px)" data-src="{{img_url('w1280', $movie['backdrop_path'], true, 400, 225 )}}">
<source type="image/webp" media="(min-width:768px)" data-src="{{img_url('w1280', $movie['backdrop_path'], true, 1280, 720 )}}">
@endif --}}
<img @if(isset($movie['backdrop']) && $movie['backdrop'] !== '') data-src="{{img_url('w1280', $movie['backdrop_path'], true, 400, 225 )}}" data-srcset="{{img_url('w1280', $movie['backdrop_path'], true, 400, 225 )}} 400w, {{img_url('w1280', $movie['backdrop_path'], true, 1280, 720 )}} 1280w" class="lazy" @endif width="100%" height="720" alt="{{ str($movie['title'])->apa() }} ({{ $movie['year'] }})" src="data:image/svg+xml,%3Csvg width='1280' height='720' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='1280' height='720' x='0' y='0' fill='%231B1B3F' /%3E%3C/svg%3E" data-sizes="80vw, 100vw">
</picture>
<div class="container position-relative">
<div class="row">