/products
Unoptimized images contain redundant data. Compress them to improve LCP.
Unoptimized JPEG/PNG images contain metadata and redundant pixel data. Lossless or lossy compression can cut size 30-60% with no perceptible quality difference — directly improving LCP.
// Intervention Image v3 — optimize on upload
use Intervention\Image\ImageManager;
use Intervention\Image\Drivers\Gd\Driver;
$manager = new ImageManager(new Driver());
$manager->read($path)
->toWebp(quality: 80)
->save(storage_path('app/public/images/hero.webp'));
// Storing raw upload with no compression
$request->file('image')->store('images'); // may be a 4 MB JPEG
JavaScript shipped to the browser but never executed wastes bandwidth and parse time.
Unused JavaScript still costs network bandwidth, parse time, and CPU. The browser must download, parse, and compile every byte you ship — even if it never executes.
// Lazy-load route-specific JS
const Dashboard = () => import('./Dashboard.js');
// Or use @vite directive in Blade
@vite(['resources/js/app.js'])
<!-- Loading the entire bundle on every page -->
<script src="/build/everything.js"></script>
<script src="/build/assets/app-abc.js"></script>
main > section.hero > img
<img src="/images/hero.jpg" loading="eager">
|
Type
|
Count
|
Size
|
|---|---|---|
| script | 11 | 733 KB |
| stylesheet | 4 | 77 KB |
| image | 22 | 735 KB |
| font | 4 | 107 KB |
| document | 1 | 10 KB |
|
Entity
|
Transfer
|
Blocking
|
Main thread
|
|---|---|---|---|
| Google Analytics | 23 KB | 60ms | 100ms |
|
URL
|
Type
|
Size
|
Duration
|
|---|---|---|---|
vendor.js
|
371 KB | ||
products
|
24 KB |
app.js
240ms
vendor.js
143ms