Level 29
Not sure about the performance but what I see in your code is that you're using too much nested divs within your section.
Feb 3, 2024
9
Level 2
Is lighthouse good for testing performance?
Hello I've got web app made in laravel, on desktop device i have got 95 overall performance, but while i am testing it on mobile device i am getting this results
First Contentful Paint
6.0 s
Largest Contentful Paint
7.1 s
Total Blocking Time
0 ms
Cumulative Layout Shift
0.012
Speed Index
6.3 s
and it shows me that the Largest Contentful Paint is directly in paragraph block, i dont even know how can I improve this .. :/
<section class="home" id="úvod">
<div class="container">
<div class="row mt-5">
<div class="col-lg-6 mt-5">
<h1 class="display-3 text-white">Nech své vlasy promluvit</h1>
<p class="text-white">V našem barbershopu nejde jen o úpravu vlasů a vousů, ale o vytvoření jedinečného stylu,
který vypráví Váš osobní příběh. Zapomeňte na obyčejné stříhání – u nás začíná cesta k novému
vzhledu, kterým budete vyprávět svůj příběh. Vaše vlasy jsou naším plátnem – a my
jim dáme hlas. Nechte své vlasy promluvit s námi!</p>
<a href="#rezervace"><button type="button" class="btn btn-brand">
Objednej se
</button></a>
</div>
</div>
</div>
</section>
i am first time preparing app for production, and i will be glad for any advice with that :/
Level 2
@gych will try refactor that and let you know, thanks for advice!
1 like
Level 50
@gych Looks like a perfectly normal bootstrap grid to me. Do you want to elaborate?
Level 29
@JussiMannisto Yes you're right it is a normal bootstrap grid but is it really necessary to use a bootstrap row grid for only one column in this case?
Why not just use it like this?
<section class="home container pt-5" id="úvod">
<div class="col-lg-6 pt-5">
<h1 class="display-3 text-white">Nech své vlasy promluvit</h1>
<p class="text-white">V našem barbershopu nejde jen o úpravu vlasů a vousů, ale o vytvoření jedinečného stylu,
který vypráví Váš osobní příběh. Zapomeňte na obyčejné stříhání – u nás začíná cesta k novému
vzhledu, kterým budete vyprávět svůj příběh. Vaše vlasy jsou naším plátnem – a my
jim dáme hlas. Nechte své vlasy promluvit s námi!</p>
<a href="#rezervace"><button type="button" class="btn btn-brand">
Objednej se
</button></a>
</div>
</section>
Level 122
@gych optimising this will make 0.000000001% difference
Level 2
@gych unfortunately nothing worked :/ :( ..
First Contentful Paint
1.1 s
Largest Contentful Paint
1.3 s
Total Blocking Time
0 ms
Cumulative Layout Shift
0.006
Speed Index
1.1 s
performance on desktop is ok
Level 29
@Snapey, yes, I know, but thanks for mentioning that. I just shared my ideas on how that section could be improved, based on the structure that's used. Therefore, I started my reply with 'Not sure about the performance'
Level 29
@jakubjv Can you share the URL of your website?
Level 2
@gych I've got it still in development, i am in phase right before production, unfortunately i don't have url which i can provide to you :/
Please or to participate in this conversation.