Measure on real pages and mobile conditions, identify the biggest bottleneck, then reduce unnecessary bytes and work. Optimize the critical path first: server response, hero media, render-blocking assets, JavaScript execution, font loading, and third-party scripts.
Measure before changing things
Use lab tools and field data where available. Check the home page, a content-heavy page, a project page, and any conversion page. A perfect score on one synthetic run matters less than a consistently responsive experience for real users.
Optimize images and media
Serve correctly sized images, use modern formats, compress without destroying quality, lazy-load below-the-fold media, and avoid downloading desktop-sized assets on small screens. Hero images deserve special attention because they often influence Largest Contentful Paint.
Reduce JavaScript work
Remove unused libraries, defer non-critical scripts, split heavy features, and avoid running visual effects on mobile when they do not improve the task. Large DOM updates, continuous animation, and expensive event handlers can make a page feel slow even after it has technically loaded.
Control CSS, fonts, and layout shifts
Keep critical styles predictable, reduce unused CSS, preload only assets that are truly critical, and reserve space for images and embeds. Use sensible font fallbacks and avoid loading many font weights that provide little visual value.
Improve caching and server delivery
Use appropriate cache headers for versioned static assets, a CDN where useful, compressed responses, and efficient backend/database queries. Avoid caching HTML so aggressively that users receive stale content after important updates.
Treat mobile as its own performance target
A fast desktop on a powerful machine can hide problems. Test 360–430px layouts, touch interactions, mobile menus, full-screen viewers, and lower-end devices. Reduce effects and initial project counts when the mobile experience benefits from progressive loading.