novalon/novalon-website
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf(motion): 第二批入场动效时长收敛至 300ms（4 文件 21 处）

Browse Source 
承接 8fb5aae，继续清理 Task #16 的 P0 硬违规（>700ms 明确禁止）：

- contact-content-v3 (7) / case-detail-page (6) / product-detail-content-v3 (5) /
  detail-hero (3 处入场)
- 审计：P0 54 → 33，P1 163 持平，P2 28 持平
- 只改 duration，保留原 delay（与首批先例一致）；改动行已逐行核验为纯动效行

验证：
- tsc --noEmit 0 error；eslint 4 个改动文件 0 error
- 单测 131 套件 / 1662 通过 / 2 跳过 / EXIT=0（与基线一致）
- 视觉基线零变动：reducedMotion+animations disabled 下终态一致，
  时长改动不改变最终像素；不带 -u 复跑 92 用例 EXIT=0
This commit is contained in:
zhangxiang
2026-09-03 18:54:16 +08:00
parent c9df2e40c5
commit 8117dba865
4 changed files with 21 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/(marketing)/contact/contact-content-v3.tsx
+7 -7
View File
@@ -223,7 +223,7 @@ function ContactFormContent({ data }: { data: ContactData }) {
<motion.div
initial={{ opacity: 0, y: 20 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.8, delay: 0.1, ease: EASE_OUT }}
transition={{ duration: 0.3, delay: 0.1, ease: EASE_OUT }}
className="text-sm font-mono tracking-[0.15em] text-text-muted mb-8"
>
{data.heroSubtitle || ''}
@@ -232,7 +232,7 @@ function ContactFormContent({ data }: { data: ContactData }) {
<motion.h1
initial={{ opacity: 0, y: 40 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 1, delay: 0.2, ease: EASE_OUT }}
transition={{ duration: 0.3, delay: 0.2, ease: EASE_OUT }}
className="text-4xl sm:text-5xl md:text-6xl lg:text-7xl xl:text-8xl font-black text-ink leading-[0.88] tracking-tightest mb-10 sm:mb-12 md:mb-16"
>
{heroTitleLines.map((line, i) => (
@@ -246,7 +246,7 @@ function ContactFormContent({ data }: { data: ContactData }) {
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 }}
/>
</span>
</span>
@@ -260,7 +260,7 @@ function ContactFormContent({ data }: { data: ContactData }) {
<motion.p
initial={{ opacity: 0, y: 30 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.8, delay: 0.5, ease: EASE_OUT }}
transition={{ duration: 0.3, delay: 0.5, ease: EASE_OUT }}
className="text-lg md:text-xl text-text-secondary max-w-2xl leading-relaxed mb-12 sm:mb-16"
>
{data.heroDescription || ''}
@@ -278,7 +278,7 @@ function ContactFormContent({ data }: { data: ContactData }) {
initial={{ opacity: 0, y: 30 }}
whileInView={{ opacity: 1, y: 0 }}
viewport={{ once: true, margin: '-60px' }}
transition={{ duration: 0.8, ease: EASE_OUT }}
transition={{ duration: 0.3, ease: EASE_OUT }}
className="lg:col-span-2 space-y-8"
>
<div>
@@ -348,7 +348,7 @@ function ContactFormContent({ data }: { data: ContactData }) {
initial={{ opacity: 0, y: 30 }}
whileInView={{ opacity: 1, y: 0 }}
viewport={{ once: true, margin: '-60px' }}
transition={{ duration: 0.8, delay: 0.1, ease: EASE_OUT }}
transition={{ duration: 0.3, delay: 0.1, ease: EASE_OUT }}
className="lg:col-span-3"
>
<div className="relative border border-border-primary bg-white p-6 sm:p-8 lg:p-10 h-full overflow-hidden" id="contact-form-section">
@@ -513,7 +513,7 @@ function ContactFormContent({ data }: { data: ContactData }) {
initial={{ opacity: 0, y: 30 }}
whileInView={{ opacity: 1, y: 0 }}
viewport={{ once: true, margin: '-60px' }}
transition={{ duration: 0.8, ease: EASE_OUT }}
transition={{ duration: 0.3, ease: EASE_OUT }}
className="max-w-3xl mx-auto text-center"
>
<div className="text-sm font-mono tracking-[0.2em] text-text-muted uppercase mb-8">
src/app/(marketing)/products/product-detail-content-v3.tsx
+5 -5
View File
@@ -32,7 +32,7 @@ function DetailHero({ product }: DetailHeroProps) {
<motion.div
initial={{ opacity: 0, y: 30 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.8, ease: EASE_OUT }}
transition={{ duration: 0.3, ease: EASE_OUT }}
className="flex items-center gap-4 mb-8"
>
<div className="w-16 h-16 rounded-2xl bg-brand-soft flex items-center justify-center text-brand">
@@ -60,7 +60,7 @@ function DetailHero({ product }: DetailHeroProps) {
<motion.h1
initial={{ opacity: 0, y: 50 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 1, delay: 0.15, ease: EASE_OUT }}
transition={{ duration: 0.3, delay: 0.15, ease: EASE_OUT }}
className="text-3xl sm:text-4xl md:text-5xl lg:text-6xl font-bold text-ink leading-tight tracking-tighter mb-6 sm:mb-8 max-w-4xl"
>
{product.title}
@@ -69,7 +69,7 @@ function DetailHero({ product }: DetailHeroProps) {
<motion.p
initial={{ opacity: 0, y: 40 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.9, delay: 0.3, ease: EASE_OUT }}
transition={{ duration: 0.3, delay: 0.3, ease: EASE_OUT }}
className="text-xl lg:text-2xl text-text-secondary max-w-3xl leading-relaxed mb-8"
>
{product.description}
@@ -78,7 +78,7 @@ function DetailHero({ product }: DetailHeroProps) {
<motion.p
initial={{ opacity: 0, y: 40 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.9, delay: 0.4, ease: EASE_OUT }}
transition={{ duration: 0.3, delay: 0.4, ease: EASE_OUT }}
className="text-lg text-text-muted max-w-3xl leading-relaxed mb-12"
>
{product.overview}
@@ -87,7 +87,7 @@ function DetailHero({ product }: DetailHeroProps) {
<motion.div
initial={{ opacity: 0, y: 40 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.9, delay: 0.55, ease: EASE_OUT }}
transition={{ duration: 0.3, delay: 0.55, ease: EASE_OUT }}
className="flex flex-wrap gap-6"
>
<CTAButton href="/contact" dataTestId="product-detail-hero-primary">