performance issues fixed

This commit is contained in:
Alaguraj0361 2025-10-29 17:01:27 +05:30
parent f61b493641
commit 3b28c6907d
4 changed files with 71 additions and 57 deletions

View File

@ -10,7 +10,7 @@ import Script from "next/script";
export const metadata = { export const metadata = {
title: "Best Pain Relief & Physiotherapy - Repharehab Clinic", title: "Best Pain Relief & Physiotherapy - Repharehab Clinic",
description: "Best pain relief physiotherapy clinic", description: "Rapharehab offers trusted physiotherapy and pain relief treatments with professional care tailored to restore your health and mobility.",
}; };
export default function RootLayout({ children }) { export default function RootLayout({ children }) {

View File

@ -1,42 +1,49 @@
import Layout from "@/components/layout/Layout" "use client";
import Banner from "@/components/sections/home2/Banner" import { useState, useEffect } from "react";
import Features from "@/components/sections/home2/Features" import Layout from "@/components/layout/Layout";
import Testimonial from "@/components/sections/home1/Testimonial" import Banner from "@/components/sections/home2/Banner";
import Video from "@/components/sections/home1/Video" import Features from "@/components/sections/home2/Features";
import Solution from "@/components/sections/home2/Solution" import Testimonial from "@/components/sections/home1/Testimonial";
import AboutSection from "@/components/sections/home/AboutSection" import Video from "@/components/sections/home1/Video";
import ServicesSection from "@/components/sections/home/ServicesSection" import Solution from "@/components/sections/home2/Solution";
import WhyChooseUsSection from "@/components/sections/home/WhyChooseusSection" import AboutSection from "@/components/sections/home/AboutSection";
import CounterSection from "@/components/sections/home/CounterSection" import ServicesSection from "@/components/sections/home/ServicesSection";
import FaqSection from "@/components/sections/home/FaqSection" import WhyChooseUsSection from "@/components/sections/home/WhyChooseusSection";
import AreaOfInjury from "@/components/sections/home/AreaOfInjury" import CounterSection from "@/components/sections/home/CounterSection";
import MobileServices from "@/components/sections/home/MobileServicesSection" import FaqSection from "@/components/sections/home/FaqSection";
import MobileFeatureCard from "@/components/sections/home/MobileFeatureCard" import AreaOfInjury from "@/components/sections/home/AreaOfInjury";
import MobileBanner from "@/components/sections/home2/MobileBanner" import MobileServices from "@/components/sections/home/MobileServicesSection";
import MobileFeatureCard from "@/components/sections/home/MobileFeatureCard";
import MobileBanner from "@/components/sections/home2/MobileBanner";
export const metadata = { // export const metadata = {
title: "Best Pain Relief & Physiotherapy Rapharehab Clinic", // title: "Best Pain Relief & Physiotherapy Rapharehab Clinic",
description: "Rapharehab offers trusted physiotherapy and pain relief treatments with professional care tailored to restore your health and mobility.", // description:
}; // "Rapharehab offers trusted physiotherapy and pain relief treatments with professional care tailored to restore your health and mobility.",
// };
export default function Home() { export default function Home() {
const [isMobile, setIsMobile] = useState(false);
useEffect(() => {
// Run only in browser
const checkScreenSize = () => setIsMobile(window.innerWidth <= 768);
checkScreenSize();
window.addEventListener("resize", checkScreenSize);
return () => window.removeEventListener("resize", checkScreenSize);
}, []);
return ( return (
<>
<Layout headerStyle={2} footerStyle={2}> <Layout headerStyle={2} footerStyle={2}>
<div className="d-none d-md-block"> {/* Prevent layout shift */}
<Banner /> <section style={{ minHeight: "100vh", position: "relative" }}>
</div> {isMobile ? <MobileBanner /> : <Banner />}
<div className="d-block d-md-none"> </section>
<MobileBanner />
</div>
<AboutSection /> <AboutSection />
<div className="d-none d-md-block">
<ServicesSection /> {isMobile ? <MobileServices /> : <ServicesSection />}
</div>
<div className="d-block d-md-none">
<MobileServices />
</div>
<MobileFeatureCard /> <MobileFeatureCard />
<Features /> <Features />
<FaqSection /> <FaqSection />
@ -46,8 +53,6 @@ export default function Home() {
<Testimonial /> <Testimonial />
<Solution /> <Solution />
<Video /> <Video />
</Layout> </Layout>
</> );
)
} }

View File

@ -110,18 +110,15 @@ export default function AboutSection() {
alt="Physiotherapy at Rapha Rehab" alt="Physiotherapy at Rapha Rehab"
width={600} width={600}
height={420} height={420}
className="welcome-image-home"
sizes="(max-width: 480px) 90vw, (max-width: 768px) 70vw, (max-width: 1200px) 50vw, 600px"
priority priority
fetchPriority="high" quality={70} // ✅ reduce file size without visible loss
sizes="(max-width: 768px) 100vw, 382px"
placeholder="blur" placeholder="blur"
blurDataURL="/assets/images/home/welcome/home-welcome-blur.webp" blurDataURL="/assets/images/home/welcome/home-welcome-blur.webp"
style={{ style={{ width: "100%", height: "auto", borderRadius: "8px", display: "block" }}
borderRadius: "8px",
width: "100%",
height: "auto",
display: "block",
}}
/> />
</figure> </figure>
{/* Top Icon */} {/* Top Icon */}

View File

@ -798,9 +798,21 @@
min-height: 420px min-height: 420px
} }
.welcome-image-home {
width: 600px;
height: 420px;
}
@media (max-width:768px) { @media (max-width:768px) {
.about-main-image { .about-main-image {
min-height: 300px min-height: 300px
} }
} }
@media (max-width:500px) {
.welcome-image-home {
width: 382px !important;
height: 358px !important;
}
}