Skip to content

Add native lazy-loading to BlogPostCard component to improve performance#499

Closed
harnish7576 wants to merge 2 commits intomainfrom
feat/478-adding-lazy-loading-on-research-page
Closed

Add native lazy-loading to BlogPostCard component to improve performance#499
harnish7576 wants to merge 2 commits intomainfrom
feat/478-adding-lazy-loading-on-research-page

Conversation

@harnish7576
Copy link
Collaborator

Fixes #478

Description

  • This PR improves Research page performance by enabling native lazy-loading for blog post images in BlogPostCard.

Modifications

  • Previously, ~160 images loaded on page mount, causing high network usage and slower initial render. Adding loading="lazy" defers image loading until they enter the viewport, reducing initial load time while preserving layout stability due to the fixed-height image container.

Manual Browser Testing

  • Only top-of-page images load initially.
  • Additional image requests only fire when scrolling near them.
Screenshot 2025-12-05 at 12 03 21 AM

@harnish7576 harnish7576 self-assigned this Dec 5, 2025
@vercel
Copy link

vercel bot commented Dec 5, 2025

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

Project Deployment Preview Comments Updated (UTC)
policyengine-app-v2 Ready Ready Preview Comment Dec 5, 2025 5:16am
policyengine-calculator Error Error Dec 5, 2025 5:16am
policyengine-website Ready Ready Preview Comment Dec 5, 2025 5:16am

@MaxGhenis
Copy link
Contributor

Closing — the Next.js migration will use next/image with built-in lazy loading, making this change unnecessary. Thank you for the contribution!

@MaxGhenis MaxGhenis closed this Mar 9, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Implement lazy/batched loading for research page images to improve initial page load

2 participants