I've developed a website using the Next.js framework with Server Side Rendering (SSR), App Router, and Tailwind CSS for styling. While the site is functional, I've noticed that the Largest Contentful Paint (LCP) is higher than desired when analyzing the page speed.

To address this issue, I've already implemented some optimizations, such as lazy loading images. However, I'm still facing challenges in achieving the optimal LCP for a smoother user experience.

Here's a brief overview of the technologies and approaches I'm using:
1. Next.js for server-side rendering.
2. Using App Router
3. On-Demand ISR for Data Fetching
4. Tailwind CSS for styling
5. Images are rendered with priorities "high" & "lazy" based on demand
6. Images are served from CDN(Gumlet)
7. Used Dynamic Imports
8. Used "next/script" for third party scripts

I would greatly appreciate any insights or suggestions on further optimizations specific to this tech stack. Are there any best practices, specific configurations, or tools that I should consider to improve the LCP and overall page load performance?

I'm eager to learn from the community's expertise and enhance the user experience on my site. Thank you in advance for your valuable input!