improvement(landing): optimize hero and customer image loading

[waleedlatif1]

Summary

• Serve pre-encoded responsive hero artwork with content-hashed caching and a desktop-only preload.
• Match customer-card image sizes to their layout and prioritize the first rendered card.

Type of Change

• Performance improvement

Testing

• 14 focused tests passed, along with full lint, all 46 repository audits, block-registry validation, and the docs-manifest check.
• Manually checked mobile, landscape, desktop, ultrawide, and Retina image selection, both themes, navigation, and video playback.
• Verified all generated images match the existing encoder output byte-for-byte and that the desktop artwork does not download below its visibility breakpoint.
• Production build not run locally.

Checklist

• Code follows project style guidelines
• Self-reviewed my changes
• Tests added/updated and passing
• No new warnings introduced
• I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated
docs	Ready	Preview	Sep 9, 2026 8:36pm UTC

[greptile-apps]

Greptile Summary

This PR improves landing-page image delivery without changing application behavior:

• Replaces runtime hero optimization with pre-encoded, content-hashed AVIF and WebP candidates.
• Restricts hero preloading to desktop viewports and adds immutable caching for generated artwork.
• Supplies layout-accurate customer-card image sizes and prioritizes only the first rendered story.
• Adds focused server-rendering tests for preload, responsive-source, and card-priority behavior.

Confidence Score: 5/5

The PR appears safe to merge; the responsive selection, breakpoint-scoped preload, caching, and customer-card priority behavior align with their layouts and intended performance goals.

No actionable correctness, security, or repository-rule violations remain after checking the image-loading paths, responsive sizing calculations, component callers, and generation workflow.

Important Files Changed

Filename	Overview
apps/sim/app/(landing)/components/hero/components/hero-platform-stage/hero-platform-stage.tsx	Adds a breakpoint-scoped responsive artwork preload and serves pre-encoded AVIF/WebP candidates.
scripts/generate-hero-artwork.ts	Generates hashed responsive artwork and an associated TypeScript source manifest using the established artwork workflow.
apps/sim/app/(landing)/customers/page.tsx	Passes grid-accurate image sizes and prioritizes the first customer story that is actually rendered.
apps/sim/app/(landing)/customers/components/customer-story-card/customer-story-card.tsx	Propagates configurable image sizing and preload priority with a layout-appropriate default.
apps/sim/next.config.ts	Applies immutable caching to the new content-hashed hero artwork directory.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart LR
  V[Viewport and device pixel ratio] --> M{Viewport at least 1024px?}
  M -->|No| MW[Render mobile workflow]
  M -->|Yes| P[Preload selected AVIF candidate]
  P --> S[Select AVIF or WebP from responsive srcset]
  S --> C[Serve content-hashed asset with immutable cache]
  D[Published customer stories] --> F[Filter stories with content]
  F --> G[Render responsive card grid]
  G --> Q[Preload first rendered card image]

Loading

_{Reviews (1): Last reviewed commit: "improvement(landing): optimize hero and ..." | Re-trigger Greptile}