From 5d187e548ba66da3a163712ce3bc70e88a0d3e8d Mon Sep 17 00:00:00 2001 From: zhangxiang Date: Thu, 3 Sep 2026 17:36:34 +0800 Subject: [PATCH] =?UTF-8?q?perf(motion):=20=E8=90=A5=E9=94=80=E9=A1=B5?= =?UTF-8?q?=E5=85=A5=E5=9C=BA=E5=8A=A8=E6=95=88=E6=97=B6=E9=95=BF=E6=94=B6?= =?UTF-8?q?=E6=95=9B=E8=87=B3=20300ms?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 对齐 CONTEXT.md 动效四原则:入场 200-300ms、硬上限 700ms。 - 5 个营销页共 45 处 duration 由 0.8 / 1 收敛为 0.3 - 审计基线:P0 硬违规 99 → 54,P1 164 → 163,P2 持平 28 - 改动 100% 为 transition duration,零文案变更 --- .../(marketing)/about/about-content-v4.tsx | 24 +++++++++---------- .../(marketing)/cases/cases-content-v3.tsx | 16 ++++++------- .../services/service-detail-content-v4.tsx | 18 +++++++------- .../services/services-content-v3.tsx | 18 +++++++------- .../solutions/solutions-content-v3.tsx | 14 +++++------ 5 files changed, 45 insertions(+), 45 deletions(-) diff --git a/src/app/(marketing)/about/about-content-v4.tsx b/src/app/(marketing)/about/about-content-v4.tsx index db201b7..b1a4fab 100644 --- a/src/app/(marketing)/about/about-content-v4.tsx +++ b/src/app/(marketing)/about/about-content-v4.tsx @@ -54,7 +54,7 @@ function HeroSection({ data }: { data: AboutData }) { {data.heroSubtitle || ''} @@ -63,7 +63,7 @@ function HeroSection({ data }: { data: AboutData }) { {titleLines.map((line, i) => ( @@ -77,7 +77,7 @@ function HeroSection({ data }: { data: AboutData }) { style={{ transformOrigin: 'left' }} initial={{ scaleX: 0 }} animate={{ scaleX: 1 }} - transition={{ duration: 0.8, delay: 1.2, ease: EASE_OUT }} + transition={{ duration: 0.3, delay: 1.2, ease: EASE_OUT }} /> @@ -91,7 +91,7 @@ function HeroSection({ data }: { data: AboutData }) { {data.heroDescription || ''} @@ -100,7 +100,7 @@ function HeroSection({ data }: { data: AboutData }) { @@ -161,7 +161,7 @@ function WhoWeAreSection({ data }: { data: AboutData }) { initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.8, ease: EASE_OUT }} + transition={{ duration: 0.3, ease: EASE_OUT }} className="lg:col-span-5" >
@@ -190,7 +190,7 @@ function WhoWeAreSection({ data }: { data: AboutData }) { initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.8, delay: 0.15, ease: EASE_OUT }} + transition={{ duration: 0.3, delay: 0.15, ease: EASE_OUT }} className="lg:col-span-7" >
@@ -240,7 +240,7 @@ function MilestonesSection({ data }: { data: AboutData }) { initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.8, ease: EASE_OUT }} + transition={{ duration: 0.3, ease: EASE_OUT }} className="max-w-3xl mb-16 sm:mb-20 md:mb-24" >
@@ -303,7 +303,7 @@ function CertificationsSection({ data }: { data: AboutData }) { initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.8, ease: EASE_OUT }} + transition={{ duration: 0.3, ease: EASE_OUT }} className="max-w-3xl" >
@@ -336,7 +336,7 @@ function CertificationsSection({ data }: { data: AboutData }) { initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.8, ease: EASE_OUT }} + transition={{ duration: 0.3, ease: EASE_OUT }} >
Certifications @@ -370,7 +370,7 @@ function CertificationsSection({ data }: { data: AboutData }) { initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.8, delay: 0.15, ease: EASE_OUT }} + transition={{ duration: 0.3, delay: 0.15, ease: EASE_OUT }} >
Partners @@ -411,7 +411,7 @@ function CTASection({ data }: { data: AboutData }) { initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.8, ease: EASE_OUT }} + transition={{ duration: 0.3, ease: EASE_OUT }} className="max-w-3xl" >

diff --git a/src/app/(marketing)/cases/cases-content-v3.tsx b/src/app/(marketing)/cases/cases-content-v3.tsx index 0dbe8fd..77e8831 100644 --- a/src/app/(marketing)/cases/cases-content-v3.tsx +++ b/src/app/(marketing)/cases/cases-content-v3.tsx @@ -128,7 +128,7 @@ export default function CasesContentV3({ Case Studies @@ -137,7 +137,7 @@ export default function CasesContentV3({
{heroTitle1}
@@ -150,7 +150,7 @@ export default function CasesContentV3({ style={{ transformOrigin: 'left' }} initial={{ scaleX: 0 }} animate={{ scaleX: 1 }} - transition={{ duration: 0.8, delay: 1.2, ease: EASE_OUT }} + transition={{ duration: 0.3, delay: 1.2, ease: EASE_OUT }} /> @@ -160,7 +160,7 @@ export default function CasesContentV3({ {heroDescriptionLines.map((line, i) => ( @@ -174,7 +174,7 @@ export default function CasesContentV3({ @@ -231,7 +231,7 @@ export default function CasesContentV3({ initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.8, ease: EASE_OUT }} + transition={{ duration: 0.3, ease: EASE_OUT }} className="lg:max-w-2xl" >
@@ -249,7 +249,7 @@ export default function CasesContentV3({ initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.8, delay: 0.15, ease: EASE_OUT }} + transition={{ duration: 0.3, delay: 0.15, ease: EASE_OUT }} >
@@ -297,7 +297,7 @@ export default function CasesContentV3({ initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.8, ease: EASE_OUT }} + transition={{ duration: 0.3, ease: EASE_OUT }} className="max-w-3xl" >

diff --git a/src/app/(marketing)/services/service-detail-content-v4.tsx b/src/app/(marketing)/services/service-detail-content-v4.tsx index 938a82b..c86a336 100644 --- a/src/app/(marketing)/services/service-detail-content-v4.tsx +++ b/src/app/(marketing)/services/service-detail-content-v4.tsx @@ -21,7 +21,7 @@ function DetailHero({ service }: { service: Service }) {
{service.title}
@@ -34,7 +34,7 @@ function DetailHero({ service }: { service: Service }) { style={{ transformOrigin: 'left' }} initial={{ scaleX: 0 }} animate={{ scaleX: 1 }} - transition={{ duration: 0.8, delay: 1.2, ease: EASE_OUT }} + transition={{ duration: 0.3, delay: 1.2, ease: EASE_OUT }} /> @@ -44,7 +44,7 @@ function DetailHero({ service }: { service: Service }) { {service.description} @@ -53,7 +53,7 @@ function DetailHero({ service }: { service: Service }) {
@@ -79,7 +79,7 @@ function DetailHero({ service }: { service: Service }) { @@ -107,7 +107,7 @@ function OverviewSection({ service }: { service: Service }) { initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.8, ease: EASE_OUT }} + transition={{ duration: 0.3, ease: EASE_OUT }} className="lg:col-span-5" >

@@ -119,7 +119,7 @@ function OverviewSection({ service }: { service: Service }) { initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.8, delay: 0.15, ease: EASE_OUT }} + transition={{ duration: 0.3, delay: 0.15, ease: EASE_OUT }} className="lg:col-span-7" >

@@ -151,7 +151,7 @@ function FeaturesSection({ service }: { service: Service }) { initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.8, ease: EASE_OUT }} + transition={{ duration: 0.3, ease: EASE_OUT }} className="max-w-3xl mb-16 sm:mb-20 md:mb-24" >

@@ -207,7 +207,7 @@ function ProcessSection({ service }: { service: Service }) { initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.8, ease: EASE_OUT }} + transition={{ duration: 0.3, ease: EASE_OUT }} className="max-w-3xl mb-16 sm:mb-20 md:mb-24" >

diff --git a/src/app/(marketing)/services/services-content-v3.tsx b/src/app/(marketing)/services/services-content-v3.tsx index ba20267..8387ed7 100644 --- a/src/app/(marketing)/services/services-content-v3.tsx +++ b/src/app/(marketing)/services/services-content-v3.tsx @@ -87,7 +87,7 @@ function HeroSection({ pageCopy }: { pageCopy?: PageCopy | null }) {
{heroTitle1}
@@ -100,7 +100,7 @@ function HeroSection({ pageCopy }: { pageCopy?: PageCopy | null }) { style={{ transformOrigin: 'left' }} initial={{ scaleX: 0 }} animate={{ scaleX: 1 }} - transition={{ duration: 0.8, delay: 1.2, ease: EASE_OUT }} + transition={{ duration: 0.3, delay: 1.2, ease: EASE_OUT }} /> @@ -110,7 +110,7 @@ function HeroSection({ pageCopy }: { pageCopy?: PageCopy | null }) { {heroDescriptionLines.map((line, i) => ( @@ -124,7 +124,7 @@ function HeroSection({ pageCopy }: { pageCopy?: PageCopy | null }) { @@ -138,7 +138,7 @@ function HeroSection({ pageCopy }: { pageCopy?: PageCopy | null }) {
@@ -191,7 +191,7 @@ function ServicesGridSection({ services, pageCopy }: { services?: Service[]; pag initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.8, ease: EASE_OUT }} + transition={{ duration: 0.3, ease: EASE_OUT }} className="max-w-3xl mb-16 sm:mb-20 md:mb-24" >

@@ -266,7 +266,7 @@ function ProcessModesSection() { initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.8, ease: EASE_OUT }} + transition={{ duration: 0.3, ease: EASE_OUT }} className="lg:col-span-7" >

@@ -299,7 +299,7 @@ function ProcessModesSection() { initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.8, delay: 0.15, ease: EASE_OUT }} + transition={{ duration: 0.3, delay: 0.15, ease: EASE_OUT }} className="lg:col-span-5" >

@@ -343,7 +343,7 @@ function CTASection({ pageCopy }: { pageCopy?: PageCopy | null }) { initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.8, ease: EASE_OUT }} + transition={{ duration: 0.3, ease: EASE_OUT }} className="max-w-3xl" >

diff --git a/src/app/(marketing)/solutions/solutions-content-v3.tsx b/src/app/(marketing)/solutions/solutions-content-v3.tsx index 2e90542..54320de 100644 --- a/src/app/(marketing)/solutions/solutions-content-v3.tsx +++ b/src/app/(marketing)/solutions/solutions-content-v3.tsx @@ -35,7 +35,7 @@ function HeroSection({ pageCopy }: { pageCopy?: PageCopy | null }) {
{heroTitle1}
@@ -48,7 +48,7 @@ function HeroSection({ pageCopy }: { pageCopy?: PageCopy | null }) { style={{ transformOrigin: 'left' }} initial={{ scaleX: 0 }} animate={{ scaleX: 1 }} - transition={{ duration: 0.8, delay: 1.2, ease: EASE_OUT }} + transition={{ duration: 0.3, delay: 1.2, ease: EASE_OUT }} /> @@ -58,7 +58,7 @@ function HeroSection({ pageCopy }: { pageCopy?: PageCopy | null }) { {heroDescriptionLines.map((line, i) => ( @@ -72,7 +72,7 @@ function HeroSection({ pageCopy }: { pageCopy?: PageCopy | null }) { @@ -86,7 +86,7 @@ function HeroSection({ pageCopy }: { pageCopy?: PageCopy | null }) {
@@ -193,7 +193,7 @@ function SolutionsGridSection({ solutions, products, pageCopy }: { solutions: So initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.8, ease: EASE_OUT }} + transition={{ duration: 0.3, ease: EASE_OUT }} className="max-w-3xl mb-16 sm:mb-20 md:mb-24" >

@@ -224,7 +224,7 @@ function CTASection({ pageCopy }: { pageCopy?: PageCopy | null }) { initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.8, ease: EASE_OUT }} + transition={{ duration: 0.3, ease: EASE_OUT }} className="max-w-3xl" >