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 = {
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 }) {

View File

@ -1,42 +1,49 @@
import Layout from "@/components/layout/Layout"
import Banner from "@/components/sections/home2/Banner"
import Features from "@/components/sections/home2/Features"
import Testimonial from "@/components/sections/home1/Testimonial"
import Video from "@/components/sections/home1/Video"
import Solution from "@/components/sections/home2/Solution"
import AboutSection from "@/components/sections/home/AboutSection"
import ServicesSection from "@/components/sections/home/ServicesSection"
import WhyChooseUsSection from "@/components/sections/home/WhyChooseusSection"
import CounterSection from "@/components/sections/home/CounterSection"
import FaqSection from "@/components/sections/home/FaqSection"
import AreaOfInjury from "@/components/sections/home/AreaOfInjury"
import MobileServices from "@/components/sections/home/MobileServicesSection"
import MobileFeatureCard from "@/components/sections/home/MobileFeatureCard"
import MobileBanner from "@/components/sections/home2/MobileBanner"
"use client";
import { useState, useEffect } from "react";
import Layout from "@/components/layout/Layout";
import Banner from "@/components/sections/home2/Banner";
import Features from "@/components/sections/home2/Features";
import Testimonial from "@/components/sections/home1/Testimonial";
import Video from "@/components/sections/home1/Video";
import Solution from "@/components/sections/home2/Solution";
import AboutSection from "@/components/sections/home/AboutSection";
import ServicesSection from "@/components/sections/home/ServicesSection";
import WhyChooseUsSection from "@/components/sections/home/WhyChooseusSection";
import CounterSection from "@/components/sections/home/CounterSection";
import FaqSection from "@/components/sections/home/FaqSection";
import AreaOfInjury from "@/components/sections/home/AreaOfInjury";
import MobileServices from "@/components/sections/home/MobileServicesSection";
import MobileFeatureCard from "@/components/sections/home/MobileFeatureCard";
import MobileBanner from "@/components/sections/home2/MobileBanner";
export const metadata = {
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.",
};
// export const metadata = {
// 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.",
// };
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 (
<>
<Layout headerStyle={2} footerStyle={2}>
<div className="d-none d-md-block">
<Banner />
</div>
<div className="d-block d-md-none">
<MobileBanner />
</div>
{/* Prevent layout shift */}
<section style={{ minHeight: "100vh", position: "relative" }}>
{isMobile ? <MobileBanner /> : <Banner />}
</section>
<AboutSection />
<div className="d-none d-md-block">
<ServicesSection />
</div>
<div className="d-block d-md-none">
<MobileServices />
</div>
{isMobile ? <MobileServices /> : <ServicesSection />}
<MobileFeatureCard />
<Features />
<FaqSection />
@ -46,8 +53,6 @@ export default function Home() {
<Testimonial />
<Solution />
<Video />
</Layout>
</>
)
);
}

View File

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

View File

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